01 April 2010

Add Google Buzz Buttons with Share Counter to Your Blogger Blog in One Step.

Advertisements

You have Tweeter, you have Facebook an now it is time of Buzzing! And it is from our Google. Google launched it's social networking and messaging tool on Feb 2010. You can share links, text images, videos using Buzz. As per Wikipedia - Buzz enables users to choose to share publicly with the world or privately to a group of friends each time they post. And you have seen Buzz It buttons on the most of the blogs. now let's add to your blog.




Login to Blogger > Layout > Edit HTML > Expand Widget Templates. Look for the code

<div class='post-header-line-1'/>

Now choose your any one of the following code and place AFTER <div class='post-header-line-1'/>


Code-

<a expr:href='&quot;http://www.google.com/reader/link?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title + "&amp;srcTitle=" + data:blog.title' target='_blank'><div style='border:0px !important;text-align:right;margin-top:-42px;'><img alt='Buzz It' src='http://3.bp.blogspot.com/_tbHfaj1A058/S7RMJDUMHWI/AAAAAAAAJsA/5patHMKF3EU/s1600/buzz+it.png'/></div></a>


OR


Code-

<a expr:href='&quot;http://www.google.com/reader/link?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title + "&amp;srcTitle=" + data:blog.title' target='_blank'><div style='border:0px !important;text-align:right;margin-top:-42px;'><img alt='Buzz It' src='http://3.bp.blogspot.com/_tbHfaj1A058/S7ROoLW4YkI/AAAAAAAAJsQ/1tLKye4JBlw/s1600/buzz+wide+1.png'/></div></a>

OR

Code from LeBlogger

Using the code user can select any text and/or image of the post and then can click on Buzz It button and that part will be posted. Here is the code

<a href='javascript:var%20b=document.body;var%20GR________bookmarklet_domain=&quot;http://www.google.com&quot;;if(b&amp;&amp;!document.xmlVersion){void(z=document.createElement(&quot;script&quot;));void(z.src=&quot;http://www.google.com/reader/ui/link-bookmarklet.js&quot;);void(b.appendChild(z));}else{}' title='Buzz It!'><div style='border:0px !important;text-align:right;margin-top:-42px;'><img alt='Buzz It' src='http://3.bp.blogspot.com/_tbHfaj1A058/S7RMJDUMHWI/AAAAAAAAJsA/5patHMKF3EU/s1600/buzz+it.png'/></div></a>


DEMO of This Google Buzz Button.

You can Change alignment and top margin of these buttons by altering value in red.

Finally save your Template.



UPDATE: Google Buzz Button with Share Counter


Want any one of the above Google Buzz Button with Share Counter? Then AFTER
<div class='post-header-line-1'/> 
place following code

<div style="float:right;padding:4px;">
<script type='text/javascript'>
njuice_buzz_url = '<data:post.title/>';
njuice_buzz_title = '<data:post.url/>';
njuice_buzz_share = 'reader';
</script>
<script type='text/javascript' src='http://button.njuice.com/buzz.js'/>
</div>

For different styles you can add
njuice_buzz_size = 'normal_green';
or
njuice_buzz_size = 'simple';
after
njuice_buzz_share = 'reader';

Get more styles here.

Live Demo of Google Buzz Button with Share Counter

Finally save your template.

Related Posts

6 comments

April 3, 2010 at 11:51 PM

Thanks for your link to LeBlogger.com

April 4, 2010 at 12:15 AM

You are Welcome Soufiane LeBlogger.

August 30, 2010 at 12:22 PM

@ drraman i have added all social buttons, but when i move from 1st page to 2nd then social bookmarks does not apear like facebook like button, buzz button, twitter etc..

here is the link to blog

http://jobsansaar.blogspot.com/

Thanks

August 31, 2010 at 2:45 AM

There is now a new service which have elegant buttons.

Add "AddThis" Bookmarking & Social Sharing button to Blogger blogs

August 31, 2010 at 4:42 AM

@drraman it is showing on first page only not on all.

whats the problem ?

please check it out

September 1, 2010 at 1:54 AM

It shows on all posts. Try add this button it is very good.
http://www.blogger-help.com/2010/07/add-addthis-bookmarking-social-sharing.html

Post a Comment

Share

Twitter Delicious Facebook Digg Stumbleupon Favorites More