Comment Google Plus sélectionne-t-il une image à partir d'un lien partagé?


27

Si vous partagez un lien sur Google Plus, il récupérera souvent quelques images que vous pourrez joindre lorsque vous publierez l'image. Facebook a une fonctionnalité similaire. Vous pouvez indiquer à Facebook quelle est l'image principale d'une page avec une simple balise LINK. Cependant, cela ne fonctionne pas pour G +.

Comment pouvez-vous dire à G + quelle est l'image principale d'une page?


Réponses:


20

Voici les informations copiées à partir de la documentation du bouton +1 (peaufinée un peu pour une meilleure lisibilité). Cette méthode s'applique à tous les modes de partage des URL sur Google+.

Remplissage du + Snippet: après + 1'ing d'une page, l'utilisateur a la possibilité de partager la page avec Google+ via une bulle de partage affichée. Cette bulle de partage (ainsi que le post d'activité Google+ résultant) comprend un aperçu, ou + extrait, qui contient le titre de la page, une brève description de la page et une image miniature. Ces données sont extraites du contenu de l'URL cible de l'une des quatre manières, répertoriées par ordre de priorité:

Microdonnées Schema.org (recommandé): Si la page est annotée avec des microdonnées schema.org, l'extrait + utilisera le nom, l'image et les propriétés de description trouvés sur n'importe quel type schema.org.

<body itemscope itemtype="http://schema.org/Product">
  <h1 itemprop="name">Shiny Trinket</h1>
  <img itemprop="image" src="image-url"></img>
  <p itemprop="description">Shiny trinkets are shiny.</p>
</body>

Protocole Open Graph: si la page contient des propriétés Open Graph pour le titre, l'image et la description, elles seront utilisées pour le + Snippet.

<meta property="og:title" content="..."/>
<meta property="og:image" content="..."/>
<meta property="og:description" content="..."/>

Balises Meta "title" et "description": si l' <head>élément de la page contient des balises <meta name="title" ... />et <meta name="description" ... />, le + Snippet utilisera leurs attributs de contenu pour le titre et la description, respectivement. Pour l'image miniature, la sharebox tentera de trouver une image appropriée sur la page.

<meta name="title" content="..." />
<meta name="description" content="..." />

Meilleure estimation à partir du contenu de la page (non recommandé): si aucune de ces données n'est présente, Google analysera la page et tentera de trouver le meilleur titre, la meilleure description et la meilleure image.


1
Merci pour cela, mais cela fonctionne-t-il également lorsque vous partagez directement un lien sur Google+? Ma page utilise le protocole Open Graph et lorsque j'utilise l' outil [ google.com/webmasters/tools/richsnippets], je peux voir le lien vers l'image dans la section "Données d'extrait enrichi extrait de la page" -Section, mais lorsque je partagez le lien dans Google+, il ne charge pas l'image.
Ethan Leroy

4
N'oubliez pas<link rel="image_src" href="[insert image url here]"/>
Supuhstar

L'astuce de Supuhstar d'utiliser <link> a fait l'image de ma page Web sélectionnée par le partage de liens de Google+.
Hong

W3C dit: `Mauvais titre de valeur pour le nom d'attribut sur l'élément meta: le titre du mot clé n'est pas enregistré. '
Jeroen

J'ai défini les métadonnées og: image, mais google + utilise une autre image qui n'est même pas sur la page. Bizarre. modifier- ok, l'image est sur la page, cachée dans un menu déroulant. Eh bien, ça aide, je suppose. Pourtant, il n'utilise pas les métadonnées.
MrBoJangles

2

[Désolé pour la réponse spéculative, mais je n'ai pas de site sur lequel je peux essayer immédiatement]
Je n'ai vu que des informations sur la façon de procéder pour le bouton +1 . Il semble raisonnable que, sur le back-end Google+, il s'agit du même processus et qu'il recherche donc les mêmes informations. En supposant que vos modèles sont construits d'une manière que vous pouvez appliquer itemprop="image"à l'image souhaitée, essayez.


Cela ne semblait pas fonctionner. Merci quand même!
Justin

En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.