Google Buzz – How To Add A Google ‘Buzz This’ Button To Your Blog

Posted : Saturday, February 13, 2010 | Post Author : Paul Crowe | 7 comments

Blogger Tutorial Video PostVideo Post – For Extra Help See The Video Tutorial Below The Post.

The new Google Buzz is the hot way to be social and share links, pictures and pretty much all the things you were already doing on Twitter Or Facebook but from your Google / Gmail account.Google have not yet released a Buzz This gadget like the Tweet This Or Digg This buttons that are so popular on blogs.However the Mashable blog have added their own Buzz This gadget and so can we.

Mashable have not shared the code for their button but just a small bit of work with the image used on Mashable and adding similar code as the Tweet this button means we can put the button on our Blogger blogs.As the Buzz button is new it could be a great way to get people sharing your posts and bring new visitors to your blog.

Google Buzz This Gadget

Preview :

Here is a working preview of the Google Buzz button – Try It Out :

Buzz This

Add the Google Buzz This Button To Your Blog

We will look at three places to add the button .

1. Go To Your Blogs Html – In your dashboard Click ‘Layout’ > ‘Edit Html’ > Tick the ‘Expand Widget templates’ box.

Blogger layout


edit html blogger


Expand widget templates blogger

First this is how to add it to the right of your post title as i have on this blog at the time of writing :

Add Button Beside Post Titles

Step 1. Find the following code in your blogs html
(Click Ctrl and F for a search bar to find the code – Click here for more help with this)

<div class=’post-header-line-1′>

If You Cant Find That Code Look For This Code :

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

Step 2. Add the following code Directly Below/Under <div class=’post-header-line-1′>

<a href=’’><img alt=’Best Blogger Tips’ src=’’/></a><a expr:href='”” + data:post.url + “&title=” + data:post.title + “&srcTitle=” + data:blog.title’ target=’_blank’><div style=’text-align:right;margin-top:-42px;’><img border=’0′ alt=’Buzz This’ src=’’/></div></a>

Click Save And You Button Is Added.

Add the button to the top or bottom of your posts

You can add the button wrapped in text at the top or bottom of your posts.

Step 1. Find this code in your blogs html :


Step 2. Copy the code below :

<div style=’float:left; margin-right:10px;’>
<a expr:href='”” + data:post.url + “&title=” + data:post.title + “&srcTitle=” + data:blog.title’ target=’_blank’><img border=’0′ alt=’Buzz This’ src=’’/></a></div>

Top Of Posts : To place the button at the top of your posts put the code Above/Before <data:post.body/>

Bottom Of Posts : To place the button at the bottom of your posts place the code Below/Under <data:post.body/>



Google Buzz Button – Video Tutorial

More Video Tutorials | Spice Up Your Blog On YouTube


InfoRemember you can get all these tips sent directly to your email and stay a step ahead.Its a quick and easy service Provided for Free by Google.Just fill in the Email form below the post.
If you need extra help on this or any tutorial just leave a comment, I love comments and feedback so this Blog is Do-Follow – when you comment here it helps Your Blogs Google rank !

I’m sure Google will release some buttons and gadgets for Buzz but until they do this button is a great option.

Are you using Google Buzz ?

If your having trouble Extra help is only a comment away.


  1. Thanks. Its working for me !


  2. Thanks a lot for sharing. Yesterday i spent lot of time searching for the code for google buzz button. Thanks a lot again. It’s working great for me.


  3. Thanks Seema and Karthik,

    I hope your blogs are Buzzzzed all over the web !



  4. Wow. I’m so glad I found this site. I’ve followed you on Twitter and will definitely use this on my site. Do they have a WordPress version of this? I bet they do …

    Thanks so much!


  5. Hello Paul. I am getting the buzz picture on the homepage of the post ( that is @ the top of the post) i need to have the buzz when we open the specific post ! Like you have


  6. Hey Karthik,

    You can do this by useing the same technique as showing gadgets on post pages only.

    So add this above the gadget buzz code in your template :

    <b:if cond=’data:blog.pageType == “item”‘>

    And put this code below the gadget :


    Should do the trick,



  7. Hi got it. Thank you Paul.