Version finale des Boutons de partage officiels de Blogger [Exclu LeBlogger]
Je vous en avais parlé il y a plusieurs jours de cela (shareButtons - Des boutons de partage par défaut dans Blogger) et ben devinez quoi ? Blogger vient d'activer les shareButtons dans la version draft de Blogspot !
Vous pouvez tester la version finale des boutons sur LeBlogger.com, ils sont affichés au dessus des titres des articles.
Vous pouvez ensuite activer les boutons et les placer où que vous voulez dans votre Blogspot très très facilement.
Pour cela, dans la partie
Si vous ne les voyez toujours pas, laissez un commentaire en bas de cet article, vous devrez peut être ajouter un deuxième code ...
En plus comme je vous l'ai dit c'est la version finale des shareButtons que je vous propose ici et qui sera peut être officialisée par Blogger dans quelques jours ou quelques semaines ...
Comme vous le voyez sur la capture précédente, Blogger a ajouté et le titre du blog et le titre de l'article. Est ce que vous avez remarqué la même erreur ?

Le bouton de partage pour Blogspot ne sert absolument à rien (à mon avis) et je vous expliquerais plus tard comment le supprimer et comment replacer les autres boutons ...


Configuration
Pour ajouter les nouveaux boutons de partage, connectez vous à Blogger en allant dansdraft.blogger.com (et non pas www.blogger.com) puis allez dans Présentation, Éléments de la page et cliquez sur le bouton Modifier dans le champs Messages du blog.
Un problème ? La solution !
Ok vous avez effectué l'étape précédente mais les boutons ne s'affichent pas ??? Pas de problème, on va les afficher de force :)Pour cela, dans la partie
Modifier le code HTML, cochez la case Développer des modèles de gadgets puis, pour placer les boutons juste en dessous des titres des articles, recherchez <div class='post-header-line-1'> (ou <div class='post-header-line-1' />) et juste après ajoutez ce code :<div class='post-share-buttons'>Prévisualiser votre blog et normalement vous verrez les nouveaux boutons de partage.
<b:include data='post' name='shareButtons'/>
</div>
Remarque - Astuce
Une fois que vous avez effectué cette étape, dans votre tableau de bord Blogger (de la version standard et non la Draft) allez dansPrésentation, Éléments de la page et cliquez sur le bouton Modifier dans le champs Messages du blog et là, comme par magie, vous allez voir les boutons !
Informations sur les Boutons de partage
Faut t-il utiliser ces shareButtons dès maintenant
Oui, bien sûr. Pourquoi ? Parce ce que c'est simple à mettre en place, les boutons sont beaux, c'est une fonctionnalité intégrée à Bogger donc ces boutons sont beaucoup plus rapides et plus fiables que ceux ajoutés manuellement et à partir de plusieurs sources.En plus comme je vous l'ai dit c'est la version finale des shareButtons que je vous propose ici et qui sera peut être officialisée par Blogger dans quelques jours ou quelques semaines ...
Un raccourcisseur d'url automatique pour Twitter
Eh oui, la bonne nouvelle c'est que le bouton de partage pour Twitter utilise le raccourcisseur d'url de Google (aka goo.gl) pour raccourcir automatiquement les liens vers vos articles avant de les publier sur Twitter, c'était vraiment indispensable.
Une version Google Buzz amélioré
Le bouton de partage pour Google Buzz a été amélioré puisqu'en cliquant sur l’icône Google buzz le script récupère automatiquement le titre de l'article, le lien, la première image et le résumé qu'on peut modifier dans une fenêtre pop-up avant de le publier/partager.
Boutons de partage par email et par Blogspot !
Le bouton de partage par email est exactement le même que celui dont je vous parlais ici : Bouton pour envoyer les articles de votre Blogspot par emailLe bouton de partage pour Blogspot ne sert absolument à rien (à mon avis) et je vous expliquerais plus tard comment le supprimer et comment replacer les autres boutons ...
Qu'est ce que vous pensez de cette nouveauté ?
Qu'est ce que vous pensez de cette nouveauté et est ce que vous comptez utiliser ces nouveaux boutons ou pas ? N'hésitez pas à en discuter via les commentaires ...
English version of this post : New built-in Blogger sharing Buttons






