Super User is a question and answer site for computer enthusiasts and power users. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

In chrome you can replace the names of bookmarks in the toolbar with their favicon. Is it possible to do the same thing in Firefox? I want all my bookmarks to just display the favicon in order to save space.

share|improve this question
How can you replace bookmark names with their favicons in Chrome? I didn't even know it was possible. – alex Sep 10 '09 at 13:32
I am not exactly sure, my friend has it on his Chrome. I don't use chrome because I use OS X. – Vandelizer Sep 10 '09 at 13:58
Ok, thanks for the information. – alex Sep 10 '09 at 14:18
up vote 3 down vote accepted

There is an add-on that does this, "Smart Bookmarks Bar":

You can set it to never show the name or to show it on mouse-over.

share|improve this answer
Just installed it. Looks pretty good. Will give it a day of use. – Vandelizer Sep 10 '09 at 14:07
Been using it for ages - it's solid. Also see to add favicons to folders – CAD bloke May 30 '10 at 23:23

You can fairly simply just delete the text from the bookmark, which leaves it with only the Favicon.

alt text

share|improve this answer
This is how I do it as well. Easy to do and doesn't necessitate yet another add-on :-) – Chris_K Sep 10 '09 at 14:31
a good solution, I think I like the ability to have name on roll-over for the add-on. – Vandelizer Sep 11 '09 at 10:48
This is the only way to do it in Chrome, and because I use Xmarks to keep my bookmarks synchronized between the two browsers, I simply omit a name. – Paul Lammertsma Apr 22 '10 at 10:47

The downside to deleting the descriptions/labels is that you lose some of the usefulness of the bookmark, you can't just type its name into the URL bar and find it any more, your bookmarks become harder to manage if the icons are lost (eg if you move to another machine). You can do this without installing any add-ons or deleting any bookmark descriptions, by just hiding them.

You can create a file called "userChrome.css" in your Firefox profile folder. This file can be used to add CSS rules to customize Firefox's UI, including hiding these labels.

Create a text file in Notepad with the following content:

 * This file can be used to customize the look of Mozilla's user interface
 * You should consider using !important on rules which you want to
 * override default settings.

 * Do not remove the @namespace line -- it's required for correct functioning
@namespace url(""); 

/* set default namespace to XUL */

/* hide the bookmark toolbar icon labels */
.toolbarbutton-text {
  display: none !important;

Save this file as "userChrome.css" and save it into the Chrome folder within your Firefox profile folder. This will be in one of the following locations on a normal Windows box, or in the equivalent on Mac/Linux:

Win XP: C:\Documents and Settings\*[YourLogin]\Application Data\Mozilla\Firefox\Profiles\*[randomtext].default\chrome

On Vista: C:\Users\*[YourLogin]\AppData\Roaming\Mozilla\Firefox\Profiles\*[randomtext].default\chrome

Once you've saved that restart Firefox and you should find that you have a label-less bookmark toolbar.

If you want examples of other things you can set with this file, open the userChrome-example.css file that you should see in the Chrome folder.

share|improve this answer
It would be nice if the code did not affect bookmarks on the PrefBar. I have a couple of bookmarklets on the Prefbar (to change font size and use to mono), and when I use the code their labels disappear. And of course you cannot, as far as I know, add a favicon to them... – user243786 Aug 6 '13 at 20:53
Using this approach adds an empty space next to the icon. This space makes sense if there is a label (otherwise the text would be too close to the icon), but if the text is hidden, the space just wastes space. Is there a way to remove that extra space other than removing the label? Or is there a way to identify the element in CSS other than by its label? Something like .bookmark-item[tag="_THETAG_"] instead of .bookmark-item[label="_THELABEL_"]? – scenia Feb 1 at 11:43

You must log in to answer this question.

protected by nhinkle Aug 6 '13 at 21:44

Thank you for your interest in this question. Because it has attracted low-quality or spam answers that had to be removed, posting an answer now requires 10 reputation on this site (the association bonus does not count).

Would you like to answer one of these unanswered questions instead?

Not the answer you're looking for? Browse other questions tagged .