Apr
30
Google Toolbar has a cool feature that allows you make and install custom toolbar buttons. I created one for PureBlogging.com and actually get a few visitors from Google’s Toolbar Button Gallery every day. So not only can your regular visitors add your button to their toolbar, you may get a few new visitors too.
To make your button, all you have to do is create a simple XML file that contains some basic information about your site. After making your new button, you can use this simple form to add it to the button gallery. Google offers a few samples here and their official instructions can be found here.
First, let’s take a look at a basic template:
<button>
<description>Description of your site.</description>
<site>URL of your site</site>
<update>URL to your XML file</update>
<feed refresh-interval="1800" refresh-onclick="true">URL to your feed.</feed>
<icon mode="base64" type="image/x-icon">base 64 version of your favicon - not required but it looks nice if you use one.</icon>
</button>
</custombuttons>
What you need to do is copy the above XML code into your favorite text editor and replace the values inside the elements. The elements are:
- title - Enter the name of your site or button between the
tags. - description - Enter the description of your site or button between the
<description></description>andtags. - site - Enter the URL of your site between the
<site></site>andtags. - update - Enter the location of the XML file on your site between the
<update></update>andtags. - feed - Enter the URL to your rss feed between the
<feed refresh-interval="1800" refresh-onclick="true"></feed>andtags. - icon - Enter the base 64 version of your favicon between the
<icon mode="base64" type="image/x-icon"></icon>andtags.
If you don’t have a favicon, you can easily create one using your logo or any other picture with this tool. After you have created your favicon you will need to convert it to base 64 by using this tool. You then place that code between the <icon></icon> and tags in your toolbar button XML code.
You should now save your XML code with a .xml extension.
And that’s it! You should now have a functioning Google toolbar button. Here is what my XML code looks like:
<button>
<site>http://www.pureblogging.com/</site>
<description>Blog tips, news, and tutorials to help you make money online with your blog.</description>
<site>http://www.pureblogging.com/</site>
<update>http://www.pureblogging.com/pureblogging_button.xml</update>
<feed refresh-interval="3600">http://feeds.feedburner.com/pureblogging</feed>
<icon mode="base64" type="image/x-icon">
AAABAAEAEBAAAAEAGABoAwAAFgAAACgAAAAQAAAAIAAAAAEAGAAAAAAAAAAAAEgAAABIAAAAAAAA
AAAAAADXdTjXdTjXdTjXdTjXdTjXdTjXdTjXdTjXdTjXdTjXdTjXdTjXdTjXdTjXdTjXdTjXdT7X
dT7XdT7XdT7WdUTWdUTWdUTWdUTWdUTWdUTWdUTWdUTWdUTWdUTWdUTXdT7WdUTWdUTWdUTWdUTW
dUTWdUTWdUTWdUTWdUTWdUTWdUTWdUTWdUTWdUTWdUTWdUbWdUbWdUjWdUbWdUbWdkbw2dHhoojW
dUTWdUjWdUbWdUjWdUbWdUjWdUbWdUbWdUbWdULWdUbWdULWdUjWdUbrwrD////y4tzhn3/YglbW
dUbWdULWdUbWdULWdUjWdUTWdUbWdUjWdUbbh2DrxLL67+3////////////////37u7qw7Lbh1/W
dUbWdUbWdUTWdULWdUbipon8+fn////////////////////////////////8+fjipYnWdUbWdUbW
dUbcj23+/Pv////////////////////////////////////////+/Pvcj2zWdUbWdUTnuqX/////
///////////////////////////////////////////qvqzWdUTWdUblsp3/////////////////
///////////////////////////////ntJ7WdUjWdUTYf1f57er/////////////////////////
///////////////57OrYf1bWdULWdUTWdUbbh2D13dT////////////////////////////////0
3NTbhmHWdUTWdUbWdUbWdUbWdUjWdUbflnftwbD03dP57Of57Of03dXtwbDflnbWdUbWdUbWdUjW
dUTWdUbWdUTWdUTWdUbWdUTWdUbWdUjWdUbWdUjWdUjWdUbWdUbWdUbWdUTWdUbWdUTXdUDWdUDW
dULWdUDWdULWdUDWdULWdUDWdULWdULWdULWdUDWdULWdULWdUDXdT7XdTjXdTjXdTjXdTjXdTjX
dTjXdTjXdTjXdTjXdTjXdTjXdTjXdTjXdTjXdTjXdTgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
</icon>
</button>
</custombuttons>
After you have created your XML file you need to upload it to your server. I recommend saving it to your domain root so the button address would be something like:
http://www.domain.com/your_button_name.xml
Once the button is in place, try it out. You can use something like this for a link (be sure to enter the URL to your XML file):
<a href="http://toolbar.google.com/buttons/add?url=URL%20TO%20XML%20FILE">My Toolbar Button</a>
That would result in a link like this: PureBlogging.com Toolbar Button
Click on your new link and make sure the Google Toolbar is actually adding your button. If all goes well, go ahead and submit your button to Google with this form.


This is a fantastic tip! Thanks a lot!!
Glad you like it. I still have work on implementing your Browser Web Search Plugin…
It’s just as easy as creating this one, just copy/paste/edit/upload!
(thanks for the link
)
Hi David,
Do you happen to know… if you are signed up for adsense for search, and a user puts your search button on their google toolbar and searches your site with it, do you then receive revenue from their search?
Or is this button more of a way to get your site out there?
Thanks,
JoLynn
Hi JoLynn,
I didn’t cover it in this tutorial but you can add a search function to your button. Unfortunately, as I understand it, you won’t earn any revenue from searches of your site.
Sounds good, thanks David! I still like the idea, so it’s now another one to take care of on my list.
[...] David Culpepper dropped a great tip on Creating Your Own Google Toolbar Button [...]
Adding this to my list too
Now that is cool. Thanks!
[...] Create Your Own Google Toolbar Button | PureBlogging This is a neat little tutorial I plan on checking out this weekend. Creating a Google Toolbar button for the right type of site can probably be a great source of traffic. (tags: Google FirefoxPlugins) [...]
how did I miss this post … been looking for this for a while!
Darin