98 votes

Comment afficher une image particulière sous forme de vignette lors de la mise en œuvre du partage sur Facebook?

J'essaie de mettre en œuvre partager cette méthode. J'utilise le code comme suit

 http://www.facebook.com/share.php?u=my_website_url
 

Maintenant, lorsque Facebook le montre, il affiche des miniatures sur le côté gauche. Ces images sont tirées de mon site web. Comment choisir une image en tant que vignette ou au moins l'arrêter d'afficher une vignette?

Vous pouvez le vérifier avec l' adresse de mon blog .

98voto

Dans les spécifications de Facebook, utilisez un code comme celui-ci:

 <meta property="og:image" content="http://siim.lepisk.com/wp-content/uploads/2011/01/siim-blog-fb.png" />
 

Source: Facebook Partager

80voto

Gdeglin Points 6687

Ce blog semble être votre réponse: http://blog.capstrat.com/articles/facebook-share-thumbnail-image/

Plus précisément, l'utilisation d'une étiquette comme suit:

<link rel="image_src" 
      type="image/jpeg" 
      href="http://www.domain.com/path/icon-facebook.gif" />

Le nom de l'image doit être la même que dans l'exemple.

Cliquez sur "assurent la Prévisualisation Fonctionne"

Remarque: les Balises peuvent être correctes, mais Facebook seulement des éraflures toutes les 24 heures, en fonction de leur documentation. Utiliser le Facebook de la Charpie de la page pour obtenir l'image dans Facebook.

http://developers.facebook.com/tools/lint/

34voto

Tim Scollick Points 549

Mes tags étaient corrects mais Facebook ne raclait que toutes les 24 heures, selon leur documentation. L'utilisation de la page Facebook Lint a permis d'obtenir l'image dans Facebook.

Entrez votre URL ici et FB mettra à jour les métadonnées de votre page:

https://developers.facebook.com/tools/debug (lien mis à jour)

22voto

Lix Points 27516

Facebook utilise og:tags et l' Open Graph Protocol pour en déchiffrer les informations à afficher lors de la prévisualisation de votre URL dans un dialogue partager ou dans un flux de nouvelles sur facebook.

L' og:tags contiennent des informations telles que :

  • Le titre de la page
  • Le type de page
  • L'URL
  • Les sites internet de nom
  • Une description de la page
  • Facebook user_id des administrateurs de la page ( sur facebook )

Voici un exemple ( pris sur le facebook de la documentation ) de quelques og:tags

<meta property="og:title" content="The Rock"/>
<meta property="og:type" content="movie"/>
<meta property="og:url" content="http://www.imdb.com/title/tt0117500/"/>
<meta property="og:image" content="http://ia.media-imdb.com/rock.jpg"/>

Une fois que vous avez mis en place le balisage correct de l' og:tags , et à définir leurs valeurs, vous pouvez tester la façon dont facebook sera afficher votre URL en utilisant le Facebook du Débogueur. L'outil de débogage met aussi en évidence les problèmes qu'il trouve avec l' og:tags sur la page ou le manque de.

Une chose à garder à l'esprit est que facebook ne font certains de la mise en cache à l'égard de cette information, donc, pour que les modifications prennent effet à votre page ont t être raclé comme indiqué dans la documentation :

L'Édition Des Balises Meta

Vous pouvez mettre à jour les attributs de votre page par la mise à jour de votre page les balises. Notez que og:title et og:type ne sont modifiables d'abord - après votre page reçoit 50 aime le titre devient fixe, et après votre page reçoit de 10 000 aime le type devient fixe. Ces propriétés sont fixes pour éviter surprenant d'utilisateurs qui ont aimé la page est déjà. Pour changer le titre ou le type de balises après ces limites atteint-on ne fait rien, votre page conserve le titre original et type.

Pour que les modifications soient répercutées sur Facebook, vous devez forcer votre page pour être gratté. La page est grattée quand un admin pour la page, clique sur le bouton "Like" ou lorsque l'URL est entré dans l' Facebook URL Linter Facebook Débogueur...

11voto

chue x Points 11202

Je vois que toutes les réponses fournies sont correctes. Cependant, un détail important a été négligé: La taille de l'image DOIT être d'au moins 200 X 200 px, sinon Facebook va remplacer la vignette avec la première image qui répond aux critères sur la page. Un autre fait est que le minimum requis est d'inclure le 3 metas que Facebook exige de l'og:image prise d'effet:

<meta property="og:title" content="Title of the page" /><br /> <meta property="og:url" content="http://yoursite.com" /> ** Even if the page is dynamically generated and the URL contains query parameters **<br /> <meta property="og:image" content="http://convertaholics.com/convertaholics-og.png" />

Le débogage de votre page avec Facebook débogueur et la correction de tous les avertissements et cela devrait fonctionner comme un charme! https://developers.facebook.com/tools/debug

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X