Google – Ajouter le bouton +1 de Google

Il est facile de trouver de l’aide sur internet concernant la question du « Comment ajouter le bouton +1 de Google ?« . Cependant, on me pose encore la question et je vais donc faire un petit article sur comment intégrer ce bouton à vos pages web.

google-button

En fait, il suffit juste de vous rendre sur ce lien.

Toutes les manip, sont décrites, mais je vais tout de même les exposer ici aussi :

1 / Insérez ce code, dans le head de votre site web :

[pastacode lang= »markup » manual= »%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22http%3A%2F%2Fapis.google.com%2Fjs%2Fplusone.js%22%3E%3C%2Fscript%3E » message= » » highlight= » » provider= »manual »/]

2 / Ensuite, il suffit d’insérer les balises suivantes à l’endroit ou vous souhaitez votre bouton :
pour une version petite :

[pastacode lang= »markup » manual= »%3Cdiv%20style%3D%22text-indent%3A%200px%3B%20margin%3A%200px%3B%20padding%3A%200px%3B%20background%3A%20transparent%20none%20repeat%20scroll%200%25%200%25%3B%20border-style%3A%20none%3B%20float%3A%20none%3B%20line-height%3A%20normal%3B%20font-size%3A%201px%3B%20vertical-align%3A%20baseline%3B%20display%3A%20inline-block%3B%20width%3A%2070px%3B%20height%3A%2015px%3B%22%20id%3D%22___plusone_0%22%3E%3Ciframe%20ng-non-bindable%3D%22%22%20hspace%3D%220%22%20marginheight%3D%220%22%20marginwidth%3D%220%22%20scrolling%3D%22no%22%20style%3D%22position%3A%20static%3B%20top%3A%200px%3B%20width%3A%2070px%3B%20margin%3A%200px%3B%20border-style%3A%20none%3B%20left%3A%200px%3B%20visibility%3A%20visible%3B%20height%3A%2015px%3B%22%20tabindex%3D%220%22%20vspace%3D%220%22%20id%3D%22I0_1487939053323%22%20name%3D%22I0_1487939053323%22%20src%3D%22https%3A%2F%2Fapis.google.com%2Fu%2F0%2Fse%2F0%2F_%2F%2B1%2Ffastbutton%3Fusegapi%3D1%26amp%3Bsize%3Dsmall%26amp%3Borigin%3Dhttp%253A%252F%252Fblog.ludikreation.com%26amp%3Burl%3Dhttp%253A%252F%252Fblog.ludikreation.com%252Fgoogle-ajouter-le-bouton-1%252F%26amp%3Bgsrc%3D3p%26amp%3Bjsh%3Dm%253B%252F_%252Fscs%252Fapps-static%252F_%252Fjs%252Fk%253Doz.gapi.fr.G3iKCWefhzA.O%252Fm%253D__features__%252Fam%253DAQ%252Frt%253Dj%252Fd%253D1%252Frs%253DAGLTcCPMJsstv_doF6VbbEygLQ39mO8imw%23_methods%3DonPlusOne%252C_ready%252C_close%252C_open%252C_resizeMe%252C_renderstart%252Concircled%252Cdrefresh%252Cerefresh%26amp%3Bid%3DI0_1487939053323%26amp%3Bparent%3Dhttp%253A%252F%252Fblog.ludikreation.com%26amp%3Bpfname%3D%26amp%3Brpctoken%3D19627966%22%20data-gapiattached%3D%22true%22%20title%3D%22%2B1%22%20width%3D%22100%25%22%20frameborder%3D%220%22%3E%3C%2Fiframe%3E%3C%2Fdiv%3E » message= » » highlight= » » provider= »manual »/]
pour une version standard :

