Recommended Posts

I like how you can have folders for your bookmarks.. but what I dislike is they are all the same! boring looking folders..

well its time to change that and make your firefox folders look like this:

1423452296_20354cf6b2_o.png

go to:

C:\Documents and Settings\*your username*\Application Data\Mozilla\Firefox\Profiles\*profile name*\chrome

and create A: userChrome.css

enter the following:

[i].bookmark-item[container="true"][label="[b]NAME OF FOLDER[/b]"] {
  list-style-image: url('file:///*[b]LOCATION OF ICON[/b]*) !important;
  -moz-image-region: rect(0px 16px 16px 0px) !important;
}[/i]

here is an example:

.bookmark-item[container=true][label=Dailys] {

list-style-image: url('file:///C:/Documents/Tools/FFI/home.png') !important;

-moz-image-region: rect(0px 16px 16px 0px) !important;

}

.bookmark-item[container=true][label=Favorites] {

list-style-image: url('file:///C:/Documents/Tools/FFI/favorits.png') !important;

-moz-image-region: rect(0px 16px 16px 0px) !important;

}

This will show my first 2 folders: Dailys and Favorites.. remember to repeat the code to change the icons of the folders.. its a quite easy and simple trick that I thought I might share :)

Link to comment
https://www.neowin.net/forum/topic/589368-change-firefox-bookmark-folder-icons/
Share on other sites

I'd put the images in the same folder as the userchrome.css file, saves having to fix it up if the folder ever gets moved (and in case you're using portable firefox, keeps working over computers)

Could also use a data: URI.

Anyway, nice and simple (Y)

Ya this looks pretty nice. However if there is an update to firefox, does this get wiped?

It shouldn't do since it is stored in the userChrome.css, which doesn't get touched by updates form what I know.

Nice one though, I will have to try it out when I have some time and have found a nice icon to use.

  • 1 month later...

Dear Jase, sorry but that does NOT seem to work at all! :o

First of all, you failed to mention that in order to create a proper userChrome.CSS, you need to keep the @namespace url line! Second, I've tried several times your nice code programing to no avail. Here is a full copy of the css file I created:

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* set default namespace to XUL */

.bookmark-item[container=true][label=XXX | News] {

list-style-image: url('file:///C:\Documents and Settings\XXXX\My documents\drap-it.02.png) !important;

-moz-image-region: rect(0px 16px 16px 0px) !important;

}

This is a cut and paste of the css, so what's wrong? Whenever I open Firefox 2.0, I have my bookmarks folders neatly stacked on the left, and the one I desperately try to change the icon of is style in the same boring, standard style despite the userChrome.css coded as stated above. Help! And thanks for anyone able to figure out what I did wrong! ;)

Edited by JackTorrance
  • 4 months later...
  • 2 weeks later...
  • 2 weeks later...
  • 3 months later...

Thank you, Jase. I have been looking for this folder modifcation for a long time, and FINALLY found it here. It worked perfectly for me, just as you described. And as I am one of those people who nests bookmark folders several layers deep, I am loving Firefox much more now. Thanks again!

:)

-Rene Flores

Austin, TX

  • 4 weeks later...
Thank you, Jase. I have been looking for this folder modifcation for a long time, and FINALLY found it here. It worked perfectly for me, just as you described. And as I am one of those people who nests bookmark folders several layers deep, I am loving Firefox much more now. Thanks again!

:)

-Rene Flores

Austin, TX

you're welcome!

  • 5 months later...

Thanks Jase,

First I tried everything to change my folder icons.

I was using just one code,example:

.bookmark-item[container=true][label=dev] {

list-style-image: url('file:///C:/1.ico') !important;

-moz-image-region: rect(0px 16px 16px 0px) !important;

}

Then I thought may be writing "at least 2 codes" is the secret of changing folder icons...(Because Jase wrote 2 codes)

After that I wrote code for 2 folder icon.

.bookmark-item[container=true][label=dev] {

list-style-image: url('file:///C:/1.ico') !important;

-moz-image-region: rect(0px 16px 16px 0px) !important;

}

.bookmark-item[container=true][label=resim] {

list-style-image: url('file:///C:/2.ico') !important;

-moz-image-region: rect(0px 16px 16px 0px) !important;

}

Finally the problem solved :D.Don't know was that luck or right decision.

Try to write code for 2 or more folder icon.

If anyone solves their problem by my method please write it here.Because I want to know if it is right or wrong.

Thanks again Jase :)

This topic is now closed to further replies.
  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Posts

    • eh I'll wait for the June 2026 MVS ISO downloads which should be coming out next Tuesday June 16 and possibly contain build 8655 instead of 8653
    • read this recent topic in another forum: https://www.askwoody.com/forums/topic/still-on-win-10-and-happy-to-be-there/ some people are happy sticking with Win10
    • Cooler Master MasterFrame 600 PC case is now 33% off on Amazon by Ivan Jenic The Cooler Master MasterFrame 600 is currently $109.99 on Amazon, down from its original $164.99 list price. That's 33% off and $55 saved on this premium aluminum mid-tower case with a modular design. If you're upgrading your PC case and want something that doesn't force you into a rigid layout, the MasterFrame 600 is worth a look. The case is built around the Cooler Master's FreeForm 2.0 platform, which lets you reconfigure the internal structure according to your hardware. Magnetic side panels allow for straightforward adjustments, and the case supports everything from Mini-ITX to E-ATX motherboards without compromise. There's also generous cooling headroom. Four pre-installed PWM fans handle airflow out of the box. GPU clearance goes up to 410mm, and the case supports radiators up to 420mm with room for three simultaneously. Truth be told, this might not be the prettiest case on the market, but it’s highly functional. The aluminum construction keeps the whole thing lightweight despite its size, and the finish looks noticeably better than the plastic mid-towers competing at this price point. If you want a serious, flexible case that prioritizes function over flashy aesthetics like RGB lighting, the MasterFrame 600 delivers at a reasonable price. Cooler Master MasterFrame 600 - $109.99 | 33% off on Amazon This Amazon deal is US-specific and not available in other regions unless specified. This is a first-party seller link (at the time of article publishing); ensure that you also purchase from a first-party seller link only. If you don't like it or want to look at more options, check out the previous deals that we have covered, OR you can also visit Amazon US deals page. Get Prime (SNAP), Prime Video, Audible Plus or Kindle / Music Unlimited. Free for 30 days. As an Amazon Associate, we earn from qualifying purchases.
    • DK, I don't use the extended channel, I'm always on the latest release.
  • Recent Achievements

    • Rookie
      restore went up a rank
      Rookie
    • Very Popular
      AndrewSteel earned a badge
      Very Popular
    • Veteran
      Taliseian went up a rank
      Veteran
    • One Month Later
      Clizby earned a badge
      One Month Later
    • One Month Later
      Timaximus earned a badge
      One Month Later
  • Popular Contributors

    1. 1
      +primortal
      509
    2. 2
      +Edouard
      162
    3. 3
      PsYcHoKiLLa
      155
    4. 4
      ATLien_0
      82
    5. 5
      Steven P.
      79
  • Tell a friend

    Love Neowin? Tell a friend!