Comment ajouter un bouton Retweet dans Blogger

retweet Twitter Tweet BloggerAjouter un bouton ReTweet (ou Tweet This) avec compteur du nombre de fois où l'article a été Tweeté, est très simple et je l'ai déjà expliqué plusieurs fois en répondant à des commentaires. Il y a plusieurs service qui proposent un script pour cela : Retweet.com - Topsy.com - Tweetmeme.com ...

Mais nous allons nous contenter de TweetMeme, la référence dans le domaine et qui est connu par presque tous le monde (même Facebook a recopié le bouton de TweetMeme).

Pour ajouter le bouton Retweet, copier ce code quelques part dans votre template:Tweetmeme
<div style="float:right;padding:5px;">
<script type='text/javascript'>
tweetmeme_url = &#39;<data:post.canonicalUrl>&#39;;
tweetmeme_source = &#39;LeBlogger&#39;;
</script>
<script src='http://tweetmeme.com/i/scripts/button.js' type='text/javascript'> </script></div>
Bien sûr, remplacez LeBlogger par votre identifiant Twitter et modifiez le code CSS comme vous voulez.

Pour utiliser la version compact du bouton, copiez ce code:retweet
<div style="float:right;padding:5px;">
<script type='text/javascript'>
tweetmeme_style = &#39;compact&#39;;
tweetmeme_url = &#39;<data:post.canonicalUrl>&#39;;
tweetmeme_source = &#39;LeBlogger&#39;;
</script>
<script src='http://tweetmeme.com/i/scripts/button.js' type='text/javascript'> </script></div> 
Où afficher le bouton
Pour afficher le bouton RT à droite en dessous du titre, connectez vous à Blogger, allez dans "Mise en page", "Modifier le code HTML", cochez la case "Développer des modèles de gadgets"," et collez le code juste après ça:
<div class='post-header-line-1'/>
à la fin de chaque article:
<data:post.body/>
Pour cacher le bouton de la page d'accueil, ajoutez une condition b:if comme ça:
    <b:if cond='data:blog.pageType == &quot;item&quot;'> Le code Bla Bla Bla </b:if>
Jetez aussi un coup d'œil sur ces articles qui peuvent vous intéresser
26 Commentaires
  1. C'est étrange, quand je copie colle la ligne de codes, cela me marque une erreur de codage. Je ne sais pas si c'est seulement moi ou bien si le code est erroné.

    RépondreSupprimer
  2. Woops c'est quoi le message d'erreur stp ;)

    RépondreSupprimer
  3. " Votre modèle ne peut pas être analysé, car sa structure n'est pas conforme. Vérifiez que tous les éléments XML sont bien fermés.
    Message d'erreur XML : Element type "div" must be followed by either attribute specifications, ">" or "/>". "

    RépondreSupprimer
  4. Ah en fait c'est juste une erreur de frape, j'avais mis le mot style" deux fois 8-)

    RépondreSupprimer
  5. Merci a toi de m'avoir signaler le bug :) sinon beaucoup de monde auraient zappé sans demander...

    RépondreSupprimer
  6. Hello soufiane,

    Je n'ai pas cette fameuse balise ""div class='post-header-line-1'""

    Tu serais comment faire ?

    Merci d'avance

    @ bientot

    RépondreSupprimer
  7. et hop le bouton sur mon blog thx :))

    RépondreSupprimer
  8. Salut Soufiane,

    Merci pour les astuces!

    RépondreSupprimer
  9. Merci, ajouté à mon blog http://actualise.fr/web-marketing venir voir le résultat et mon contenu ;)

    RépondreSupprimer
  10. Bonjour Soufiane,

    je ne parviens pas à trouver les lignes de code que tu évoques, certainement due au fait que je n'utilise pas un des modèles par défaut de blogger.
    j'ai fait plusieurs essais sans succès. pourrais-tu m'aider à trouver l'emplacement pour c/c ce script ?

    je me permets de te donner l'url de mon blog : http://made-in-asie.blogspot.com/

    un grand merci !
    Diana

    RépondreSupprimer
  11. Oups... j'avais oublié de cocher la case 'développer les widgets"... :)

    RépondreSupprimer
  12. Ce commentaire a été supprimé par l'auteur.

    RépondreSupprimer
  13. Bonjour, un autre merci pour cet article.

    RépondreSupprimer
  14. Bonjour, est-ce que vous avez été confronté à des problème avec ce bouton (qui est top et simple à mettre en place pour wordpress aussi) dans un site qui contient une redirection de nom de domaine.. En fait j'ai un domaine qui pointe vers l'hébergement (où se trouve le bouton) et du coup sur le front office il y a un ? à la place du nombre de tweet.. car il ne doit pas localiser le bouton comme il faut..
    Merci d'avance si vous avez des suggestions pour modifier le bout de code..

    RépondreSupprimer
  15. Bonjour, j'ai ajoute les 2 boutons (version compacte) facebook and retweet, de facon horizontale a droite, mais ils ne sont pas sur la meme ligne et sont legerement decales. Comment les aligner parfaitement ? d'avance merci !

    RépondreSupprimer
  16. Bonsoir Soufiane, en désespoir de cause, j'ai viré la personnalisation de mon template pour revenir à un modèle "simple" et pour l'instant je peux à nouveau insérer des éléments dans le template. Je viens donc de placer les boutons "j'aime" et "retweet" et, comme FDimages, j'aurais voulu les aligner (comme toi en haut des articles). Es-tu prêt à partager ton code ???
    Merci d'avance.

    RépondreSupprimer
  17. voila le bouton j'aime de facebook :
    cherche la balise :

    et posé le code aprris la balise : iframe

    RépondreSupprimer
  18. Svp, le code je le copie où exactement. Je souhaite ajouter le bouton dans mon blog sur blogger. Merci d'avance

    RépondreSupprimer
  19. @ Soufiane, même comment que Michèle

    RépondreSupprimer
  20. @ Soufiane, même comment que Michèle, comment mettre ces boutons juste à droite du titre et non en dessous + mes boutons s'affichent sur toutes les pages et pas seulement les articles. Cela me poste problème. Une soluce ?

    merci soufiane

    RépondreSupprimer
  21. Toujours pas de réponse de toi Soufiane.

    voici mon blog www.leblogakochou.com, et mes boutons apparaissent correctement dans les articles, mais aussi sur TOUTE les autres pages... comment annuler cela. C'est à dire des boutons uniquement dans les articles quoi...

    RépondreSupprimer
  22. Comment faire passer le nombre de retweets a droite sur la version compact du bouton. Tous mes autres boutons Facebook, Facebook "J'aime" et Twitter on leur compteur a droite. c'est pour une question d'esthetique. Merci.
    www.sole-patrol.com

    RépondreSupprimer
  23. Comment se fait il que mes boutons de partage ne s'affichent que sur la premiere page de mon blog et pas sur les suivantes?

    RépondreSupprimer

Copyright 2015 Soufiane.fr