Wie wählt „Facebook Publisher“ das Bild, den Titel und den Inhalt einer freigegebenen Website aus?

11

Dies ist eine Frage zu Facebook Publisher . Wenn ich einen Link teile, greift Facebook nach Text, dem Titel und dem Bild von der Website und erstellt eine Vorschau für den Benutzer. Der Benutzer kann dann die Vorschau bearbeiten, aus mehreren verschiedenen Miniaturansichten auswählen und diese dann in seinem Facebook-Profil veröffentlichen.

Hier ist ein Screenshot, um den Punkt zu veranschaulichen:

Screenshot von Facebook

Wie greift die Publisher-Anwendung die Bilder und den Text vom Link ab? Gibt es ähnliche Anwendungen, die für andere beliebte Webanwendungen, Google-Anwendungen, Wordpress-Blogs usw. funktionieren?

Ich habe vor einigen Monaten eine ähnliche Frage gestellt , und es scheint, dass Facebook oEmbed verwendet , aber es scheint, dass oEmbed nur Inhalte einbettet. Ich habe auch gelesen, dass oEmbed nur mit oEmbed-Anbietern funktioniert. Der Facebook Publisher funktioniert mit fast allen Websites.

Stefan Lasiewski
quelle
@phwd: Es scheint, als würde @Edward über einen Fehler in seinem Beitrag sprechen. Es funktionierte bis "Aber seit ungefähr zwei Wochen ..."
Stefan Lasiewski

Antworten:

10

Facebook verwendet alle offenen Grafik-Meta-Tags, sofern diese für den Titel, das Bild usw. vorhanden sind (z. B. og: title). In der Facebook-Dokumentation zum Open Graph Protocol wird dies näher erläutert:

Das Open Graph-Protokoll definiert vier erforderliche Eigenschaften:

og: title - Der Titel Ihres Objekts, wie er in der Grafik angezeigt werden soll, z. B. "The Rock".

og: type - Der Typ Ihres Objekts, z. B. "movie". Siehe die vollständige Liste der unterstützten Typen.

og: image - Eine Bild-URL, die Ihr Objekt im Diagramm darstellen soll. Das Bild muss mindestens 50 x 50 Pixel groß sein und ein maximales Seitenverhältnis von 3: 1 haben.

og: url - Die kanonische URL Ihres Objekts, die als permanente ID im Diagramm verwendet wird, z . B. http://www.imdb.com/title/tt0117500/ .

Darüber hinaus haben wir die grundlegenden Metadaten um zwei erforderliche Felder erweitert, um Ihre Seite mit Facebook zu verbinden:

og: site_name - Ein für Menschen lesbarer Name für Ihre Site, z. B. "IMDb".

fb: admins oder fb: app_id - Eine durch Kommas getrennte Liste von Facebook-Benutzer-IDs oder einer Facebook-Plattform-Anwendungs-ID, die diese Seite verwaltet. Es ist gültig, sowohl fb: admins als auch fb: app_id in Ihre Seite aufzunehmen.

Es wird außerdem empfohlen, die folgende Eigenschaft sowie diese mehrteiligen Eigenschaften anzugeben.

og: description - Eine Beschreibung Ihrer Seite mit ein bis zwei Sätzen.

Ich bin nicht sicher, wie sie es für Seiten tun, denen diese Tags fehlen. Wenn Sie versuchen, diese Funktionalität zu duplizieren, ist dies leider keine Hilfe. Wenn Sie jedoch sicherstellen möchten, dass Ihre Seiten im Publisher angezeigt werden, wie Sie möchten, ist dies möglicherweise der Fall.

Sie können auch den Facebook Opengraph-Debugger verwenden, der Informationen zu Ihrer Vorschau bereitstellt und den zwischengespeicherten Link (sehr praktisch) aktualisiert, wenn Sie Änderungen vornehmen. Andernfalls können Sie Änderungen an einem Link vornehmen, den Sie freigeben möchten, und die Änderungen werden tagelang nicht angezeigt:

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

Marc
quelle
Sie verwenden die Meta-Tags, wenn Sie die geöffneten Diagramm-Tags nicht angegeben haben. OG-Tags sind hilfreicher, wenn Sie eine Webseite mögen, da sie eine Facebook-Seite erstellt, als für die Site / URL
Umair Jabbar
4

