Wie kann ein bestimmtes Bild als Miniaturbild angezeigt werden, während die Freigabe auf Facebook implementiert wird?

Ich versuche, diese Methode zu teilen. Ich benutze den Code wie folgt

http://www.facebook.com/share.php?u=my_website_url

Wenn Facebook es jetzt zeigt, werden auf der linken Seite einige Miniaturansichten angezeigt. Diese Bilder wurden von meiner Website ausgewählt. Wie kann ich ein bestimmtes Bild als Miniaturbild auswählen oder zumindest verhindern, dass es als Miniaturbild angezeigt wird?

Sie können es mit meiner Blog-Adresse überprüfen .

Dieser Blog-Beitrag scheint Ihre Antwort zu haben: http://blog.capstrat.com/articles/facebook-share-thumbnail-image/

Verwenden Sie insbesondere ein Tag wie das folgende:

<link rel="image_src" 
      type="image/jpeg" 
      href="http://www.domain.com/path/icon-facebook.gif" />

Der Name des Bildes muss mit dem im Beispiel übereinstimmen.

Klicken Sie auf "Sicherstellen, dass die Vorschau funktioniert".

Hinweis: Tags können korrekt sein, aber Facebook kratzt laut Dokumentation nur alle 24 Stunden. Verwenden Sie die Facebook Lint-Seite, um das Bild auf Facebook zu übertragen.

http://developers.facebook.com/tools/lint/

Verwenden Sie in der Facebook-Spezifikation einen Code wie den folgenden:

<meta property="og:image" content="http://siim.lepisk.com/wp-content/uploads/2011/01/siim-blog-fb.png" />

Quelle: Facebook Teilen

Meine Tags waren korrekt, aber Facebook kratzt laut Dokumentation nur alle 24 Stunden. Über die Facebook Lint-Seite wurde das Bild auf Facebook übertragen.

Geben Sie hier Ihre URL ein und FB aktualisiert die Metadaten von Ihrer Seite:

https://developers.facebook.com/tools/debug (aktualisierter Link)

Facebook verwendet og:tagsund das Open Graph-Protokoll, um zu entschlüsseln, welche Informationen angezeigt werden sollen, wenn eine Vorschau Ihrer URL in einem Freigabedialog oder in einem Newsfeed auf Facebook angezeigt wird .

Die og:tagsenthalten Informationen wie:

• Der Titel der Seite
• Der Seitentyp
• Die URL
• Der Name der Website
• Eine Beschreibung der Seite
• Facebook user_id's von Administratoren der Seite (auf Facebook)

Hier ist ein Beispiel (aus der Facebook-Dokumentation ) von einigenog:tags

<meta property="og:title" content="The Rock"/>
<meta property="og:type" content="movie"/>
<meta property="og:url" content="http://www.imdb.com/title/tt0117500/"/>
<meta property="og:image" content="http://ia.media-imdb.com/rock.jpg"/>

Sobald Sie das richtige Markup der implementiert og:tagsund deren Werte festgelegt haben, können Sie mithilfe des Facebook-Debuggers testen, wie Facebook Ihre URL anzeigt . Das Debugger-Tool zeigt auch alle Probleme auf, die es og:tagsauf der Seite findet oder die es nicht gibt.

Eine Sache im Auge zu behalten ist , dass Facebook nicht auf diese Informationen einige Caching bezüglich zu tun, also um die Änderungen wirksam Ihre Seite nehmen müssen t werden geschabt wie in der Dokumentation angegeben:

Meta-Tags bearbeiten

Sie können die Attribute Ihrer Seite aktualisieren, indem Sie die Tags Ihrer Seite aktualisieren. Beachten Sie, dass og: title und og: type nur anfänglich bearbeitet werden können. Nachdem Ihre Seite 50 Likes erhalten hat, wird der Titel festgelegt, und nachdem Ihre Seite 10.000 Likes erhalten hat, wird der Typ festgelegt. Diese Eigenschaften wurden behoben, um überraschende Benutzer zu vermeiden, denen die Seite bereits gefallen hat. Das Ändern der Titel- oder Typ-Tags nach Erreichen dieser Grenzwerte führt zu nichts. Ihre Seite behält den ursprünglichen Titel und Typ bei.

Damit die Änderungen auf Facebook angezeigt werden, müssen Sie das Scraping Ihrer Seite erzwingen. Die Seite wird gelöscht, wenn ein Administrator für die Seite auf die Schaltfläche "Gefällt mir" klickt oder wenn die URL in den Facebook URL Linter Facebook Debugger eingegeben wird ...

Ich sehe, dass alle Antworten korrekt sind. Ein wichtiges Detail wurde jedoch übersehen: Die Größe des Bildes MUSS mindestens 200 x 200 Pixel betragen, andernfalls ersetzt Facebook das Miniaturbild durch das erste verfügbare Bild, das die Kriterien auf der Seite erfüllt. Eine weitere Tatsache ist, dass mindestens die 3 Metas enthalten sein müssen, die Facebook benötigt, damit das og: image wirksam wird:

<meta property="og:title" content="Title of the page" />
<!-- NEXT LINE Even if page is dynamically generated and URL contains query parameters -->
<meta property="og:url" content="http://yoursite.com" />
<meta property="og:image" content="http://convertaholics.com/convertaholics-og.png" />

Debuggen Sie Ihre Seite mit dem Facebook-Debugger und beheben Sie alle Warnungen. Es sollte wie ein Zauber funktionieren! https://developers.facebook.com/tools/debug

Ich hatte die gleichen Probleme und glaube, ich habe es gelöst. Ich habe das Link-Meta-Tag wie hier erwähnt verwendet, um auf das gewünschte Bild zu verweisen, aber der Schlüssel ist, dass FB in diesem Fall keine anderen Bilder als Auswahl zieht. Auch wenn Ihr Bild zu groß ist, haben Sie überhaupt keine Wahl.

