DevAdventCalendar · Inne · opensource

Headery strony w social mediach

Dzisiaj post o czymś, o czym zwykle nie myślimy, nie zwracamy na to uwagi. O nagłówku strony. Okazuje się, że jego konfiguracja jest bardzo ważna, w momencie gdy chcemy dzielić się linkiem do strony np. na fb/tt.

Na nagłówek może się składać się tytuł strony, jej opis oraz zdjęcie.

Open graph protocol

W skrócie – open graph protocol umożliwia wykorzystywanie metadanych w htmlu, które są rozpoznawane przez social media i odpowiednio renderowane.O tym można, a nawet warto poczytać na oficjalnej stronie.

Og: image

Jest to bardzo ważna składowa nagłówka. Pozwala na wstawienie zdjęcia, które w odpowiedni sposób będzie wyświetlane w mediach społecznościowych. Jeśli będzie małe, będzie wyglądać tak:

Jeśli będzie duże (min. 500×500), to już inaczej:

Ostateczny kod wygląda następująco:

Dodatkowa rada – linux, windows i rozszerzenia plików

Linuks ma to do siebie, że dla niego .JPG i .jpg to zupełnie inne pliki. Dlatego jeśli masz serwer linuksowy – strzeż się!

Dodatkowo zmiana rozszerzenia na windowsie (.JPG -> .jpg i odwrotnie) nie jest rozpoznawany przez git jako zmiana pliku. Na to również uważaj.

Skomentuj

Wprowadź swoje dane lub kliknij jedną z tych ikon, aby się zalogować:

Logo WordPress.com

Komentujesz korzystając z konta WordPress.com. Wyloguj /  Zmień )

Zdjęcie na Google

Komentujesz korzystając z konta Google. Wyloguj /  Zmień )

Zdjęcie z Twittera

Komentujesz korzystając z konta Twitter. Wyloguj /  Zmień )

Zdjęcie na Facebooku

Komentujesz korzystając z konta Facebook. Wyloguj /  Zmień )

Połączenie z %s