Ajouter des boutons de partage sociaux à la fin de chaque article

Le web devenant, ou plutôt étant devenu social, la renommée de votre site ne passe désormais plus seulement par le référencement naturel ou la publicité en ligne, mais également par les réseaux sociaux. L’internaute étant un animal proche du paresseux, il est important de lui donner la possibilité de fournir le moins d’efforts possibles.

Avec le code que je vous propose ci-dessous, des boutons de partage vers les réseaux sociaux seront ajoutés automatiquement à la fin de chacun de vos articles. C’est de cette façon exactement que sont affichés les boutons en question à la fin de chacun des articles de ce blog.

Pour commencer, placez le code ci-dessous dans le fichier functions.php de votre thème :

if (!function_exists('dfr_social_buttons')) :
  add_filter('the_content', 'dfr_social_buttons', 15);
  function dfr_social_buttons($content) {
    if (is_single()) {
      global $post;
      $socialbuttons = '<g:plusone></g:plusone>
<a class="twitter-share-button" href="http://twitter.com/share" data-count="horizontal" data-via="VOTRECOMPTETWITTER" data-lang="fr">Tweet</a>
<span style="padding-left: 30px;"><iframe style="overflow: hidden; width: 350px; height: 25px;" src="http://www.facebook.com/plugins/like.php?href=' . urlencode(get_permalink($post->ID)) . '&layout=standard&show_faces=false&width=350&action=like&colorscheme=light" frameborder="0" scrolling="no" width="350" height="240"></iframe></span>';

      // Ajout des boutons à la fin du contenu
      $content = $content . $socialbuttons;
    }
    return $content;
  }
endif;

N’oubliez pas de remplacer VOTRECOMPTETWITTER par votre nom d’utilisateur 😉

Ce code permet d’ajouter les boutons officiels Google +1, Twitter et Facebook Like. Si on n’affiche qu’un article seul, on récupère à l’aide du filtre the_content son contenu, et on insère à la fin de celui-ci les trois boutons.

Ensuite pour que les boutons Google +1 et Twitter fonctionnent, il est nécessaire d’inclure des fichiers JavaScript. Pour cela, il faut placer le code suivant dans vos pages. Je vous conseille de l’intégrer dans le fichier footer.php de votre thème, juste avant la balise ‹/body›.

<!-- Google +1 button -->
<script type="text/javascript">
  (function() {
    var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
    po.src = 'https://apis.google.com/js/plusone.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
  })();
</script>
<!-- Tweet button -->
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>

Bien évidemment, selon le thème que vous utilisez, vous aurez sûrement quelques adaptations à réaliser en CSS. De même, vous pouvez ajouter d’autres boutons si vous le souhaitez.

Cet article a été publié dans WordPress par . Mettez-le en favori avec son permalien.
  • Affiliation rencontre

    Merci pour ce petit billet, je garde ça sous le coude.
    Sinon bravo pour votre blog, c’est toujours cool un site de partage d’astuces avec quelques bouts de scripts.
    Bonne continuation.