vendredi 3 juin 2011

Ajouter le bouton +1 sur Blogger





Je vous ai déjà parlé du bouton +1 de Google, ce dernier peut être ajouté sur vos sites web afin de permettre aux visiteurs de recommander vos billets.


Vous allez alors le voir apparaitre :


Si ce n’est pas le cas, vous n’avez qu’à suivre ces étapes :
- Aller à Présentation > Modifier le code html.
- Cocher “Développer des modèles de gadget”
- Ajouter avant la balise </head> le code suivant :
<script src='https://apis.google.com/js/plusone.js' type='text/javascript'/>

Remarques :

- Si vous voulez ajouter le bouton seul, vous n’êtes, certes pas obligé d’ajouter les boutons de partage. Il suffit de suivre les étapes décrites précédemment et ajouter en plus, à l’endroit qu’il vous semble, le code suivant :
<g:plusone  size="medium" expr:href="data:post.url" count="true"></g:plusone>

- Si vous n’êtes pas sous Blogger, vous n’avez qu’à ajouter le script suivant :
<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
<g:plusone></g:plusone>

- Personnaliser la taille du bouton : Il suffit de changer la valeur de l’attribut size qui peut prendre une des valeurs suivantes : small (15 px), medium (20 px), standard (24 px) et big (65 px).
Voilà quelques exemples d'utilisation :
<g:plusone size="standard" expr:href="data:post.url"></g:plusone>
Aperçu :
<g:plusone size="small" expr:href="data:post.url"></g:plusone>
Aperçu :

- Afficher le compteur : Utiliser l’attribut count
<g:plusone count="true" expr:href="data:post.url"></g:plusone>
Aperçu :
<g:plusone count="false" expr:href="data:post.url"></g:plusone>
Aperçu :

Partagez cet article sur vos réseaux sociaux :



Recevez les nouveautés par email

2 commentaires:

Patrick Besset a dit…

après avoir coloré les boutons et intégrer le bouton Orkut... malgre la présence du bon code concernant l'ajout de Google +1... ce dernier bouton n'apparaît pas ?!?
Normal ?

Nawras a dit…

Pourtant, je le vois apparaître sur ton blog ! ça prend un peu du temps c'est tout ;)

Sélectionnez les signes à côté du smiley à insérer dans votre commentaire

:)) ;)) ;;) :X :(( =(( :-o :-* :| :)] :-t
b-( :-L :-/ o_O :D ;) :p :) :( 8-) ^^

Enregistrer un commentaire

Related Posts with Thumbnails