Comment indiquer à Facebook quelle image utiliser lorsque ma page est partagée?
Facebook a un ensemble de balises META à graphique ouvert qu'il examine pour décider quelle image afficher.
Les clés de l'image Facebook sont:
<meta property="og:image" content="http://ia.media-imdb.com/rock.jpg"/>
<meta property="og:image:secure_url" content="https://secure.example.com/ogp.jpg" />
et il doit être présent à l'intérieur de la <head></head>
balise en haut de votre page.
Si ces balises ne sont pas présentes, il recherchera leur ancienne méthode de spécification d'une image: <link rel="image_src" href="https://stackoverflow.com/myimage.jpg"/>
. Si aucun n'est présent, Facebook examinera le contenu de votre page et choisira des images de votre page qui répondent à ses critères de partage d'image: l'image doit être d'au moins 200 pixels par 200 pixels, avoir un rapport hauteur / largeur maximum de 3: 1, et en PNG, Format JPEG ou GIF.
Puis-je spécifier plusieurs images pour permettre à l'utilisateur de sélectionner une image?
Oui, il vous suffit d'ajouter plusieurs balises META d'image dans l'ordre dans lequel vous souhaitez qu'elles apparaissent. L'utilisateur se verra alors présenter une boîte de dialogue de sélection d'image:
J'ai spécifié les balises META d'image appropriées. Pourquoi Facebook n'accepte-t-il pas les modifications?
Une fois qu'une URL a été partagée, le robot d'exploration de Facebook, qui dispose d'un agent utilisateur facebookexternalhit/1.1 (+https://www.facebook.com/externalhit_uatext.php)
, accédera à votre page et mettra en cache les métadonnées. Pour forcer les serveurs Facebook à vider le cache, utilisez l' outil Facebook Url Debugger / Linter qu'ils ont lancé en juin 2010 pour actualiser le cache et résoudre les problèmes de balises META sur votre page.
De plus, les images de la page doivent être accessibles au public au robot d'exploration Facebook. Vous devez spécifier des URL absolues comme http://example.com/yourimage.jpg au lieu de simplement /yourimage.jpg.
Puis-je mettre à jour ces balises META avec du code côté client comme Javascript ou jQuery?
Non. Tout comme les robots d'exploration des moteurs de recherche, le scraper Facebook n'exécute pas de scripts, donc quelles que soient les balises META présentes lors du téléchargement de la page, ce sont les balises META utilisées pour la sélection d'images.
L'ajout de ces balises empêche la validation de ma page. Comment puis-je réparer cela?
Vous pouvez ajouter les espaces de noms Facebook nécessaires à votre balise et votre page devrait ensuite passer la validation:
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:og="http://ogp.me/ns#"
xmlns:fb="https://www.facebook.com/2008/fbml">