A Quick Way to Create a Google Toolbar Button

Sat, May 19, 2007

Blogging, Tips

screenshot 19 05 2007 13 20 10 A Quick Way to Create a Google Toolbar Button

Inspired by Wendy Piersall’s post “What’s on Your To Do List? Let Pool our Resources” I’ve spent the most of the morning figuring out how to create one.

I’ve decided to create two tutorials – One for the technical-minded and one for the lazy man/woman.

Let’s start with the one for the lazy man/woman:

And now for something completely different – The technical guide:

There’s not really even any coding involved, just a simple XML file and a link! (Hopefully this didn’t disappoint any technical minded)

You will need to compose an XML document. Google will use this to create the button. It’s nothing fancy – really!

To start out we can use my existing XML file: (you can also download it Use Right-Click and Save as)

<?xml version=”1.0″ encoding=”utf-8″?>
<custombuttons xmlns=”http://toolbar.google.com/custombuttons/”>
<button>
<title>Petersen Inc.</title>
<description>The Official Petersen Inc. Google Toolbar Button</description>
<site>http://www.thebetanews.com</site>
<search>http://www.google.com/search?q=site:www.thebetanews.com+{query}</search>
<feed refresh-interval=”3600″>http://www.thebetanews.com/feed</feed>
<icon mode=”base64″ type=”image/x-icon”>AAABAAIAEBAAAAAAAABoBQAAJgAAACAgAAAAAAAAqAgAAI4FAAAoAAAAEAAAACAAAAABAAgAAAAA
AEABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAP///wC7jUYAQkZLAN3GowCgXgAAgYCAAObf1QDGqXsA
mJueAMjHxQCwkWIA6uvtANS3iwDm07UAxqBlAK6BOwDZ0cUA+fXvALqgeADWyrgAx7CLANm/lwDT
sn4Ay6dwAPDk0QD19/kA3tfMAODOsgC2lF4A18CeAPPx7gD7+vcAwJFHAN7EnQDEnWAA9PT0APv8
/QDr6ugAxq2HAPn5+wDj0LQA/fz6APv49ADex6UA+/v7APf4+QD+/v4A/P3+AP7//wD///4A/Pz9
ANS3igAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAABAQEBAQEBAQEBAQEBAQEAAQEBAQEBAQEBAQEBAQEBAAEBAQEB
AQEBAQEBAQEBAQABAQEBAQEBAQEBAQEBAQEAAQEBAQEBAQEBAQEBAQEBAAEBAQEBAQEBASgMLgEB
AQABAQEBAQEBAQEbCxElAQEAAQEvKyogMi0aFQUdMAEBAAEsDwIjIRMDBiIXECYBAQABNA0EKQ4U
CQoWGQgfAQEAAQEBAQEBAQEBHBgnJAEBAAEBAQEBAQEBARIeBwEBAQABAQEBAQEBAQEBMzEBAQEA
AQEBAQEBAQEBAQEBAQEBAAEBAQEBAQEBAQEBAQEBAQAAAAAAAAAAAAAAAAAAAACAAAAAgAAAAIAA
AACAAAAAgAAAAIAAAACAAAAAgAAAAIAAAACAAAAAgAAAAIAAAACAAAAAgAAAAIAAAAD//wAAKAAA
ACAAAABAAAAAAQAIAAAAAACABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAD///8AuIc9AMe6pwBcYGYA
nlwAACwsLQDa2toAgYSHAM6qcgCdnZ0ArnIbAOTStgCsjl8AsZ1+APTu5ADCw8QAGxsbANW5jQDD
m10Ap3gxAOveygCqqqoAd3h5AN7IpQCngEYAwJJLAM3OzwDj5eYA0MWzAPT19QC3gS0As5huANGx
gADr5NgA3MGYAP/67gDi1sMAp2wRAOvs7gCibh4Aq4dQAK55JwC+nWgA28uyAPfr2QC6klUAyqt8
AMegZgDb19EA/PPlAMfCvAAnJycA1sCfAN7RvQC+vr4A+vr6ALB+MQC1gzYA4syrAN/f3gC9jkUA
8fDuAMrKygDm1bwAwZhXANbW1gDx6NoA28mrAOjZwwCocBoA6eflAL+UUgDXvJIA8+vfAKt2IwDv
5dQA7eHOAOLPsgC1oIAA07aJAMyugAC5ikEAuppnANrCnQD39/gAqKenALJ9LQC8kEoAzq58AO7v
8QAqKioA/P39APLy8wCweyoAdnh9AKtvGACzgDIAtoU5ANjKtAD169wA7ubaAObZxgDRs4MA0reN
AOrbxQDg3tsA4c6vAMTBvQC7m2oAxKBnAM7Q0QDMqXQAoF4AAOjo5wDw59gAtII0ALeGOwDPr34A
/v38APf29gDY19YA693IAN7JpwCrqqgA/v7+APv7+wD7+/kA9e/lAPLp2wD9/P0A+/z9APb29QCy
fi4A8/PzALSBMwC3hzwA29rZAMzNzwDk07cA49CyAOLOsAD///4A/f7+AP39/QD09fYAtYU5ALyQ
SwDr3skA5tW7AOPPsgDMqXMA0bF/AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQEBAQEBAQEBAQEBAQEBAQEBAQEB
AQEBAQEBAQEBAQABAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAAEBAQEBAQEBAQEBAQEB
AQEBAQEBAQEBAQEBAQEBAQEAAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQABAQEBAQEB
AQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAAEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEA
AQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQABAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEB
AQEBAQEBAAEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEAAQEBAQEBAQEBAQEBAQEBAQEB
AQEBAQEBAQEBAQEBAQABAQEBAQEBAQEBAQEBAQEBAQEBAQFVkAEBAQEBAQEBAAEBAQEBAQEBAQEB
AQEBAQEBAQEeXDxdkQEBAQEBAQEAAQEBAQEBAQEBAQEBAQEBAQEBAUcbY4lqAQEBAQEBAQABAQEB
AQEBAQEBAQEBAQEBAQEBJA4gT2YBfQEBAQEBAAEBAQEBAQEBAQEBAQEBAQEBAQcQkkZLM29+AQEB
AQEAAQEBAQEBAQEBAQEBAQEBAQEBZQ05cSYZNgEBAQEBAQABAQF6AZVOGI2UiwyMLRwWN1YBCZiH
BSp/AQEBAQEBAAEBjhNpdTB0VxJiXj1ZCAZbF3ltO0BgFHwnAQEBAQEAAQEBSAI6UmKFYUGIHykE
ETRfNRqWgHsLK1oBAQEBAQABAQFYk0×2a0N6TIEVMooKQj8BaEl3ZFOGAQEBAQEBAAEBAU1KAXcB
AQEBAQEBcjgBAYQvIXMjKGwBAQEBAQEAAQEBAQEBAQEBAQEBAQEBAQEBIlRnl25RA4MBAQEBAQAB
AQEBAQEBAQEBAQEBAQEBAQEBAVBwLjEBfQEBAQEBAAEBAQEBAQEBAQEBAQEBAQEBAQEPRUQsHQEB
AQEBAQEAAQEBAQEBAQEBAQEBAQEBAQEBAYIBJXg+AQEBAQEBAQABAQEBAQEBAQEBAQEBAQEBAQEB
AQE4jwEBAQEBAQEBAAEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEAAQEBAQEBAQEBAQEB
AQEBAQEBAQEBAQEBAQEBAQEBAQABAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAAEBAQEB
AQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEAAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEB
AQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAgAAAAIAAAACAAAAAgAAAAIAAAACAAAAA
gAAAAIAAAACAAAAAgAAAAIAAAACAAAAAgAAAAIAAAACAAAAAgAAAAIAAAACAAAAAgAAAAIAAAACA
AAAAgAAAAIAAAACAAAAAgAAAAIAAAACAAAAAgAAAAIAAAACAAAAAgAAAAP////8=</icon>
<update>http://www.thebetanews.com/betanews.xml</update>
</button>
</custombuttons>
Most of this is the base64 encoded icon – we’ll get to that in a minute. What you need to do is copy the above XML then begin replacing the values inside the elements. The elements are:

  • site – The location the browser will be directed to if someone clicks your button
  • title – The name of your button
  • description – Keep it short, this will appear when your mouse hovers over the button on the toolbar
  • update – the location of the XML file
  • icon – base64 encoded representation of your button’s icon
  • feed – an RSS or Atom feed added to your button (required if you want to submit your button to the Google Button Gallery) You can add more than one too!

