Meta Facebook

Lorsqu’on met un lien « Partager » de Facebook sur une page html, il arrive parfois que ce ne soit pas les bonnes informations qui apparaissent sur l’encart Share…

encart-share

Nous allons donc étudier comment gérer les données utilisées par cet encart.

Tout d’abord, nous allons mettre un lien html simple qui permet de partager notre page :

/!\ Ce n’est pas un plugin Facebook et il n’y a pas de javascript d’utilisé.

Par défaut, si nous ne spécifions pas de meta données, Facebook va prendre dans la page html les informations suivantes :

  • pour le titre : meta title de la page (si présent)
  • pour la description : meta description (si présente, sinon du texte quelconque de la page)
  • pour l’image : une qui est présente sur la page

L’inconvénient, c’est qu’on risque d’avoir des informations qui ne nous conviennent pas : une image ne correspondant pas à notre information, un titre non significatif, une description trop courte…

Pour y remédier, nous allons insérer les balises meta de Facebook dans le <head> de notre page.

/!\ L’image doit avoir une taille minimale de 200*200px.

Avec ces meta, nous pouvons contrôler les informations affichées sur les encarts « Partager ».

Attention, quand même, lorsque vous faites une modification dans ces données, Facebook garde en cache les meta pendant 2-3 jours minimum (ou plus !). Pour pallier à ce souci, il faut vider le cache de Facebook grâce à un outil de debug :

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

Si après avoir tapé l’url du site, nous cliquons sur « Show existing scrape information », les données affichées vont être celles en cache… Pas très intéressant !

Donc, nous allons cliquer sur le bouton « Fetch new scrape information » et là… ce sont les nouvelles informations qui apparaissent. En réalité cette action vide le cache de Facebook.

Et en retournant sur notre lien « Partager », ce sont bien les nouvelles données qui apparaissent !

Lien intéressant : https://css-tricks.com/essential-meta-tags-social-media/

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée.

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.