Make Bookmarks Toolbar in Firefox only Show Favicon

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.


Solution 1:

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

https://addons.mozilla.org/en-US/firefox/addon/4072

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

Solution 2:

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

alt text

Solution 3:

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("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); 

/* set default namespace to XUL */

/* hide the bookmark toolbar icon labels */
toolbarbutton.bookmark-item>.toolbarbutton-text,toolbarbutton.bookmark-item>.toolbarbutton-multiline-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

Note that it 's possible that neither the "chrome" folder or the "userChrome.css" file exists in your profile at the moment, but you can create these if they don't currently exist. More info at MozillaZine: UserChrome.css, thanks to @Andrew for pointing this out in the comments.

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.