Multiple Google +1 buttons on one page

June 02 2011

Adding many +1 buttons on one page is super-easy, compared to adding many Facebook Like buttons on one page. It’s a matter of inserting one script tag in head section and a little bit of special markup to where ever you want the +1 buttons to appear. For you, who’d much rather see proof right away, here’s the demo page for multiple +1 buttons. If you prefer an example or tutorial of sorts, then …
Raising hands
Let’s say I wanted to create two +1 buttons right inline here to two of my own blog posts. Let’s vote to “Werewolf’s footprint in Tuksi”  and to “Werewolf’s footprint in Padise“.

Here’s what you need to make this happen:

  1. Add <script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script> to the head section or just before closing body tag.
  2. Add <g:plusone href="your_first_url" size="small" count="false"></g:plusone> and <g:plusone href="your_other_url" size="small" count="false"></g:plusone> to somewhere in your html.
  3. That’s it, enjoy :)
Tags: , , ,

4 responses so far

  1. Harry
    on 21 Jun 2011 at 17:59

    Thanks for this Hillar.

    For anyone seeing the javascript error ‘Uncaught Cannot continue until a pending callback completes.’ it is usually caused by including the Google plus one javascript file multiple times.

    Harry

  2. Hillar Saare
    on 21 Jun 2011 at 18:29

    You’re welcome, Harry.

  3. Ped
    on 17 Jul 2011 at 19:32

    Cheers for this tip, I only have one slight problem and that’s getting the 2 pages to read the same score !! lol

    I’m using a CMS so the URL’s are outputted using Google Tap (Shortlinks) and as a result the URL’s are written slightly different between the home page content and the article content, so as a result the +1 buttons are not cosponsoring to each other…

    Thanks for the tip though, I also found that the URL’s have to be full, i.e http://yoursite.com/modules.php/article.html I was at first just using /modules.php/article.html and couldn’t work out why it was not working correctly. Got there in the end so thanks for this little article of yours ;-)

  4. David Carrington
    on 18 Jul 2011 at 18:43

    I’m adding a comment to hopefully give this page more oomph so more people can find it on.

    Harry’s answer about “Uncaught Cannot continue until a pending callback completes” and including plusone.js twice is correct and helped solved my issue too.

Leave a Reply