How To Change Your Firefox Throbber
You know that cool little icon in the upper right-hand corner of your Firefox browser? That is your Firefox throbber - yeah, I don’t like the name either. However, its job is to let you know when there is still data being transferred from a site’s server by going through its animation cycle. In reality, the throbber is simply a combination of gif images. When no data is loading, and it is sitting still, you should see a still gif. However, when data is being loaded and the throbber is activated then the browser displays an animated gif. The process of making your own throbber is really simple, and it gives your browser a customized feel.
The first thing you will need is an idea that will translate well to a tiny square no bigger than 50×50 pixels. For my throbber, I made an animated gif that fit the look of Zerosign.net. I made a simple design using MS Paint and drew out four different gifs that could be combined together to form an animated gif. I used a really simple gif animator program that I found online here. Once you’re happy with the animations, all that’s left is modifying some Firefox code.
Navigate to “C:/Documents and Settings/username/Application Data/Mozilla/Firefox/Profiles/xxxxxx.default/chrome”. In this directory, there should be a file called ‘userChrome-example.css’. Edit this file by adding the following lines of code to the top of the file and renaming it to ‘userChrome.css’.
toolbar #navigator-throbber { list-style-image: url(”newzero1.gif”) !important; }
toolbar #navigator-throbber[busy=”true”] { list-style-image: url(”newzeroani.gif”) !important; }
Of course, you would change the gif names to correspond to the names of your own image files. Then, after adding your gifs to this directory, restart Firefox. When your browser comes back, your new throbber will be there. For a slightly more detailed explanation of this process you can check out UrbanMainframe’s post about the topic.
If you would like to use my image files, you are welcome. They are really simple and if more than five minutes was spent on the process, I’m sure you could get some better effects. But if you so choose:
Aaah nice!
Comment by Kevin — November 23, 2005 @
Wow, I am gonna have to try that right now. Cool little “mod” if you will.
Comment by MrRockabilly — November 23, 2005 @
Sa-weet!
Comment by A. Nony Mouse — November 23, 2005 @
Another throbber hack: Go to about:config and change the url in the key: “browser.throbber.url” to zerosign.net
Comment by Ignatius — November 23, 2005 @
[…] You know that cool little icon in the upper right-hand corner of your Firefox browser? That is your Firefox throbber – yeah, I don’t like the name either. However, its job is to let you know when there is still data being transferred from a site’s server and the process of making your own throbber is really simple. read more | digg story […]
Pingback by TechMasses » Blog Archive » How To Change Your Firefox Throbber — November 23, 2005 @
Doesn’t work in RC 1.5x
:(
Comment by A. Nony Mouse — November 23, 2005 @
[…] For those of you who don’t know, the Firefox throbber is the little icon you see on the upper right hand corner of your Firefox window (under the Close button on Windows). Basically, it sits there while a page is loading to let you know that Firefox is actually doing something. Not very useful nowadays with high-speed broadband connections, but if you’re still on dialup or ISDN, I guess it could provide some form of hypnotic entertainment while you wait for a page to finish loading. Did you know it is possible to make your own throbber? You probably already install new themes on Firefox anyway, so why not go ahead and customize it further! The whole process is very simple and is detailed in a post over at Zerosign.net. All you need is a tool to create graphics (like GIMP or Photoshop…Paint would work just as well) and a text editor to modify one file in your profile directory. Have fun with it! Print Article You may also be interested in reading: […]
Pingback by TipMonkies » Blog Archive » Changing the Firefox throbber — November 23, 2005 @
haha, thanks ignatius. I’ll make sure to redirect all my throbber urls here
Comment by Administrator — November 23, 2005 @
I can’t seem to get this to work on Firefox 1.0.7…I have done all that is required, I made the animated gif, I captured the first frame of the gif and saved it, I changed the userChrome-example.css file and renamed it, but still no luck. My directory is C:\Documents and Settings\Cody\Application Data\Mozilla\Firefox\Profiles\[stuff that I don’t feel like typing].default\chrome. Any ideas?
Comment by Cody — November 23, 2005 @
hmm… are your gifs located in the same file?
Comment by Administrator — November 23, 2005 @
I made a seperate folder called images and referred to the images as /images/img.gif and /images/anim.gif after it didn’t work when I just referred to them as the files by themselves.
Comment by Cody — November 23, 2005 @
this rocks…
I now have a spinning porche in the corner of my browser
I AM a happy camper!
Comment by shonuff — November 24, 2005 @
forgot to mention that the gif can only be 40pixels tall,
but it can be any width
Comment by shonuff — November 24, 2005 @
Cody, I experienced the same problem with 1.0.7 and it didn’t work even after creating the images folder and re-editing the css file. What now?
Comment by Ben — November 24, 2005 @
I don’t know, I never quite got it to work. I’ll keep trying though, and I’ll let you know if I get it to work. My images are 24×25, so maybe I should get bigger ones…I don’t know. I’ll let you know if I make any breakthroughs though.
Comment by Cody — November 24, 2005 @
Hey Cody, my images were 50×50, so I don’t think that’s the issue, but thanks for trying…don’t know what to think, 1.0.7 is the latest official release is it not? What version / platforms are these other people using I wonder? Thanks again.
Comment by Ben — November 24, 2005 @
Maybe I’ll try it with the RC3 release…I’ll get back to you on that one.
Comment by Cody — November 24, 2005 @
No such luck with the RC3 release either. I’m going to try and write an extension, which will let you locate and pick your GIFs for the throbber. Wish me luck.
Comment by Cody — November 24, 2005 @
I am using winXP with 1.0.7 version of FF and I have no problems. But Cody, if you write a successfull extension let us know - that would be awesome!
Comment by Administrator — November 24, 2005 @
Okay, I hit a little roadblock. I found out how to overlay a user-specified CSS file using an extension, but as of yet, it uses the chrome.manifest way, which is for FF 1.5 only. Plus, it won’t even install in FF 1.5. I’ll keep you all posted.
Comment by Cody — November 25, 2005 @
[…] How To Change Your Firefox Throbber … Throbber? Yes, this little icon thingie in the top right corner […]
Pingback by Personal Babblishing » Quicklinks — November 25, 2005 @
Could someone recommend a good PC freeware, or process, for making animated GIFs?
Thanks.
Comment by MW — November 29, 2005 @
“Could someone recommend a good PC freeware, or process, for making animated GIFs?”
Sure can! For my animated gif I used the MS Gif Animator which is easy, free, and can be found here:
http://www.jhepple.com/gif_animator.htm
enjoy!
Comment by leadingzero — November 29, 2005 @
Thanks, leadingzero. I’ll try out that animation tool this evening.
Comment by MW — November 29, 2005 @
Okay, I’m almost there. I have the extension working, but it won’t overlay the new throbber, all it will do is put ‘FireThrobber’ in the status bar like I wanted it to…
Comment by Cody — December 1, 2005 @
GIF’s are patented.
Comment by stewie — December 21, 2005 @
[…] zerosign.net » How To Change Your Firefox Throbber […]
Pingback by The Burgess Blog » links for 2005-11-30 — December 25, 2005 @
I was searching the web and found your entry. I really like your site and found it worth while reading through the posts. I am looking to publish a comprehensive site reviewing many different articles and blog. Please feel free to take a look at my blog at adobe photoshop manual and add anything your want.
Comment by adobe photoshop manual — February 6, 2006 @
Santana Juelz What The Game’s Been Missing
zerosign.net » H…
Trackback by Jean Pual Cochard — February 19, 2006 @
[…] Here’s an easy step-by-step guide how to change it in a few minutes: here. […]
Pingback by BrokenVolt’s bl0g » Blog Archive » Change the little icon in Firefox. — March 4, 2006 @
you don’t like the name throbber cause the real anme for that is “spinner”. This is because the original browser(s) had a spinning icon. Danm kids, it was only 12 years ago…
Comment by gman — May 19, 2006 @
[…] You know that cool little icon in the upper right-hand corner of your Firefox browser? That is your Firefox throbber - yeah, I don â??t like the name either. However, its job is to let you know when there is still data being transferred from a siteâ??s server and the process of making your own throbber is really simple.read more | digg story […]
Pingback by Software » How To Change Your Firefox Throbber — September 2, 2006 @
The Complete Guide To technology
Comment by igooi signwith — January 15, 2007 @
Thanks for taking the time on writing an article about this information…excellent.
Comment by spurl signwith — February 5, 2007 @
did not work can u do one for windows vista?
Comment by Sam — June 29, 2008 @
ignore top one but there are two examples which one do i use the top or bottom?
Comment by Sam — June 29, 2008 @
ya, doesent work for vitsa :S
Comment by stever — July 25, 2008 @