8
6
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.
Vandelizer
Posted 2009-09-10T13:28:39.123
Reputation: 613
4
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.
user10685
Posted 2009-09-10T13:28:39.123
Reputation: 56
Been using it for ages - it's solid. Also see http://forums.mozillazine.org/viewtopic.php?t=202845 to add favicons to folders
– CAD bloke – 2010-05-30T23:23:06.260This has been made obsolete. Its replacement, Roomy Bookmarks Toolbar, is also obsolete now, as of Firefox 57 (and it continuously crashes my Firefox 56). I've searched for other Add-ons to replace it and could find none. See GAThrawn's answer and my comment, it's the only good solution we have for now. – Andrew – 2017-10-08T03:26:58.570
Just installed it. Looks pretty good. Will give it a day of use. – Vandelizer – 2009-09-10T14:07:46.940
8
You can fairly simply just delete the text from the bookmark, which leaves it with only the Favicon.
The How-To Geek
Posted 2009-09-10T13:28:39.123
Reputation: 5 482
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 – 2010-04-22T10:47:39.860
Bad solution, actually. What if you have loads of bookmarks? What if you have duplicate bookmark icons? What if you want the tooltips to still show the text? – Andrew – 2017-10-08T03:25:21.780
2This is how I do it as well. Easy to do and doesn't necessitate yet another add-on :-) – Chris_K – 2009-09-10T14:31:45.460
a good solution, I think I like the ability to have name on roll-over for the add-on. – Vandelizer – 2009-09-11T10:48:19.050
4
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.
GAThrawn
Posted 2009-09-10T13:28:39.123
Reputation: 4 176
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 – 2016-02-01T11:43:38.300
1
Great, it still works in Firefox 56! Note however that "This file does not exist in a new profile. You can create it manually." (http://kb.mozillazine.org/index.php?title=UserChrome.css) I created a /chrome/ folder and a /chrome/userChrome.css file manually, copy pasted the code above into it, and restarted Firefox, and it works beautifully. Thank you very much!
– Andrew – 2017-10-08T03:28:23.400I've updated this for Firefox 60 and Windows 10... I was finally able to discover that this solution was what was causing other labels within Firefox to go away... I was also able to discover, thanks to this link: https://github.com/Aris-t2/CustomCSSforFx that via. the FF WebDeveloper settings, the bookmarks were child elements specifically under the <toolbarbutton class="bookmark-item"> element, and thus I was able to single them out in order to let the other Firefox labels continue to show up...
(The two options I enabled in the FF WebDeveloper settings were: Enable browser chrome and add-on debugging toolboxes and Enable remote debugging - and then I had to grant it permission after opening up the "Browser Console", which allowed me to actually **view Firefox HTML + CSS within Firefox** (get that!)! With this knowledge, one could manually modify the CSS of practically anything in FF...) – Andrew – 2018-06-09T08:48:41.717
1"Browser Toolbox"* - hopefully there won't be a poop that rejects my edit this time... but in case there is, I changed the CSS selector to toolbarbutton.bookmark-item>.toolbarbutton-text,toolbarbutton.bookmark-item>.toolbarbutton-multiline-text... Thanks for throwing out my edit. – Andrew – 2018-06-25T13:51:05.190
1@Andrew I don't know why the other editors chose to reject your edit, but it looks good to me, and I've approved it. – GAThrawn – 2018-07-10T13:34:00.920
Update (again...): Thanks to the info I found here: https://www.userchrome.org/how-create-userchrome-css.html "To make startup faster for most users, Firefox 69 will no longer look for this file automatically. You need to tell it to look. Here's how: ..." Basically about:config then search "userprof" then set toolkit.legacyUserProfileCustomizations.stylesheets to true... "That change should take effect on your next startup."
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... – None – 2013-08-06T20:53:29.570
See GAThrawn's answer and my comment. – Andrew – 2017-10-08T03:25:41.200
How can you replace bookmark names with their favicons in Chrome? I didn't even know it was possible. – alex – 2009-09-10T13:32:15.623
I am not exactly sure, my friend has it on his Chrome. I don't use chrome because I use OS X. – Vandelizer – 2009-09-10T13:58:03.133