This article is a simple step-by-step guide for webmasters who want to create a Google toolbar "push button" with an icon that navigates to a site, displays an RSS feeds of that site in a drop down menu; host the button and make it available on their website. This type of button is a great way to gather all the sites of interest to you in one place in an attractive way.

A custom button is an .XML file (like feeds) and its properties and behavior are defined with a <*custombuttons> element.

The XML file elements we are going to use are following:
title- is the name of the button;
description- acts as a tooltip;
site- defines a link to a website;
icon- 16x16 .ico file which many sites use as their favicon.ico file and it has to be base64 encoded;
feed- adds the ability to open a dropdown menu with RSS feed titles and links.

As an illustrative example, we are going to use www.mygiftgadgets.com website, because this site has feeds and an icon.

The following basic XML produces a button that, when clicked, opens www.mygiftgadgets.com in the current browser window, has a title and displays a tooltip:

<*?xml version="1.0" encoding="utf-8"?>
<*custombuttons xmlns="http://toolbar.google.com/custombuttons/*">
<*button>
<*site>http://www.mygiftgadgets.com<*/site>
<*title>MyGiftGadgets.com<*/title>
<*description>Shopping for Gifts and Gadgets<*/description>
<*/button>
<*/custombuttons>

Now that we have the main button elements in place we need an icon. You can draw a small picture using any picture editing program you may have and save the picture file to your desktop, so that you would find it easily. As mentioned before the size of the icon needs to be 16x16 pixels. The easiest way to accomplish this would be by first, generating a favicon.ico from the picture (which you can do here: www.chami.com/html-kit/services/favicon) and saving the file to your desktop. Second, encode the favicon.ico file into ASCII text using base64 encoding (www.motobit.com/util/base64-decoder-encoder.asp), which in the end produces a base64 string - a long line of letters and numbers. As you can see creating an icon doesn't require any program installations to your computer!

The base64 string (your icon) has to be placed between the <*icon> and <*/icon> elements as shown in the final XML file example.

MyGiftGadgets.com site also has feeds that can be shown in the dropdown menu of the custom button. In the XML file the feeds URL will be displayed between the <*feed> and <*/feed> elements like this:

<*feed refresh-interval="3600" refresh-menuitem="false">

http://www.mygiftgadgets.com/wordpress/wp-rss.php<*/feed>

where the feed elements are:

refresh-interval - number of seconds to wait before reloading the feed, the default is 3600 (1 hour);
refresh-menuitem="false" - hides the refresh menu item any time a successful connection is made to the server.

Adding the icon and feed elements to our basic XML structure will complete the button file and the final XML file of MyGiftGadgets.com custom can be seen here: www.mygiftgadgets.com/mggbutton.xml

Now we are going to save the text file as mggbutton.txt and upload it to our website hosting root directory, then change the file name into mggbutton.XML and we