Thumbnail für Links in WhatsApp anzeigen || og:image-Metatag funktioniert nicht

Question

Versuchte, dieser Frage zu folgen : Bild für WhatsApp-Linkfreigabe bereitzustellen

Habe eine einfache HTML-Webseite mit den grundlegenden Facebook-Metatags erstellt:

Der Facebook-Linter validiert korrekt und in Facebook wird es perfekt angezeigt, aber beim Teilen über WhatsApp wird das Bild nicht angezeigt.

Ich versuche es auf WhatsApp auf Android

Dies ist die URL der Beispielseite

Answer 1

In meinem Fall hat das Hinzufügen des untenstehenden Meta-Tags das Problem gelöst. Ich habe arabischen Inhalt verwendet und musste dies hinzufügen, damit das Bild in WhatsApp angezeigt wird:

Hinweis: Wenn Sie englischen Inhalt verwenden, ist es nicht notwendig, diesen Meta-Tag hinzuzufügen, da Englisch der Standardwert ist.

Answer 2

Ich hoffe, das hilft:

Beachten Sie die imgURL, die von der gleichen Domain gehostet werden sollte, oder sie wird nicht in WhatsApp angezeigt. Ich habe versucht, eine URL von Amazon zu laden, aber die Bildvorschau funktioniert nicht.

Answer 3

Für jeden, der dieses Problem immer noch hat, habe ich herausgefunden, dass Bilder, die auf Amazon S3 gehostet werden, für die WhatsApp-Mobil-App nicht funktionieren (sowohl für Android als auch für iOS, aber die Mac-Desktop-App war in Ordnung). Es ist sehr wahrscheinlich, dass unsere AWS-Einstellungen dafür verantwortlich sind, aber ich habe das Muster auch auf anderen Websites bemerkt (zum Beispiel diese hier mit einem og:image von einer Domain wie https://s3.amazonaws.com).

Auf keiner anderen Plattform, die ich ausprobiert habe, gab es Probleme, nur in den WhatsApp-Mobil-Apps. Sobald ich mein auf eine andere öffentliche URL wie eine Google Drive-Datei (natürlich öffentlich geteilt) umgestellt habe, hat es funktioniert.

Ich habe auch versucht, das Bild in unserem Repository zu speichern, das auf AWS mit einer benutzerdefinierten Domain gehostet und bereitgestellt wird, aber auch das hat nicht funktioniert. AWS scheint also immer noch der Übeltäter zu sein. Hoffentlich hilft das jemandem!

Answer 4

Als Antwort auf https://stackoverflow.com/a/35785393/1518500

Probieren Sie die aktualisierte Version für schema.org aus

oder verwenden Sie das json-ld-Format von Google

 {
"@context": "http://schema.org/",
"@type": "ImageObject",
 "url": "ImgURLhier",
    "height": 800,
    "width": 1200

 }

Answer 5

November 2020 : Wie ich festgestellt habe, sind diese Meta-Tags erforderlich und haben Auswirkungen darauf, was Sie auf dem freigegebenen Link in Whatsapp und WhatsApp-Vorschaubild sehen:

und innerhalb :

Hallo WhatsApp

Weitere Erklärung :

1- Angenommen, Sie haben und im Body verweisen Sie auf [Hallo WhatsApp](https://wa.me/?text=beispiel.com/seite2), werden das og:image und og:description der Seite beispiel.com/seite2 in WhatsApp gerendert, da Sie auf Ihrem Link im Body verwiesen haben (vielleicht offensichtlich).

2- Wenn Sie irgendwelche Open Graph-Tags wie og:description hinzufügen/ändern und erneut auf Ihr Tag auf Ihrer Seite/im Body klicken, ändert sich das, was Sie in WhatsApp sehen, nicht, es sei denn, Sie ändern den href="Ich bin eine neue URL" Ihres Tags oder löschen den Cache von WhatsApp !!

3- Ich habe Png/jpg Bilder ausprobiert, alle kleiner als 300 kb und alle größer als 300*300 Pixel, und der Bildinhalt war eine https oder eine http URL, der obige Code unterstützt beide (Keine Notwendigkeit für og:image:secure_url).

4- Jedes Mal, wenn Sie og Inhalte hinzufügen/ändern, um ein Thumbnail in WhatsApp zu haben, beeinflussen die Änderungen nicht beim ersten Versuch !! und erfolgreich beim zweiten Versuch. Sehr merkwürdig!