X
Tap here to go to the mobile version of the site.

Support Forum

Change, Add Custom Icons on Toolbar

Posted

Although other (already closed) threads indicate that customizing bookmark icons is not possible, especially with versions above 22, it is possible, but not at all obvious.

Even though I have done it, I am not clear on the entire process, specifically the "icon data" part of the following... but, it does work and the following example was tested on version 28 of "Nightly"

The icon references can be included in a simple html file and imported into bookmarks.

The following is a sample of one for a mailto: =

<A HREF="mailto:" ADD_DATE="989110022" LAST_MODIFIED="1317596951" ICON_URI="file:///C|/Users/Beverly/Download/Tran/Tran/blue.ico" ICON="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGElEQVQ4jWNgYPj/nzI8asCoAaMGDBMDADKm/hBZaHKGAAAAAElFTkSuQmCC" LAST_CHARSET="ISO-8859-1">MI</A>

=

The above is the only thing in the imported html file... no headers, etc are necessary.

I _think_ the above "icon=data..." can be used with any icon file and it will regenerate after import... it's been too long since I sorted this out the first time. The above icon file is a 32x32 solid blue square.

Assuming you have bookmarks that have icons, you can export your bookmarks to an html file, then open that file with a text editor to either copy examples or edit them to add your own local icon file references.

Hope that this information is of value.

Beverly Howard

Although other (already closed) threads indicate that customizing bookmark icons is not possible, especially with versions above 22, it is possible, but not at all obvious. Even though I have done it, I am not clear on the entire process, specifically the "icon data" part of the following... but, it does work and the following example was tested on version 28 of "Nightly" The icon references can be included in a simple html file and imported into bookmarks. The following is a sample of one for a mailto: = <A HREF="mailto:" ADD_DATE="989110022" LAST_MODIFIED="1317596951" ICON_URI="file:///C|/Users/Beverly/Download/Tran/Tran/blue.ico" ICON="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGElEQVQ4jWNgYPj/nzI8asCoAaMGDBMDADKm/hBZaHKGAAAAAElFTkSuQmCC" LAST_CHARSET="ISO-8859-1">MI</A> = The above is the only thing in the imported html file... no headers, etc are necessary. I _think_ the above "icon=data..." can be used with any icon file and it will regenerate after import... it's been too long since I sorted this out the first time. The above icon file is a 32x32 solid blue square. Assuming you have bookmarks that have icons, you can export your bookmarks to an html file, then open that file with a text editor to either copy examples or edit them to add your own local icon file references. Hope that this information is of value. Beverly Howard

Additional System Details

Installed Plug-ins

  • Shockwave Flash 11.9 r900
  • Google Update
  • Next Generation Java Plug-in 10.45.2 for Mozilla browsers
  • NPRuntime Script Plug-in Library for Java(TM) Deploy
  • IE Tab 2 Plug-in for Mozilla/Firefox
  • 5.1.20913.0
  • Foxit Reader Plug-In For Firefox and Netscape
  • Picasa plugin
  • NPWLPG

Application

  • User Agent: Mozilla/5.0 (Windows NT 6.2; WOW64; rv:28.0) Gecko/20100101 Firefox/28.0

More Information

guigs 1072 solutions 11697 answers

Hi bevhoward,

Thank you for sharing this information. Actually the Mozilla Developer Network loves hearing about hacks like this and I think this would be a great mini article that could be added through their feedback channel: https://developer.mozilla.org/en-US/d.../Project:Feedback

I think the document that you may be referring to is the Custom Toolbar Button

If you sign up and navigate to this page it is possible to tag it with update information. If you have any questions please feel free to ask, the irc channel is pretty awesome as well.

Hope this helps!

Hi bevhoward, Thank you for sharing this information. Actually the Mozilla Developer Network loves hearing about hacks like this and I think this would be a great mini article that could be added through their feedback channel: [https://developer.mozilla.org/en-US/docs/Project:Feedback] I think the document that you may be referring to is the [https://developer.mozilla.org/en-US/docs/XUL/Toolbars/Custom_toolbar_button Custom Toolbar Button] If you sign up and navigate to this page it is possible to tag it with update information. If you have any questions please feel free to ask, the irc channel is pretty awesome as well. Hope this helps!
cor-el
  • Top 10 Contributor
  • Moderator
17525 solutions 158458 answers

I'm not sure if you keep custom favicons added this way for a real existing web page.

Note that bookmarks exported to an HTML file use this same method to export bookmarks with their favicons.
A JSON backup doesn't include the favicons.

I'm not sure if you keep custom favicons added this way for a real existing web page. Note that bookmarks exported to an HTML file use this same method to export bookmarks with their favicons.<br /> A JSON backup doesn't include the favicons.

Helpful Reply

Thanks for the responses and the link to the tech article link.

The custom toolbar icon instructions are way beyond my (and I assume most users') capabilities, and, it's obvious that icons can be a major help in spotting specific links on the toolbar.

In the case of "local" links such as mailto, bookmarklets and local pages, there should be an _easy_ way to associate to an icon anywhere... on the machine or internet, but there is not. Ideally, there should be a field in bookmark properties that allows any user to enter the address of the icon file they want associated with each link.

Web pages frequently change their icons... that's simply part of the net, but, for those of us "old farts" having the ability to reset the icon to one we can see and recognize is a big chunk of what we call "accessibility"

Thanks again, Beverly Howard

Thanks for the responses and the link to the tech article link. The custom toolbar icon instructions are way beyond my (and I assume most users') capabilities, and, it's obvious that icons can be a major help in spotting specific links on the toolbar. In the case of "local" links such as mailto, bookmarklets and local pages, there should be an _easy_ way to associate to an icon anywhere... on the machine or internet, but there is not. Ideally, there should be a field in bookmark properties that allows any user to enter the address of the icon file they want associated with each link. Web pages frequently change their icons... that's simply part of the net, but, for those of us "old farts" having the ability to reset the icon to one we can see and recognize is a big chunk of what we call "accessibility" Thanks again, Beverly Howard
guigs 1072 solutions 11697 answers

Hi bevhoward,

I did find an add on that might also be useful:

Hi bevhoward, I did find an add on that might also be useful: *Bookmark favicon changer [https://addons.mozilla.org/en-us/firefox/addon/bookmark-favicon-changer/]

Helpful Reply

Thanks for the link.

While that addon stopped working a few versions ago, thanks for posting it again.

The reviews now indicate that is has been updated and it now works in FF version 26

At the time of my last post, the addon information page indicated that it did not work after version 23

NOTE that the version on the MOZILLA SITE STILL DOES NOT WORK!

You must download it from this site!

Thanks, Beverly Howard

Thanks for the link. While that addon stopped working a few versions ago, thanks for posting it again. The reviews now indicate that is has been updated and it now works in FF version 26 At the time of my last post, the addon information page indicated that it did not work after version 23 NOTE that the version on the MOZILLA SITE STILL DOES NOT WORK! You must download it from [https://sites.google.com/site/sonthakit/bookmarkfaviconchanger this site!] Thanks, Beverly Howard

Modified by BevHoward

Question owner

fwiw, another issue arose around this if you "sync" firefox.

If you do, the icon locations will either need to be located in identical local paths on each computer or, you can put them on a personal website and use urls to point to them.

Beverly Howard

fwiw, another issue arose around this if you "sync" firefox. If you do, the icon locations will either need to be located in identical local paths on each computer or, you can put them on a personal website and use urls to point to them. Beverly Howard