6 avr. 2012

Ajouter Le Bouton Officiel De Partage Twitter à Votre Blog

4/06/2012  , ,  9 comments

Bouton Officiel Twitter
Le bouton de partage officiel Twitter permettra à vos visiteurs de partager en toute simplicité des liens de vos articles sur le réseau Twitter sans quitter le blog et cela avec un simple clic.
Le bouton officiel Tweet existe en trois formats :
- 110*20 : Bouton Tweet + Compteur horizontal
- 55*20 : Bouton Tweet seul
- 55*63 : Bouton Tweet + Compteur vertical

Dans ce qui suit, nous allons voir comment installer le bouton de partage officiel Twitter dans Blogger Blogspot.



Ajouter Le Bouton De Partage Twitter à Blogger

Pour mettre en place le bouton Twitter, il suffit de copier (et modifier les informations vous concernant) ce code et le mettre sur vos pages, dans un endroit bien visible pour inciter vos lecteurs à l'utiliser.
Vous pouvez le copier par exemple après <data:post.body/> pour l'afficher à la fin des articles ou après <div class='post-header-line-1'/> pour l'afficher au début des articles.

Format vertical avec compteur

<div style='float:right;margin-right:10px;'>
<a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" data-via="TWITTER-USERNAME">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
</div>

Format Horizontal avec compteur

<div style='float:right;margin-right:10px;'>
<a href="http://twitter.com/share" class="twitter-share-button" data-count="horizontal" data-via="TWITTER-USERNAME">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
</div>

Format horizontal sans compteur

<div style='float:right;margin-right:10px;'>
<a href="http://twitter.com/share" class="twitter-share-button" data-count="none"  data-via="TWITTER-USERNAME">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script></div>
N'oubliez pas de remplacer "TWITTER-username" avec votre nom d'utilisateur Twitter.

Vidéo de démonstration (En Anglais)




Pour plus d'informations visitez le lien suivant : http://dev.twitter.com/pages/tweet_button

9 commentaires:

  1. Unknown23 juillet 2012 à 13:07

    Merci beaucoup pour cette astuce, ça m'a beaucoup aidé ^^.

    RépondreSupprimer
  2. Unknown28 août 2012 à 12:09

    Je n'arrive toujours pas à installer le bouton "Twitter" et "Facebook" sur mon blog (Blogspot) il affiche soit:
    -L'URL contient des caractères non autorisés... pour "twitter"
    -L'entrée doit contenir au plus 2 052 caractères... pour "Facebook"

    Vivement que vous m'aidez à résoudre ce problème.

    RépondreSupprimer
  3. TheBlogueur29 août 2012 à 21:54

    Bonjour Isim Sarl ,
    Avez-vous pensé utiliser plutôt les « boutons officiels »?
    L'option se trouve sous Mise En Page > Modifier (situé en bas à droite de "Messages du blog") > cocher "Afficher les boutons Partager" .

    Si oui, l'URL de votre blog est ?

    RépondreSupprimer
  4. Emmanuel6 septembre 2012 à 19:30

    Bonsoir, j'aimerai vous dire MERCI, j'ai suivis vos consignes tout comme ici http://theblogueur.blogspot.com/2012/05/ajouter-le-bouton-de-partage-facebook.html et tout fonctionne super bien. A présent je me permet de continuer ma visite sur ce blog sympa et poursuit mon apprentissage de bloggeur :)

    Amicalement,

    Emmanuel.

    RépondreSupprimer
  5. Boostyweb.fr20 décembre 2012 à 12:40

    Excellent article ! Pour OPTIMISER le bouton TWEET, je propose un TUTO VIDEO > http://www.youtube.com/watch?v=eIWxjVMFJ98
    Bon visionnage | Sinon vous pouvez retrouver ce tuto sur la page Facebook http://www.facebook.com/boostyweb

    RépondreSupprimer
  6. Eclairage Led4 février 2013 à 12:58

    Bonjour,
    Je n'arrive pas à trouver l'astuce pour un bouton "suivre" avec compteur vertical??? en JS
    Si quelqu'un a une info? merci d'avance

    RépondreSupprimer
  7. Catoneo18 mars 2013 à 18:53

    Bonjour,

    J'ai installé le bouton twitter en pied de post. Ca marche bien. Merci.
    Par contre par l'accès "Mise en page" de Blogger, je n'ai pas réussi à faire apparaître la "barre sociale" sur un modèle Watermark. Bizarre.

    RépondreSupprimer
  8. TheBlogueur19 mars 2013 à 03:14

    Bonjour ,
    Vous parlez de la barre de partage qui s'affiche en dessous des articles ?
    Pour l'activer, accédez à "Mise En Page" > cliquez sur le lien "Modifier" situé en bas à droite de "Messages du blog > Cocher la case : "Afficher les boutons Partager" puis cliquez sur "Enregistrer".
    Si le problème persiste, donnez l'url de votre blog.

    RépondreSupprimer
  9. Jeff Melclalex18 novembre 2013 à 09:57

    bjr,
    Est-il possible de n'intégrer ces codes uniquement sur un seul article de mon blog ? Si oui quelle est est la ligne de code à placer.
    merci
    www.perdre-la-raison.com

    RépondreSupprimer