Gestern hatten wir bereits einen Artikel über „Probleme mit Bildern beim Sharen auf Facebook?“ geschrieben. Heute wollen wir das Thema noch ein mal für Google+ aufgreifen. Denn auch dort tauchten immer mal wieder die Probleme auf, dass unsere Artikel-Bilder beim Sharen auf Google Plus nicht angezeigt wurden.
Durch die Recherchen für das Facebook-Problem sind wir auch bei Google Plus schnell auf eine Mindestgröße gestoßen:
- Die Bildhöhe muss mindestens 120 px betragen
- Beträgt die Bildbreite weniger als 100 px, dann darf das Seitenverhältnis nicht größer als 3 : 1 sein
- Im Idealfall sollten die Bilder quadratisch sein und eine Bildgröße von 120 x 120 px haben
Was also tun?
Wir haben uns für die Variante über ein Artikelbild (post_thumbnail) entschieden. Für jeden Artikel legen wir also ein Artikelbild fest (falls nicht, gibt es eine Fallback-Lösung über ein Standard-Bild). Dieses Artikelbild lesen wir für Google+ in voller Größe (large) aus und setzten das benötigte Meta-Tag in den Header. Entspricht zwar nicht wirklich den o.g. Richtlinien, aber zumindest ist die Mindestgröße erreicht. Der Code für die header.php sieht dann wie folgt aus:
<?php
if ( is_singular() ) {
if (has_post_thumbnail()) {
$thumbnail_url = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID),'large');
echo '<meta itemprop="image" content="' . $thumbnail_url[0] .'" />'."\n";
} ?>
<meta itemprop="image" content="http://static.im-tal.net/images/logo-itn.jpg" />
<?php } ?>
Erklärung:
2. prüft ob wir uns in einem Artikel befinden
3. wenn ja, prüft ob ein Artikelbild angegeben wurde
4. wenn ja, holt das Artikelbild in voller Größe
5. und schreibt ein Meta-Tag fürs Artikelbild
7. schreibt immer das Meta-Tag fürs Standardbild
So findet Google+ jetzt immer mindestens das Artikelbild in voller Größe und das angegebene Standard-Bild. Falls es weitere Bilder im Artikel gibt, die die Mindestgröße erfüllen, werden auch diese beim sharen angezeigt.
Übrigens gibt es auch für Google ein Webmaster Tool zur Überprüfung: http://www.google.com/webmasters/tools/richsnippets
Feed