How to Replace a Missing Button Icon In Google Toolbar

by Brad Isaac on March 18, 2008

Images and icons make things easier to find. If you can find your tools easier, then you are more efficient. More efficiency means more money. And more money means…

You get the picture.

If you’ve downloaded a new toolbar button for google and found that it was missing the icon, here’s a lickity-split way to get it back. Or you can use it to “hack” a new unrelated icon onto it if you prefer.

Did I mention that it’s fast?

You downloaded a new toolbar button

For instance, I downloaded The Google Docs and Spreadsheet button. But for some darn reason the icon didn’t show up right.

See the missing icon?

Look at that nonsense – no that will not do.

So here’s 8 quick steps to hack your Google Toolbar icons so they show up properly…

Step 1: Add the button anyway…

Click the Add button to add it. You’ll see it in your toolbar, but still missing an icon. But here’s the trick that will bring back the icon.

Step 2: Click the new button or go to the page it references

In my case, I went to docs.google.com which is my button’s original address. Notice the icon in the address bar

Step 3: Right Click in the Search bar and choose Generate Custom Search

Step 4: Choose the Add button like you did before

After you hit “Add” You’ll see your new button icon on the toolbar. But you aren’t done yet.

Step 5: Go to Google toolbar options

Then choose the buttons tab.

Step 6: Choose to Edit the button with the icon

1. Highlight the button that has the icon you want.
2. Click the edit button
3. Click the Use advanced editor link
4. A new window will pop up with a bunch of code you may or may not understand. Don’t worry!

Step 7: Simply Copy the Code between the fields

In the text window, just copy everything between the two fields – including the statements to your clipboard. You’d copy everything in yellow in the picture above.

Hit cancel once you are done. All you want to do is copy, then you are done with the button.

Open the button with the missing icon in the same way you did in step 6

Step 8: Paste the code right before the code in your toolbar button

Simply right click and paste the code right before the field of your toolbar button.

Hit Save to Google Toolbar.

Now you’ve got a brand-spanking-new icon for your button!

Set powerful goals online with our new online goal management tool

{ 3 comments }

March 20, 2008 at 4:45 pm

OMG.

That sound was my brain exploding.

Plug and play, baby, plug and play!

I keep waiting for coding to be like stacking blocks. :)

Geir October 31, 2009 at 5:51 pm

Hi Brian
I tried your method with
Google toolbar Version: 6.2. and it does not work with this version. But I found a partial solution to this problem on Google toolbar help forum:
The link is:
http://www.google.com/support/forum/p/Toolbar/thread?tid=63cc8f5e76d2533e&hl=en&fid=63cc8f5e76d2533e00047741e8001952

Hope it will help you as well
Best regards
Geir

Geir October 31, 2009 at 6:38 pm

Hi Brian again !
The reason for that I thought that your method didn’t work was I didn’t find advanced editing. The reason was that I was using Internet Explorer but not Firefox. My mistake !!

Best regards
Geir

Previous post:

Next post: