Olivier Lalonde's blog

Olivier Lalonde's blog

Olivier Lalonde  //  Hey. I'm a friendly hacker, software engineering student, HN addict and startup guy from Montreal. I also tweet as @o_lalonde.

Jun 1 / 7:58pm
Posted by Olivier Lalonde

Adding Google's +1 (plus one) button to your Posterous

As well all know, Javascript isn’t allowed in Posterous themes. Luckily, iframes are and that’s what we’ll use to go around the no Javascript limitation.

posterous screenshot

Simply go to your Posterous dashboard, click "Settings" on the top right, then click the "Edit Theme" button and select the "Advanced tab". Now, all you have to do is paste one of the following snippets where you want the button to show up and click the "Save, I’m done!" button.

  • Standard button:

  • Tall button:

That’s all you have to do to integrate Google +1 to your Posterous.

If you want to host the script yourself, the source code is available on Github:

git clone https://olalonde@github.com/olalonde/google-plusone-posterous.git

47 comments

Jun 02, 2011
Jia-Jun Chen said...
Thank you!!!
Jun 03, 2011
Olivier Lalonde said...
You're welcome!
Jun 03, 2011
Rask Ulv said...
Thank you! I translated your post into Russian and added two more snippets for small and medium buttons.
Jun 04, 2011
Jason Blum said...
But then aren't people then just +1'ing http://dev.syskall.com/plusone/index.php?
Jun 04, 2011
Olivier Lalonde said...
No, that's what the ?url parameter is for. I use it on my own Posterous and all articles have their own +1 count, you can verify it by yourself. If you want to, you can also host the script on your own server if you have one: https://github.com/olalonde/google-plusone-posterous/blob/master/index.php
Jun 04, 2011
Jason Blum said...
Ah nice. Yeah so it is... Thank for sharing this. I'll put it on one of my servers and share the url back here.
Jun 05, 2011
lutzek said...
Thank you. Just works perfectly. I am no developer and not into html - but I did it ;-.)
Jun 09, 2011
miyaina liked this post.
Jun 12, 2011
Greg Lane said...
Olivier, very nice work! By the way, you might get slightly improved performance if you use https in your index.php file. There is an explanation of why here -> http://www.aaronpeters.nl/blog/google-plus1-button-performance-review On my server I also minified the file by removing all the spaces, carriage returns and comments. It's still really slow - but I suspect that's Google's problem. It would be great if they developed another official method for including the +1 with iframes for sites like Posterous.
Jun 30, 2011
Justin Hollis said...
Where should I put the code if I want it to show up in all my posts like the retweet and like button are?
Thanks.
Jul 03, 2011
Zalan Portik said...
Thanks, very useful...
Jul 06, 2011
Dean Barrow said...
Thanks, this save me time, I was going to create exactly the same today!
Jul 06, 2011
I use the same theme but my google +1 button is very close to the date and post. Additionally I would like to add the twitter button right above the plus one button just like you have done. Can you show your HTML theme?
Jul 10, 2011
kreason said...
in g+ under my +1 page, it shows my page (after i clicked +1) with a strange url, linking to the pluss one button rather then the homepage. yours doesnt. counl you help?
Jul 11, 2011
Richard Mackney said...
Nice work. Thanks for giving the source code to the project too. I'll use dev.syskall.com for now though If that's OK. Added.
Jul 11, 2011
Michael Litman liked this post.
Jul 12, 2011
Olivier Lalonde said...
@kreason: are you using Posterous?

@Richard Mackney: Feel free to use my server for now but I don't guarantee it will be supported forever!

Thanks for commenting all... I hadn't been able to access my Posterous in a while since I'm in China currently.

Jul 12, 2011
kreason said...
No I hosted on my own. But in g+ its posting a funny URL

Jul 12, 2011
Olivier Lalonde said...
@kreason: Replace {Permalink} by the URL you want to +1 in "http://dev.syskall.com/plusone/?url={Permalink}". Make sure the URL is "URL encoded" (in PHP: http://php.net/manual/en/function.urlencode.php)
Jul 14, 2011
alisha15 said...
Google plus one credited with a button to be an excellent choice for users of search engines to give the approval of the site publicly. Those who see the button are included in the user's social network by Google. It 'a great way for users to recommend a website or a product of their partners.

Buy Google Plus 1

Jul 18, 2011
Sam Hughes said...
Thanks for the code man, works a treat! Does anyone know how I would make the button +1 for another URL? I want a +1 button on my blog but for my site, and JS isn't allowed in posterous :(
Jul 20, 2011
@Danny _Fr said...
Thanks a lot for that!
Jul 21, 2011
Great ... just what I neede.

Thanks a lot.

Jul 21, 2011
@Danny _Fr said...
Just sharing: I made a GreaseMonkey script to add the +1 button to mostly any site you want (that is, from your browser).
You can get it here:

http://dannyfr.posterous.com/add-google-1-button-to-any-site-with-this-gre

Thanks for inspiring me ;)