Um Facebook mitzuteilen, welcher Text und welche Bilder aufgenommen werden sollen, müssen Sie bestimmte Metaschlüssel in den Kopf Ihrer Seite einfügen.

    <meta name="title" content="title" />
    <meta name="description" content="description " />
    <link rel="image_src" href="thumbnail_image" / >

Ich habe die Details hier gepostet http://umairj.com/2010/10/modify-how-the-shared-item-appears-on-facebook/

Umair Jabbar
quelle
1
Das ist interessant und diese Meta-Tags sind eine empfohlene Vorgehensweise für viele Webmaster (sie helfen Suchmaschinen usw.). Schauen Sie sich jedoch die Quelle für flowingdata.com/2010/09/15/… an . Diese Seite hat diese Tags nicht und auch kein <link rel=Bild-Bild-Tag.
Stefan Lasiewski
@ Stefan, das ist eine sehr gute Frage. Wenn FB die Meta-Tags der neuen OpenGraph OG-Tags nicht findet, nimmt er alle Bilder auf und zeigt einen Teil des Textes vom Anfang des HTML-Codes dieser Seite an . Der Benutzer hat also die Wahl zwischen Bildern, aber der Text ist der gleiche. Außerdem werden nur die Bilder angezeigt, die den von Facebook festgelegten Kriterien entsprechen. das Aspet-Verhältnis
Umair Jabbar
1

Was für mich funktioniert hat, war, das gewünschte Miniaturbild direkt nach dem Tag auf der Seite zu platzieren und es zu klein zu machen, um es zu sehen.

<img src="imagename.jpg" width="1" height="1" />

Ich habe es nicht mit Höhe 0 und Breite 0 getestet, aber es wird wahrscheinlich immer noch funktionieren. Dies garantiert nicht, dass der Benutzer dieses Bild auswählt.

AUCH es scheint, als würde Facebook die Miniaturansichten auf Ihrer Seite zwischenspeichern und nicht immer nach neuen suchen. Versuchen Sie, diese auf einer anderen Seite Ihrer Website hinzuzufügen, und Sie werden sehen, dass sie funktioniert.

Hoffe das hilft.

Daniel Bernal
quelle
0

Facebook verwendet Meta-Tags auf der Seite, die Sie freigeben, um zu bestimmen, welches Bild, welcher Titel und welche Beschreibung beim Posten eines Links angezeigt werden sollen. Die Meta-Tag-Syntax folgt der OpenGraph- Spezifikation von Facebook .

Die wichtigsten Meta-Tags, die Sie definieren müssen, sind:

  • <meta property="og:title" content="The title of the sharing preview" />
  • $<meta property="og:description" content="The first few lines of content below the title" />
  • <meta property="og:image" content="http://site.com/your-image-1200x630px.jpg" />

Dies funktioniert natürlich nur, wenn Sie die vollständige Kontrolle über die Website haben, die Sie freigeben. Wenn Sie einen externen Link (wie einen Nachrichtenartikel) freigeben, haben Sie keinen Zugriff auf deren Website und können daher die Meta-Tags nicht ändern. Ich verwende ShareKit.io , mit dem Sie den Titel, die Beschreibung und das Bild eines von Ihnen freigegebenen Links ändern können, ohne mit Meta-Tags herumspielen zu müssen.

AndroidGuy
quelle
-1

Ich würde sagen, die Antwort auf Ihre Frage ist ziemlich komplex und höchstwahrscheinlich auch ein Geschäftsgeheimnis für Facebook. Ihre Fähigkeit, eine URL zu scannen und relevante Inhalte / Medien zur Anzeige im Nachrichtenstrom aufzunehmen, ist eines der Dinge, die ihren Service für die alltägliche Person, die Facebook nutzt, so einzigartig und nützlich machen.

That being said, würde ich sagen , der Algorithmus nicht sehr komplex ist, verwendet es wahrscheinlich eine Menge die gleichen Regeln Google Verwendungen zu schaben Inhalte von Webseiten (sie haben einige allgemeine Informationen veröffentlicht hier ). Ich denke, die Kraft hinter dem Publisher beruht auf vielen Versuchen und Tests durch die Facebook-Ingenieure.

Sam Day
quelle
1
Ich bin völlig anderer Meinung!
Umair Jabbar