[pastacode lang= »markup » manual= »%3Cdiv%20style%3D%22text-indent%3A%200px%3B%20margin%3A%200px%3B%20padding%3A%200px%3B%20background%3A%20transparent%20none%20repeat%20scroll%200%25%200%25%3B%20border-style%3A%20none%3B%20float%3A%20none%3B%20line-height%3A%20normal%3B%20font-size%3A%201px%3B%20vertical-align%3A%20baseline%3B%20display%3A%20inline-block%3B%20width%3A%20106px%3B%20height%3A%2024px%3B%22%20id%3D%22___plusone_1%22%3E%3Ciframe%20ng-non-bindable%3D%22%22%20hspace%3D%220%22%20marginheight%3D%220%22%20marginwidth%3D%220%22%20scrolling%3D%22no%22%20style%3D%22position%3A%20static%3B%20top%3A%200px%3B%20width%3A%20106px%3B%20margin%3A%200px%3B%20border-style%3A%20none%3B%20left%3A%200px%3B%20visibility%3A%20visible%3B%20height%3A%2024px%3B%22%20tabindex%3D%220%22%20vspace%3D%220%22%20id%3D%22I1_1487939053333%22%20name%3D%22I1_1487939053333%22%20src%3D%22https%3A%2F%2Fapis.google.com%2Fu%2F0%2Fse%2F0%2F_%2F%2B1%2Ffastbutton%3Fusegapi%3D1%26amp%3Borigin%3Dhttp%253A%252F%252Fblog.ludikreation.com%26amp%3Burl%3Dhttp%253A%252F%252Fblog.ludikreation.com%252Fgoogle-ajouter-le-bouton-1%252F%26amp%3Bgsrc%3D3p%26amp%3Bjsh%3Dm%253B%252F_%252Fscs%252Fapps-static%252F_%252Fjs%252Fk%253Doz.gapi.fr.G3iKCWefhzA.O%252Fm%253D__features__%252Fam%253DAQ%252Frt%253Dj%252Fd%253D1%252Frs%253DAGLTcCPMJsstv_doF6VbbEygLQ39mO8imw%23_methods%3DonPlusOne%252C_ready%252C_close%252C_open%252C_resizeMe%252C_renderstart%252Concircled%252Cdrefresh%252Cerefresh%26amp%3Bid%3DI1_1487939053333%26amp%3Bparent%3Dhttp%253A%252F%252Fblog.ludikreation.com%26amp%3Bpfname%3D%26amp%3Brpctoken%3D17651324%22%20data-gapiattached%3D%22true%22%20title%3D%22%2B1%22%20width%3D%22100%25%22%20frameborder%3D%220%22%3E%3C%2Fiframe%3E%3C%2Fdiv%3E » message= » » highlight= » » provider= »manual »/]
pour une version moyenne :

[pastacode lang= »markup » manual= »%3Cdiv%20style%3D%22text-indent%3A%200px%3B%20margin%3A%200px%3B%20padding%3A%200px%3B%20background%3A%20transparent%20none%20repeat%20scroll%200%25%200%25%3B%20border-style%3A%20none%3B%20float%3A%20none%3B%20line-height%3A%20normal%3B%20font-size%3A%201px%3B%20vertical-align%3A%20baseline%3B%20display%3A%20inline-block%3B%20width%3A%2090px%3B%20height%3A%2020px%3B%22%20id%3D%22___plusone_2%22%3E%3Ciframe%20ng-non-bindable%3D%22%22%20hspace%3D%220%22%20marginheight%3D%220%22%20marginwidth%3D%220%22%20scrolling%3D%22no%22%20style%3D%22position%3A%20static%3B%20top%3A%200px%3B%20width%3A%2090px%3B%20margin%3A%200px%3B%20border-style%3A%20none%3B%20left%3A%200px%3B%20visibility%3A%20visible%3B%20height%3A%2020px%3B%22%20tabindex%3D%220%22%20vspace%3D%220%22%20id%3D%22I2_1487939053340%22%20name%3D%22I2_1487939053340%22%20src%3D%22https%3A%2F%2Fapis.google.com%2Fu%2F0%2Fse%2F0%2F_%2F%2B1%2Ffastbutton%3Fusegapi%3D1%26amp%3Bsize%3Dmedium%26amp%3Borigin%3Dhttp%253A%252F%252Fblog.ludikreation.com%26amp%3Burl%3Dhttp%253A%252F%252Fblog.ludikreation.com%252Fgoogle-ajouter-le-bouton-1%252F%26amp%3Bgsrc%3D3p%26amp%3Bjsh%3Dm%253B%252F_%252Fscs%252Fapps-static%252F_%252Fjs%252Fk%253Doz.gapi.fr.G3iKCWefhzA.O%252Fm%253D__features__%252Fam%253DAQ%252Frt%253Dj%252Fd%253D1%252Frs%253DAGLTcCPMJsstv_doF6VbbEygLQ39mO8imw%23_methods%3DonPlusOne%252C_ready%252C_close%252C_open%252C_resizeMe%252C_renderstart%252Concircled%252Cdrefresh%252Cerefresh%26amp%3Bid%3DI2_1487939053340%26amp%3Bparent%3Dhttp%253A%252F%252Fblog.ludikreation.com%26amp%3Bpfname%3D%26amp%3Brpctoken%3D36375011%22%20data-gapiattached%3D%22true%22%20title%3D%22%2B1%22%20width%3D%22100%25%22%20frameborder%3D%220%22%3E%3C%2Fiframe%3E%3C%2Fdiv%3E » message= » » highlight= » » provider= »manual »/]
pour une version grande :

