Tag Archives: +1 button

Google-1-button-has-arrived

Google +1 button for AddThis! Change size and personalize

I know, i know, what you all must be thinking! Since Google launched their +1 button everybody’s writing about it! BORING! Next thing you do is close this tab. Well to your surprise this article is not about integrating Google +1 button in your site but is rather inclined for those people who are experiencing trouble in placing the code and trying to make modifications to the button via AddThis.

Google+1Button

Since you are already here lets quickly brush up the coding for beginners who are not using the addthis platform (NORMAL METHOD):
Go to this site and make your selections, copy the generated code below and paste it wherever you want the button to show up.

Example:
Copy the code below and paste it in your header.php file just before the closing of </head> tag: *MUST FOR ALL BUTTON SIZES*

<script type=”text/javascript” src=”http://apis.google.com/js/plusone.js”></script>

Copy the code below and paste it where you want the button to be displayed: *CODE FOR STANDARD BUTTON (24px) only*

<g:plusone></g:plusone>

If you want to change the button size visit the above link and pick your size. Thats it! Now lets discuss what addthis users have to do to personalize their button style and size.

Addthis released the +1 button the same day when Google made it available. Since many of us are not addthis users, hence the tutorial above but for others who have been loyal fans of addthis community are recently experiencing some trouble as to how to make further changes to the readymade code given by addthis people as seen over here.

google+1-button-for-addthis

While googling around for the solution i came across this very interesting post by Mark Shu. He had written exactly what i was looking for! Here is how i succeeded to modify my button:

The standard code given by addthis people is this:

<a class=”addthis_button_google_plusone”></a>

If you want to change its size here is what you have to do:

<a class=’addthis_button_google_plusone’ g:plusone:size=’medium’/>

For other sizes just replace the word medium with small, standard or tall to get the respective button size. If you want no counter just include g:plusone:count=’false’ in the above code like this:

<a class=’addthis_button_google_plusone’ g:plusone:size=’medium’ g:plusone:count=’false’/>

If you want to play with other features take a look at Google’s +1 button API site. You can also see a +1 button integrated right here on this very post just beside the tweet button, what more…+1 this now! Your recommendation will be visible to all your connections.

google-plus-1-button-easy-share
Now post a comment if you have enjoyed this tutorial and if there are any questions pls dont stop asking! 🙂