So habe ich meine Website repariert: http://gnorml.com/blog/facebook-link-thumbnails/

So funktioniert das alles:

1. Sie müssen in der Lage sein, auf den HTML-Code der jeweiligen Webseite zuzugreifen, die Sie freigeben. Es wird wahrscheinlich auch auf der gesamten Website funktionieren, wenn Sie eine gemeinsame Header-Datei verwenden. Ich habe das nicht versucht, aber es sollte funktionieren. In diesem Fall erhalten Sie jedoch für alle Seiten das gleiche Bild.

2. Sie müssen diese HTML-Meta-Tags zur Seite in der hinzufügen. Es wird nicht funktionieren, wenn Sie es in die. Stellen Sie sicher, dass Sie a) Bild, b) Beschreibung, c) URL und d) Titel anpassen.

Ein echtes Beispiel.

<meta property="og:image" content="http://www.coachesneedsocial.com/wp-content/uploads/2014/12/BannerWCircleImages-1.jpg" />

<meta property="og:description" content="Coaches share their secrets to success so you can rock 2015." />

<meta property="og:url"content="http://www.coachesneedsocial.com/coacheswisdomtelesummit/" />

<meta property="og:title" content="Coaches Wisdom Telesummit" />

3. sparen
4. Öffnen Sie einen neuen Facebook-Beitrag und wiederholen Sie die Seite, die Sie teilen möchten.
5. Wenn Sie Probleme haben, können Sie es mit diesem Facebook-Tool debuggen. Es sieht geekiger aus als es ist. Hier erfahren Sie, was Facebook sieht, wenn Sie in der zu teilenden URL posten.

https://developers.facebook.com/tools/debug/og/object/

Großer Tipp ... stellen Sie sicher, dass die "Anführungszeichen" in Ihrem HTML-Code gleich sind (sie sollten wie 2 gerade Markierungen und keine Kurven aussehen ... manchmal ändern Programme diese in verschiedene Schriftarten und es macht den Code kaputt.

Teilen auf Facebook: So verbessern Sie Ihre Ergebnisse durch Anpassen von Bild, Titel und Text

Über den obigen Link. Für die bestmögliche Freigabe sollten Sie 3 Daten in Ihrem HTML-Code vorschlagen:

• Titel
• Kurze Beschreibung
• Bild

Dies wird durch Folgendes erreicht, das sich im 'head'-Tag Ihres HTML-Codes befindet:

• Titel: <title>INSERT POST TITLE</title>
• Bild: <meta property=og:image content="http://site.com/YOUR_IMAGE.jpg"/>
• Beschreibung: <meta name=description content="INSERT YOUR SUMMARY TEXT"/>

Wenn Ihre Website statisches HTML ist, müssen Sie dies für jede Seite mit Ihrem HTML-Editor tun.

Wenn Sie ein CMS wie Drupal verwenden, können Sie vieles davon automatisieren (siehe obigen Link). Wenn Sie WordPress verwenden, können Sie wahrscheinlich etwas Ähnliches implementieren, indem Sie das Drupal-Beispiel als Richtlinie verwenden. Ich hoffe, Sie fanden diese nützlich.

Schließlich können Sie Ihre Freigabebeiträge jederzeit manuell bearbeiten. Siehe dieses Beispiel mit Abbildungen .

Ich hatte auch ein Problem auf einer Website, an der ich letzte Woche gearbeitet habe. Ich habe eine Like-Box implementiert und die Like-Box getestet. Dann habe ich meinem Header ein Bild hinzugefügt (das ob: image meta). Trotzdem wurde auf meiner Facebook-Benachrichtigung nicht das richtige Bild angezeigt.

Ich habe alles versucht und bin zu dem Schluss gekommen, dass jede einzelne Implementierung eines Like-Buttons zwischengespeichert wird. Nehmen wir also an, Sie klicken auf die Schaltfläche "Gefällt mir" in URL A, geben dann ein Bild in der Kopfzeile an und testen es, indem Sie erneut auf die Schaltfläche "Luke" in URL A klicken. Das Bild wird nicht angezeigt, wenn die Seite zwischengespeichert wird. Das Bild wird angezeigt, wenn Sie auf Seite B auf die Schaltfläche "Gefällt mir" klicken.

Um den Cache zurückzusetzen, müssen Sie das oben erwähnte Fussel-Debugger-Tool verwenden und alle URLs für die zwischengespeicherten überprüfen ... Das ist das einzige, was für mich funktioniert hat.

Der einfachste Weg, Facebook Open Graph für jeden Joomla-Artikel festzulegen, bestand darin, den nächsten Code in com_content / article / default.php override zu platzieren:

$app    = JFactory::getApplication();
$path   = JURI::root();

$document = JFactory::getDocument();
$document->addCustomTag('<meta property="og:title" content="YOUR SITE TITLE" />');
$document->addCustomTag('<meta property="og:name" content="YOUR SITE NAME" />');
$document->addCustomTag('<meta property="og:description" content="YOUR SITE DESCRIPTION" />');
$document->addCustomTag('<meta property="og:site_name" content="YOUR SITE NAME" />');
if (isset($images->image_fulltext) and !empty($images->image_fulltext)) : 
    $document->addCustomTag('<meta property="og:image" content="'.$path.'<?php echo htmlspecialchars($images->image_fulltext); ?>" />');
else :
    $document->addCustomTag('<meta property="og:image" content="'.$path.'images/logo.png" />');
 endif;

Dadurch werden Meta-Og-Tags mit Details aus dem aktuellen Artikel in den Kopf eingefügt.