Probleme mit dem Vorschaubild für Facebook und Google+

Ein Bereich, in dem ich immer wieder auf Probleme stoße, ist das Thema Open Graph Tags. Am meisten fällt mir das beim Vorschaubild für Facebook und Google+ auf, der Open Graph Property og:image. Es passiert mir immer wieder, dass ein falsches oder gar kein Bild gezogen wird. Die Fehlersuche ist nicht immer einfach. Folgende Probleme sind bei mir immer wieder – teilweise in Kombination – aufgetaucht.

Mehrfache Definition des OG-Tag IMG

Dies kann man durch Suchen im Quelltext oder durch den Open Graph Debugger der Facebook Developer Tools entdecken.

beispiel-facebook-developer-open-graph-debugger

Die Ursache liegt meist darin, dass z.B. das Theme und ein oder mehrere Plugins die Open Graph Tags setzen. Bei mir ist die Konstellation dabei meistens so, dass sowohl das WordPress SEO Plugin von Yoast als auch das Plugin 2-Click-Social-Media-Buttons die Tags setzten.

2-click-social-media-buttons-sonstiges-artikelbild

yoast-wordpress-seo-social-open-graph-meta-data

Im Quellcode gibt es in den Kommentaren meist Hinweise darauf, welche Open Graph Tags von welchem Plugin gesetzt werden. Hat man alle Stellen identifiziert, kann man das Problem dadurch lösen, dass man die Open Graph Tags über die Optionen der Plugins nur an einer Stelle setzen lässt.

Meist habe ich mich dabei für das Plugin 2-Click-Socal-Media-Buttons entschieden, da man hier recht einfach ein Bild angeben kann, welches gesetzt wird, wenn kein Artikelbild vorhanden ist.

Fehlende Angabe zu einem Standard Vorschaubild

Wird ein falsches Bild genommen, so kann man entweder im Template des Themes oder in dem Plugin, welches die Open Graph Tags setzt, ein Standard Bild definieren. Hier sind die Möglichkeiten für Reihenfolge (z.B. wenn kein Artikelbild, dann erstes Bild auf der Seite, sonst Standardbild – oder wenn kein Artikelbild, dann Standardbild) je nach Plugin unterschiedlich. Welches Bild genommen wird, kann man auch vor dem Posten auf Facebook mit dem oben genannten Open Graph Debugger testen.

Vorschaubild hat falsche Größe

Auch wenn das definierte Vorschaubild eine falsche Größe hat, kann es sein, dass ein anderes Bild genommen wird. Dieser Fehler wird ebenfalls durch den Open Graph Debugger angezeigt. Die aktuell angegebenen 200×200 Pixel wurden bei mir immer noch als zu klein eingestuft – hier hilft im Notfall immer nur testen, testen, testen.


0 0 0


Diskussion

avatar placeholder
12. Januar 2014 von Asja Schrödl

Guten Tag,

ich bin gerade „zufällig“ auf Ihre Seite gestoßen und habe erfreut festgestellt, dass wir das selbe WordPress-Theme nutzen. :-)
Ich war auf der Suche nach der Integrations-Möglichkeit des fb-share-buttons für meine Beiträge. Momentan können diese nur via twitter und pinterest geteilt werden und ich finde den Einstellbereich nicht.
Vielleicht haben Sie ja einen Tipp für mich?

Vielen Dank für Ihre Antwort und schauen Sie doch mal bei mir vorbei:

http://www.frischer-wind.net

Asja Schrödl

avatar placeholder
23. März 2014 von Nina Taberski-Besserdich

Liebe Frau Schrödl,

wir nutzen das Plugin „2 Click Social Media Buttons“ für unsere Share-Buttons. Was das Theme hier nativ anbietet, weiß ich leider gar nicht genau.

viele Grüße,
Nina Taberski-Besserdich

Mitdiskutieren