Friday, March 5, 2010

How to Add Google Buzz to Blogger

Unlike Google Wave - which, though seemingly revolutionary, was off to a shaky start, Buzz is easy to understand and use. No wonder that it captured its users attention.

google buzz for blogger There’s no question that Google has successfully leveraged its huge Gmail base to get users to play on his social tool. But you? Have you added Buzz to your Blogger blog?

If you are using a “social button aggregator” such as “Share This” or “Add This” or “Add to Any”, Buzz has already been added. If you are using the Feedburner Flare code, make sure you check the appropriate box. However, many people do not use any of the above as they might result in few clicks or submissions, preferring instead to use separate buttons for each service.

Both of the following solutions require you to edit the Blogger Template (Layout). You do so by going to your Blogger Dashboard, then in the Layout editor, then checking the “expand widgets” checkbox. You might want to save a backup of your template prior to making any changes, so you can quickly revert to it in case something goes wrong. Also, you might want to first download the images (buttons) and upload them to your own Picasa(web) account, changing the image src URL as necessary.

After (optionally) saving your template, find the following code in your template (or similar), then paste whichever solution you prefer immediately below:

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


If you cannot find that code, look for the following then paste either one of the two solutions code above it:



<data:post.body/>



The first solution is courtesy of BloggerTemplates (bti).



<div style="float:right;padding:4px;">

<a expr:href='&quot;http://www.google.com/reader/link?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title + &quot;&amp;srcTitle=&quot; + data:blog.title+ &quot;&amp;srcURL=&quot; + data:blog.homepageUrl ' rel='nofolloW' style='text-decoration:none;' target='_blank'>


<img alt='Buzz It' src='http://i49.tinypic.com/25yy8pd.png' style='border:0px;'/></a>


</div>



The second solution, from allblogtools, is a bit more complex.



The first code represents a regular button:




<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{}'><img alt='Buzz this' src='http://img2.pict.com/15/da/3e/2809374/0/googlebuzz.png'/></a>



 



google buzz compact buttonThe second is a compact version:



<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{}'><img alt='Buzz this' src='http://img2.pict.com/9c/09/57/2854010/0/buzzthis.gif'/></a>


 



Sources / More info: allblogtools, bti, yt-google-buzz





No comments:

Post a Comment

Thank you for commenting and rest assured that any and all comments are welcome, whether positive or negative, constructive or distructive. Unfortunately, if you comment in this view I might not know about - please use the regular (Desktop) view.
I am using Disqus for commenting, but Blogger is not showing it so your comments may end up not being displayed - tell Google about it!