You don’t need all of them. The main ones are in red above. Just replace the values between these tags in the XML with your own. To base64 encode an image for your button, determine or create your image. (I used Green Marines favicon.ico since it will be made 16 x 16 pixels anyway). Then use this page to encode your image. Copy the result into the image element of your XML document.

If you have an RSS or Atom feed, insert the URL of your feed into the feed element. Save your document with an .xml extension (we used updated_button.xml). Copy the XML file to the root of your website directory. It’s ready to go!

Now, just add the below link to your site, where ever you choose and when people click it, they will get your button added onto their Google toolbar:

http://toolbar.google.com/buttons/add?url=http://www.<my domain>.com/filename.xml

Replace the url= with the fully qualified public url to your xml file. For instance: http://toolbar.google.com/buttons/add?url=http://www.thebetanews.com/petersen-inc.xml

If someone clicks the link and doesn’t already have the correct version of Google Toolbar installed, they will be prompted to install the correct toolbar.

That’s it! For more detailed instructions go here: http://www.google.com/tools/toolbar/buttons/apis/howto_guide.html

And remember to add my Google Toolbar Button

If you enjoyed this post, make sure you subscribe to my RSS feed!

Post to Twitter

This post was written by:

Dennis Bjørn Petersen - who has written 398 posts on The Beta News.


Contact the author

  • Thanks for including both versions. Of course, I'll dig into #1, but good thinking including both.
  • Don
    Thank you very much Vinod. I really appreciate it.
  • Awesome. Thank you very much for this idea.
blog comments powered by Disqus

Twitter links powered by Tweet This v1.6.1, a WordPress plugin for Twitter.