[pastacode lang= »markup » manual= »%3Cdiv%20style%3D%22text-indent%3A%200px%3B%20margin%3A%200px%3B%20padding%3A%200px%3B%20background%3A%20transparent%20none%20repeat%20scroll%200%25%200%25%3B%20border-style%3A%20none%3B%20float%3A%20none%3B%20line-height%3A%20normal%3B%20font-size%3A%201px%3B%20vertical-align%3A%20baseline%3B%20display%3A%20inline-block%3B%20width%3A%2050px%3B%20height%3A%2060px%3B%22%20id%3D%22___plusone_3%22%3E%3Ciframe%20ng-non-bindable%3D%22%22%20hspace%3D%220%22%20marginheight%3D%220%22%20marginwidth%3D%220%22%20scrolling%3D%22no%22%20style%3D%22position%3A%20static%3B%20top%3A%200px%3B%20width%3A%2050px%3B%20margin%3A%200px%3B%20border-style%3A%20none%3B%20left%3A%200px%3B%20visibility%3A%20visible%3B%20height%3A%2060px%3B%22%20tabindex%3D%220%22%20vspace%3D%220%22%20id%3D%22I3_1487939053346%22%20name%3D%22I3_1487939053346%22%20src%3D%22https%3A%2F%2Fapis.google.com%2Fu%2F0%2Fse%2F0%2F_%2F%2B1%2Ffastbutton%3Fusegapi%3D1%26amp%3Bsize%3Dtall%26amp%3Borigin%3Dhttp%253A%252F%252Fblog.ludikreation.com%26amp%3Burl%3Dhttp%253A%252F%252Fblog.ludikreation.com%252Fgoogle-ajouter-le-bouton-1%252F%26amp%3Bgsrc%3D3p%26amp%3Bjsh%3Dm%253B%252F_%252Fscs%252Fapps-static%252F_%252Fjs%252Fk%253Doz.gapi.fr.G3iKCWefhzA.O%252Fm%253D__features__%252Fam%253DAQ%252Frt%253Dj%252Fd%253D1%252Frs%253DAGLTcCPMJsstv_doF6VbbEygLQ39mO8imw%23_methods%3DonPlusOne%252C_ready%252C_close%252C_open%252C_resizeMe%252C_renderstart%252Concircled%252Cdrefresh%252Cerefresh%26amp%3Bid%3DI3_1487939053346%26amp%3Bparent%3Dhttp%253A%252F%252Fblog.ludikreation.com%26amp%3Bpfname%3D%26amp%3Brpctoken%3D13808289%22%20data-gapiattached%3D%22true%22%20title%3D%22%2B1%22%20width%3D%22100%25%22%20frameborder%3D%220%22%3E%3C%2Fiframe%3E%3C%2Fdiv%3E » message= » » highlight= » » provider= »manual »/]

Et vous avez votre bouton +1 de google 🙂

Si vous aimez les articles du blog, n’hésitez pas à l’utiliser ce bouton +1 de google, il se trouve sur le menu latéral de droite du blog 😀

Bon code à tous !!!

Articles qui peuvent vous intéresser :

Author: Franck Pertegas

Share This Post On

12 Comments

  1. Effectivement, on peut dire que c’est une bonne synthèse !

    Post a Reply
  2. Merci pour cette revue…

    Par contre, est-ce que le fait d’intégrer ce +1 à son site permet à GG de collecter des infos sur le site en question, ou juste un nombre de clics sur le bouton ?

    Post a Reply
  3. Comme souvent avec google, il est évident qu’il collecte des info sur le site en question. (est-ce une mauvaise chose ? pas à mon avis)

    En tout cas, si tu utilises l’analytic’s de google, la question ne se pose plus, car le +1 ne récoltera jamais plus d’information que l’analytic’s de google 😉

    Post a Reply
  4. En revanche, ce inclus, qui permet au site de rassembler des informations sur le site DD, ou tout simplement en cliquant sur le bouton?

    Post a Reply
  5. Par contre, il est de l’inclure pour le site permet GG recueillir des informations sur le site, ou juste un clic de bouton?

    Post a Reply
  6. L’outil même est censé donner simplement des informations liées à un clic réalisé par un visiteur. Mais il est logique et je ne vois pas d’autres choix, que Google récupère des informations sur la page en question.

    Post a Reply
  7. Pile poil ce que je cherchais, merci pour le bout de code !

    Post a Reply
  8. En tout cas, si tu utilises l’analytic’s de google, la question ne se pose plus, car le +1 ne récoltera jamais plus d’information que l’analytic’s de google

    Post a Reply

Submit a Comment

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *