14 czerwca 2015

Nieprawidłowe wczytywanie miniatur i tytułów postów z linków umieszczonych na Facebooku

Wczoraj wraz z Magdą z bloga Madl-len.pl spędziłyśmy dużo czasu nad rozwiązaniem pewnego problemu. Mianowicie chodziło o to, że kiedy wklejałyśmy linki do postów z jej bloga do wpisu na Facebooku, nieprawidłowo wyświetlała się miniatura oraz tytuł. Z obserwacji wiem, że wiele blogów ma tenże problem. Przekopałyśmy cały internet w poszukiwaniu odpowiedzi, jednak okazało się, że najzwyczajniej w świecie konkretnej odpowiedzi brak. Na szczęście wyszperałam odpowiedni kod w swoich webmasterskich zbiorach i w tym poradniku dzielę się nim z tobą!

Przybliżając temat, mogę powiedzieć, ze za nieprawidłowe wyświetlanie miniatury, czy tytułu odpowiedzialny jest brak w kodzie szablonu bloga, metadanych Facebooka (Facebook Open Graph). W internecie można natknąć się na parę wskazówek, jednak to u mnie znajdziesz konkretne rozwiązanie! Możesz je zastosować na Bloggerze, stronie www, lub innej platformie blogowej, która umożliwia wstawienie kodu w sekcji <head>.

"Profilaktycznie" zalecam umieszczenie omówionego poniżej kodu w każdym szablonie, chyba, że takowy kod już w nim istnieje.

Jak umieścić kod metadanych Facebooka na Bloggerze?

1. Wejdź do menu Szablon => Edytuj kod HTML
2. Wyszukaj znacznik <b:skin> i tuż nad nim wklej poniższy kod:
<!-- Metadata Facebook -->
<meta expr:content='data:blog.postImageThumbnailUrl' property='og:image'/>
<meta expr:content='data:blog.title' property='og:site_name'/>
<b:if cond='data:blog.metaDescription != ""'>
<meta expr:content='data:blog.metaDescription' property='og:description'/>
<meta expr:content='data:blog.metaDescription' name='description'/>
<b:else/>
<meta expr:content='data:blog.pageName' name='description'/>
<meta expr:content='data:blog.pageName' property='og:description'/>
</b:if>
<meta expr:content='data:blog.pageTitle' property='og:title'/>
<meta content='article' property='og:type'/>
<meta expr:content='data:blog.url' property='og:url'/>
3. Na koniec Zapisz szablon.

Jeśli mój post rozwiązał również twój problem, zapraszam do udostępnienia go, co będzie nagrodą za moją pracę :)
Designed by Blokotek. All rights reserved.