Merci, c'est super ! Mais j'avoue que j'espere que blogger va nous proposer plusieurs mises en forme, et d'autres icones. Parce que je ne suis pas super fan du peu de possibilités.
En tout cas merci à toi ! =)
Peut être que Blogger fera quelque chose dans cette direction lorsqu'ils lanceront ces boutons ...
Ah oui PS regard cet article pour utiliser une image en avatar dans les commentaire Blogger : http://www.leblogger.com/2009/09/image-profil-commentateur-commentaire.html
Terrible l'infos
comment faire pour ne pas faire apparaitre les boutons de partage en page d'accueil, mais dans le billet ? Merci pour ton aide
Bonjour Soufian, tout d'abord, un grand bravo, tu t'en doutes, j'apprécie ton "nouveau look" !
Je viens de tenter le placement des boutons et c'est la deuxième méthode qui a fonctionné, sauf qu'ils apparaissent en bas du message. As-tu une astuce pour qu'ils apparaissent après ou juste au-dessus du titre comme chez toi?
Dans l'élément de page, je l'ai bien placé sous le titre.
Merci d'avance.
ouais, c'est pas mal, mais impossible pour moi de le mettre en abs de message, et pas juste après le titre !
Bonjour !
Le gadget n'a pas fonctionné dans "configurer les messages (dommage ! j'avais également coché la case "afficher les notations en étoiles".
J'ai donc utilisé la seconde méthode. Super ...
Toujours aussi performant ..
Merci Soufiane. En effet, mon avatar avait disparu, je ne sais aps vraiment pourquoi. Il est de nouveau en place ;) Merci encore pour toutes tes astuces. Ton site est une vraie mine d'or.
@Anonyme
Il faut ajouter une condition B:if j'en ai parlé dans d'autres articles ...
@Michèle Attention à la Terre
Tu utilises une Template très personnalisée et la plupart des marqueurs Blogger ont été modifié donc c'est impossible de t'indiquer exactement où est ce qu'il faut mettre le code :-(
Pour la plupart des autres blogs, les boutons sont placés à la bonne place ...
@Miss Choco
@Francine
@Stéphane Ribeiro
Merci pour les gentils commentaires °__°
Testé et adopté!!! Merci Soufiane!
Ok, grand merci pour ta réponse Soufiane, au moins je sais pourquoi maintenant !
Trop grisés, ils incitent peu à être utilisé...
Merci beaucoup pour cette astuce. J'ai utilise la 2eme facon car la 1ere ne fonctionnai pas. Je suis debutante et j'aimerai aligne la barre a droite, comment faire ?
Merci d'avance
@ anomyme
Pour ne pas afficher en page accueil, mais uniquement dans les billets encadrer le code donné au dessus par : :
<b:if cond='data:blog.pageType == "item"'> LE CODE BLABLABLA </b:if>
Merci bcp! :)
J'aimerais obtenir un widget Htlm (<div...(</)pour MON blog de l'Anglais en Français. Merci
@coccxyphil: Grand merci pour l'astuce, ça allège ma page d'accueil. Il me reste à trouver l'astuce pour envoyer ces boutons sous le titre et non sous l'article, mais, comme l'a dit Soufiane, mon template ne suit pas la règle Blogger...Je vais penser à le changer.
@coccxyphil
Merci pour la réponse, il faut mieux utiliser ce code :
<b:if cond='data:blog.pageType != "index"'> LE CODE BLABLABLA </b:if>
Qui va afficher les boutons dans et les pages d'articles et les pages statiques ....
Fantastique! Merci beaucoup! C'est exactement ce que je recherchais :-)
Oh lalala! quel bonheur de vous découvrir!!!
Salut Soufiane, ton blog est de plus en plus agréable, bravo pour ton taf ! J'aurais voulu savoir comment placer la barre sur la droite du post-footer
@Fox Prime
Merci, Tu peux agir sur les boutons en ajoutant la class CSS "post-share-buttons", quelque chose de ce genre :
.post-share-buttons{
float:right;
}
Super cette fonctionnalité, espérons qu'ils l'améliorent. :)
Je découvre ton blog et j'avoue qu'il me plaît déjà.
J'ai bien suivi les instructions indiqués mais ça ne fonctionne pas sur mon blog donc j'ai remis les boutons de partage Addthis.
Bug de Blogger ?
:) SUPER , pas de problèmes pour l'installation !
Bonjour, je rejoins Fox Prime pour intégrer les boutons sur la droite, ou la gauche? Je ne suis pas un gros pro du code html, alors j'ai essayé diverses façons d'intégrer le code que tu as donné précédemment, mais rien n'y fait ! ou le code n'est pas bon, ou bien rien ne se passe.
bref, j'implore ton aide
Bonjour,
bravo et merci pour le travail qui doit être vraiment conséquent!
Je ne sais pas comment integrer la case à cocher sous les articles comme ceci http://i913.photobucket.com/albums/ac338/lydiaa_03/Capture01.jpg sur blogger...J'ai été dans présentation, message du blog, et j'ai mis ce que je devais mettre dans réactions mais ça n'a pas l'air de fonctionner.
Je ne trouve l'info nulle part! heeeelp
merci
Bonjour Soufiane et merci pour ton astuce qui a bien fonctionné sur mon blog !
J'ai un autre problème maintenant : le bouton facebook met en lien sur mon profil le premier commentaire posté sous mon post de blog et non le post lui-même...
Sais-tu comment modifier cela ?
Merci d'avance pour tes conseils !
Comment faire pour que les boutons de partage apparaissent en bas de l'article et non à coté du titre???
Bonjour,
Félicitations pour votre site ! Il m'a beaucoup aidé et c'est une mine d'or ! Bravo!
J'ai suivi vos instructions car malgré le fait de cocher "afficher les boutons de partage" dans Figurer les messages, les boutons n'apparaissaient pas. Maintenant ils apparaissent bien, mais impossible de les placer en bas du message (ils sont en haut). Vous pouvez m'aider ? Je vous remercie, Sandrine
Bonjour Soufiane !
Dis-moi lorsqu'on utilise le bouton de partage vers Facebook d'un article Blogger, l'article en question n'apparaît pas correctement sur FB : l'image de l'article apparaît mais pas le texte de l'article (au lieu du texte de l'article il y a le texte que je met au dessus de la fenêtre de saisie des commentaires.
As-tu une idée là-dessus ? Ca te fais ça aussi ?
Merci à toi.
bonjour
Merci, génial cette aide !!!
2 remarques tout de même :
- ca ne s'affiche pas à l'endroit proposé par blogger, mais en dessous du titre. Soit mais je fais remarquer cette bizzarerie technique. A noter que je préfère ;o))
ca s'affiche en Noir et Blanc, c'est pas joli du tout et je ne sais pas comment y remédier. Cf. http://ericlediemerophile.blogspot.com/
Merci par avance pour votre aide.
Cdt Eric
Bonjour
Merci beaucoup pour cette article sur les boutons de partage sur Blogger. Je cherchais une solution pour ça.
Toutefois, dans un autre contexte, depuis hier , un de mes blogs a disparu de mon tableau de bord Blogger, c'est le blog AGIR-POUR-RÉUSSIR. Donc, je ne peux plus gérer mon blog , qui est toujours en ligne. J'ai l'habitude d'y ajouter un nouvel article presque chaque jour. Mais n'ayant plus accès à ce blog à partir de mon tableau de bord, je ne pourrai plus publier d'article sur ce blog.
Si quelqu'un pouvait m'aider à réintégrer le blog disparu sur mon tableau de bord de Blogger, j'en serais très heureuse.
Merci aux personnes qui m'apporteront de l'aide
Cordialement
Marie-Micheline
Bonsoir,
J'ai beau passer par l'outil "Configurer les messages" et par l'insertion du code par moi-même pour ajouter les boutons Partager, cela ne marche pas réellement : les boutons sont bien ajoutés mais ne sont pas visibles, comme s'ils étaient transparents. J'ai un grand espace vide à la place et lorsque je passe ma souris, le lien s'affiche dans l'info-bulle. J'ai repéré ce problème sur d'autres blogs que le mien. Avez-vous une solution, car cela fait deux nuits que je cherche à comprendre ce qui se passe...
http://e-voyagedansletemps.blogspot.com/
Merci par avance,
Frédérique
Finalement, j'y suis parvenue à force de tripatouiller le code. Je me demande si ce n'est pas grâce à ce code que j'ai rajouté avant que cela fonctionne :
.post-share-buttons a
{
position: relative;
display: inline-block;
}
]]>
En tout cas, ça marche...
Frédérique
Bonjour,
J'ai appliqué la dernière astuce (celle de frédérique), j'arrive à afficher ces fameuses icônes (sans la notion display, ça ne s'affichent pas sur mon blog...).
Par contre, impossible de l'afficher au bon endroit (cad DANS l'article, une fois ouvert, au niveau du commentaire)
Pouvez vous m'aidez svp ?
Mon blog : http://theblackstout.blogspot.com/
Bonjour Soufiane !
Je souhaitai rajouter tous ces boutons de partage pour me faciliter la vie, mais je crois que mon template pose problème...
J'ai eu beau regarder dans tous les sens et appliquer tes conseils, je n'y arrive pas.
Je suis consciente d'avoir fait (pas mal) d'erreurs depuis que j'ai créé mon blog puisque j'ai dû tout apprendre "sur le tas"...
Pourrais-tu me dire d'où pourrait venir l'erreur s'il te plait ?
Tu peux voir mon site via mon nom (je n'ai pas pû me connecter via mon compte, encore un bug je présume >____<)
Re ^_____^
J'ai rajouté les lignes données par Frédérique ( sans le ]]) ), un Grand MERCI ! ça fonctionne, mes icônes apparaissent enfin et sont valides : ).
Désolée pour cette demande qui a finalement trouvé sa solution, et merci pour tous les conseils trouvés encore sur ton blog Soufiane ;) .
Bonjour,
J'ai vu cette astuce sur le net, car moi aussi je trouvais les boutons bien trop peu visibles et grisés!
http://nawras-univers.blogspot.com/2011/07/colorer-les-boutons-de-partage.html?spref=tw
Quelques lignes qui mettent en valeur les boutons de partage :)
Par contre si quelqu'un sait comment par exemple virer le bouton buzz tout en laissant les autres, je suis preneur ! Merci
coll merci
http://ogratuito.webnode.fr/bate-papo/
mon site en portugais ce link cet pour chat sur le site
lesse vous comentaire sur le site aussi
bonjour soufiane
jai ajouté des botons de partage mais ils sont trop gris . es tu peu m aider
merci
Bonjour !
La deuxième solution a bien marché pour moi (afficher les boutons de force sous le titre) mais en les testant, je me rend compte que le bouton Facebook ne fonctionne pas. En cliquant dessus, une nouvelle fenêtre FB s'ouvre avec "publier ce lien sur votre mur", jusque là nickel, mais c'est en cliquant sur "partager" ou il ne se passe rien !!
Et forcement, rien n'est publié sur mon mur... Auriez-vous une solution ?
Merci beaucoup à tous !