Jul 23, 2011
Osamu Okanoya liked this post.
Aug 02, 2011
kreason said...
hi please could you remove my previous comments, i didnt realise that i had mosted my email signiture here and it poses id theft risks. please oblige me in this respect
Aug 07, 2011
EconoDomains said...
There are a lot of services offering plus ones to your website now. I have tried several and the best one I have found is Buy Google Plus Ones - They guarantee the plus ones and use real aged Google accounts from unique ip addresses. Highly recommended!
Aug 11, 2011
Gooogle said...
It 'a great way for users to recommend a website or a product of their partners.
thanks
sme
SMEBS-B2B Social Media
Aug 13, 2011
This unfortunately doesn't work with the LightMatter theme. I put it beneath the tweet button and it doesn't show up. Bummer.
Aug 19, 2011
david24 said...
Google plus one credited with a button to be an excellent choice for users of search engines to give the approval of the site publicly. Those who see the button are included in the user's social network by Google. It 'a great way for users to recommend a website or a product of their partners.

Buy Google Plus 1

Aug 20, 2011
david24 said...
Ah nice. Yeah so it is... Thank for sharing this. I'll put it on one of my servers and share the url back here.
Seamless Gutters
Aug 26, 2011
Je viens de rédiger une version française de ton tutoriel, merci !

http://www.blogemmanuel.com/google-1-posterous-et-moi

French version of that Google +1 on Posterous tutorial ;)

Sep 05, 2011
Olivier Lalonde said...
Ca fait plaisir, Emmanuel!
Sep 07, 2011
René said...
The button doesn't show up in Safari. Anyone else having this problem? Is there a fix?
Sep 15, 2011
Hi Olivier,

it seems to be off since last posterous spaces update :(

cela ne semble plus fonctionner depuis la mise à jour spaces de posterous
j'ai également essayé en hostant moi même le script

E.

Sep 26, 2011
Daryl Yeo said...
This is great, Olivier, but it seems like the part where you "Share on Google+" is missing or covered up. You can see the little arrow but the rest of the plugin (to type in the message that will show up on your Google+ feed) is blocked up. Maybe you'd like to fix that? :)
Oct 06, 2011
Tony Burkhart said...
Thank you @o_lalonde - Exactly what I was looking for. w00t!
Oct 12, 2011
Stephen Dowell said...
I noticed today that the plusone functionality seems to be broken in all browsers. What's changed?
Oct 13, 2011
Tony Michael said...
I noticed the same thing as Stephan.
It's broken on my Posterous page too.
(So I just removed it)

Anyone else experiencing that?
Or find a solution yet?

Thanks

Oct 13, 2011
Tony Burkhart said...
Bah! My G+ button doesn't even render anymore... something is amiss. I'm guessing Google changed the way it worked?
Oct 26, 2011
Alan Knowles said...
You might want to remove references to your server, some big news sites are using it 'as is'... (we where scraping with wkhtmltopdf, and discovered the link to your server was broken)

Try changing your dns to dev.syskall.com to 127.0.0.1

Nov 08, 2011
Adam Harrison said...
Got to advanced tab but cant see how you would paste it ? No fields to insert it in?
Nov 15, 2011
Kevin Megri said...
Now you can do Plus One for images also......Recently google allowing Plue one for images as well

Buy Google Plus One

Nov 17, 2011
Sam Hughes said...
I'm currently out of the office until the Tuesday the 23rd of November, all requests please forward to liam@mycleveragency.com.

Thanks,

Sam
Nov 17, 2011
Sam Hughes said...
I'm currently out of the office until the Tuesday the 23rd of November, please forward any requests to liam@mycleveragency.com.

Thanks,

Sam
Jan 12, 2012
John Roshka said...
When I stream my blog post with images on Google Plus it doesn't show the images. Can someone help?

Leave a comment...