Cela ne vous a certainement pas échappé mais le bouton like a changé (cf l’article d’hier). Ce nouveau like prenant maintenant une image sur votre blog, il faut donc maintenant aider facebook à prendre une image adaptée au contenu de l’article et ainsi éviter que facebook pioche une image au hasard.
Donc pour associer une image à un article il faut utiliser et composer avec Open Graph de Facebook et intégrer une nouvelle balise dans le header de votre blog pour indiquer l’image à miniaturiser. Pour wordpress, le code générique à intégrer dans le fichier header.php est le suivant :
<meta property="og:image" content="<?php echo wp_get_attachment_url( get_post_thumbnail_id( $post->ID ) ); ?>"/>
Une fois intégré le bouton like prendra automatiquement l’image intégrée dans l’article. Si jamais votre article n’a pas d’image vous pouvez bien entendu lui donner une option par défaut comme par exemple :
<?php if ( has_post_thumbnail() ) { ?>
<meta property="og:image" content="<?php echo wp_get_attachment_url( get_post_thumbnail_id( $post->ID ) ); ?>"/>
<?php } else { ?>
<meta property="og:image" content="<?php bloginfo('template_url'); ?>/images/defaut.png"/>
<?php }?>
Et si vous préférez ne pas toucher au fichier header.php vous pouvez intégrer une fonction dans le fichier function.php :
// add image to facebook like button
function fb_like_thumb() {
if ( has_post_thumbnail() ) { ?>
<meta property="og:image" content="<?php echo wp_get_attachment_url( get_post_thumbnail_id( $post->ID ) ); ?>"/>
<?php } else { ?>
<meta property="og:image" content="<?php bloginfo('template_url'); ?>/images/defaut.png"/>
<?php }
}
add_action('wp_head', 'fb_like_thumb');
Et voilà vous voici compatible avec le like de facebook!
Accueil
Bonjour, Merci purces informations pour rendre compatible un wordpress avec le bouton like de facebook.
Merci encore pour l'info.
Chez moi tout fonctionne néanmoins question : Sur FB, l'image est mieux adaptée si la miniature est carrée, sinon ca fait de l'espace blanc sur l'image. Saurais tu comment en créant un post, celui-ci en plus de générer la miniature pour la home, génèrerait aussi une miniature de 50x50 ou il redimensionnerait rognerait les morceaux qui dépassent. on aura une image plus propre sur fb. tu peux faire le test en aimant un de mes articles sur mindthehype.com Cdt
Je n'ai pas testé, mais pour ceux qui rencontrent un problème, cela vient peut être du fait que la fonction wp_get_attachment_url est à utiliser dans un loop seulement, si je ne m'abuse. Pour régler le problème, il vous faudrait donc démarrer un loop avant la fonction,
Pourtant je l’ai mis tout en bas de mon fichier header.php peut-être au mauvais endroit… Je précise que je n’ai ajouté que ton premier code. Le but n’étant pas de mettre une image par défaut, je n’ai pas fait la suite (que j’ai quand même lu) Et sinon à la vue de ce que tu m’as montré, ça coince ici mais où et comment l'éditer ? Désolé du double-commentaire, j'ai rippé sur la touche tab...
Pourtant je l'ai mis tout en bas de mon fichier header.php peut-être au mauvais endroit... Je précise que je n'ai ajouté que ton premier code. Le but n'étant pas de mettre une image par défaut, je n'ai pas fait la suite (que j'ai quand même lu) Et sinon à la vue de ce que tu m'as montré, ça
Regardes dans ton code de page d'article : Tu trouveras la solution pour le texte... De mon point de vue il manque mon code dans ta page pour afficher l'image...
Pour ma part, ça ne fonctionne pas. Il publie toujours l'avatar par défaut sur Facebook au lieu de l'image de l'article. Même avec l'extension proposée par henri. D'ailleurs je profite du commentaire, comment faire en sorte que le texte lorsqu'on aime/partage l'article l'article sur Facebook soit celui de l'article et non pas de l'extension de l'article "partagez-le" Merci
Installes ce plugin pour générer les vignettes http://wordpress.org/extend/plugins/auto-post-thumbnail/
j'utilise dans les articles des images mais je ne sais pas si c'est des vignettes. est ce que vous pouvez me dire si ça en est ? (http://www.espace-musculation.com) donc si ce n'est pas des vignettes, quels code mettre ? merci pour vos réponses
Tu utilises bien les vignettes sur ton blog (mettre une image à la une)? Sinon il faut changer le code pour aller chercher l'image en taille originale.
Ca ne marche pas chez moi, ca fait buger le site :S Une solution ? Est ce qu'il y a pas une erreur dans le code ?
c'est bizarre toutes vos manip… j'ai rien fait et j'ai le choix des images… pour poster sur facebook… aussi de pas en prendre du tout
a oui effectivement c'est très bizarre. J'ajoute le code sur le fichier header.php et lorsque je regarde le code source de mon blog, le code n'a pas été copié entièrement. Bizarre...
Jérôme tu as du louper un truc car est vide...
Super merci pour l'info. J'ai ajouté le code dans le fichier header.php sauf que le bouton ne reprend pas automatique l'image de l'article. Il l'a remplacé par le logo de Facebook :s
Propre.
Euh... get_stylesheet_directory_uri plutôt que bloginfo :)
Gilles utilise http://pastebin.com sinon on ne verra pas le code
Merci ! Pour info, je viens de l'intégrer dans mon thème, qui est un thème enfant, et j'ai noté qu'il fallait utiliser plutôt que (qui renvoie l'url du thème parent).
Merci champion !