Custom Google Toolbar Buttons

Today saw me giving custom google toolbar buttons a stab, in this case I figured I’d write a button to go to and search Google Docs & Spreadsheets.

The API documentation is available here. [http://www.google.com/tools/toolbar/buttons/apis/howto_guide.html]

There’s nothing particularly taxing about it, the XML for my button can be seen below, the only difficult bit was getting the base64 encoding of my image. I didn’t see it in the documentation, but the type attribute of the <icon> element can be any valid mime-type, here I’ve chosen image/gif, but you could use jpg, icon, png etc.The <search> element allows you to create a custom search tool, if you select some text in your browser and right click, your button appears in the “More Search Types…” context menu.

<?xml version=”1.0″?>
<custombuttons xmlns=”http://toolbar.google.com/custombuttons/“>

<button>
    <site>http://docs.google.com/</site>

    <title>Docs and Spreadsheets</title>
    <description>Google Docs and Spreadsheets</description>

    <search>http://docs.google.com/?searchString={query}&action=search&searchTag=</search>

    <icon mode=”base64″ type=”image/gif”>
R0lGODlhEAAQAPfAAP7+/tjc4Hac//v7++7v8K2vsurv89vf4+Hi5cjP5tre4vj4+MXI0cXJ04CZ
/4Kb/9vh5tzo9fr7/eXn6vj6/Nng5/7//9XY3LK2wMrN7Nng883Q1uPl5/39/a25++Pj5KK1+tbX
2M/T3dje5JOm9OPk5LKz8szM9oqZ/93l673BzM7N8kdx2u72/ujt84+S/6m09s/T14Sc47G2/XKe
/8PH88K++MLB9+vx9Zyw9GmJ5Ly9v9PX3FuB8dHU2K+v8PPz9M/R2e/v74Sd/1Zuubi4+EBmzais
9KWz8qyv99zc3b++/2uR/+30+/z8/Yqg/+fp+LG51tDU48jO34Wb7P3+/uTv+ZOp/9jZ/7fD493i
5bbA37jA1tLX8H2FnaCx4au65ENeq8nMz9fc4ay2/OHj5Nbc4u3t7nuNydne5ebm6Lu58qy3/dba
3nSX7bS4/665/9rg8Ft72t/s+FV42FNkk7G194iUt09x1unu8ufr7cbF/9/o8nWZ/8/Q0laJ9/T0
9Ku08NXc5MHM5MzQ4OPt+OHj/nh+ltLY4Orq6qav2WKO893i6fj5+peb9r3K4rXB6cbG78XIzLa2
utzi5d3p9KrB/+zt7tfZ7niY7PDw8ejp6YaW//n5+ZOg9ICj/6Wv/8LE2rW5/MPM6luI7YWJmLO5
673I3dDO86+86KCt+Pr6+7G1/FNlm6u2/M3R1MPK20564tvk7eDo7/v+/8vP0/z8/Obo7t7l6urv
8unz/t/k6MfKz+z2/4ad+I2c9f///wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEAAMAALAAAAAAQABAA
AAj1AIEJHAgMwACCCBFeQiAQgCYCCQtOiFBJzRlGcwStEihBAywGAazokpWiQq9CfMoIlBGoBoQW
TUakwaVljJlZlDpN8bBiFw4XbRRICpDrAq8YBkpgIBMqz4FaPl4l2JLl0alBiDiouPKLUAAxIiCN
6oIJSpUoG/Q0+NRHxxcwqTKginQCiyEufigEofEHiY0ba0z8KLJkjyketCzEWURK1AtHSY6wejPD
jiInjQjcipUJFCcUntjAcQVDlZQPmwAJYZHjiYMHQ0iA8EUFTQhbAoHQsSRAAJMeeIi08jKJ4AI5
boyEqXOogJKDCDvcKbUjUUSCAQEAOw==
    </icon>
</button>

</custombuttons>