Pour AGRANDIR et colorer en permanence les boutons de partage sur les réseaux sociaux de Blogger (comme ci-dessus), il SUFFIT d'ajouter le gadget HTML/JavaScript suivant dans un blog (il est inutile d'utiliser un code plus complexe) :<style type='text/css'>
.dummy-container{vertical-align:50%;}
.share-button {background: url(http://1.bp.blogspot.com/-9CNWvOaC9Tw/UK4Al2dhOoI/AAAAAAAABYM/E9uYd6etv44/s1600/res-soc-16.PNG) no-repeat left !important;width: 40px !important;height: 40px !important;}
.share-button{margin-left:5px;}
.post-share-buttons{display: inline-block;}
a.sb-email {background-position: 0px -40px !important;}
a.sb-blog {background-position: -40px -40px !important;}
a.sb-twitter {background-position: -80px -40px !important;}
a.sb-facebook {background-position: -120px -40px !important;}
a.sb-orkut {background-position: -160px -40px !important;}
a.sb-buzz {background-position: -200px -40px !important; width: 24px;}
a.sb-email:hover {background-position: 0px 0px !important;}
a.sb-blog:hover {background-position: -40px 0px !important;}
a.sb-twitter:hover {background-position: -80px 0px !important;}
a.sb-facebook:hover {background-position: -120px 0px !important;}
a.sb-orkut:hover {background-position: -160px 0px !important;}
a.sb-buzz:hover {background-position: -200px 0px !important;}
</style>
.dummy-container{vertical-align:50%;}
.share-button {background: url(http://1.bp.blogspot.com/-9CNWvOaC9Tw/UK4Al2dhOoI/AAAAAAAABYM/E9uYd6etv44/s1600/res-soc-16.PNG) no-repeat left !important;width: 40px !important;height: 40px !important;}
.share-button{margin-left:5px;}
.post-share-buttons{display: inline-block;}
a.sb-email {background-position: 0px -40px !important;}
a.sb-blog {background-position: -40px -40px !important;}
a.sb-twitter {background-position: -80px -40px !important;}
a.sb-facebook {background-position: -120px -40px !important;}
a.sb-orkut {background-position: -160px -40px !important;}
a.sb-buzz {background-position: -200px -40px !important; width: 24px;}
a.sb-email:hover {background-position: 0px 0px !important;}
a.sb-blog:hover {background-position: -40px 0px !important;}
a.sb-twitter:hover {background-position: -80px 0px !important;}
a.sb-facebook:hover {background-position: -120px 0px !important;}
a.sb-orkut:hover {background-position: -160px 0px !important;}
a.sb-buzz:hover {background-position: -200px 0px !important;}
</style>
* * * * *
Rappel : Comment ajouter un gadget HTML/JavaScript sur un blog* * * * *
Pour afficher d'autres boutons, il suffit de remplacer l'adresse figurant dans le code ci-dessus, dans la parenthèse qui suit URL, par exemple par celle-ci :http://2.bp.blogspot.com/-nXNl24B3LD0/UU174j7BhBI/AAAAAAAABmw/YW4PTEuQ4Ps/s1600/res-soc-22-t.PNG
On obtient ainsi les boutons suivants :
5 commentaires:
Pour info : pour ceux qui veulent insérer des caractères spéciaux sur leur blog, j'ai trouvé ceci, clair et pratique :
http://alexandre.alapetite.fr/doc-alex/alx_special.html
A partager
Merci pour l'astuce.
je viens de le faire cela fonctionne impeccable.
Mais il reste le bouton google+ un peu plus petit.
Rien ne se passe lorsque je copie colle ce code dans un nouveau gadget HTML, quelqu'un aurait la réponse? voici mon blog:
http://bilotheque.blogspot.fr/
Bonjour.
Ce gadget ne fait qu'agrandir des boutons existants.
Il faut d'abord ajouter les boutons de petite taille sur votre blog.
Bonne siteweb
Enregistrer un commentaire