Filed under: Mozilla, Browsers
Remove Firefox 4.0's big, ugly, unmovable orange button
Fortunately, with the help of a Neowin forum thread and a little hacking, I am now the proud owner of a see-through Firefox button that's in-line with my tabs! If you'd also like to move that orange button -- or simply change its color! -- follow these easy steps:
- Locate your Profile directory -- click Help > Troubleshooting Information and then Open Containing Folder
- Now navigate to the Chrome directory
- Copy userChrome-example.css
- Rename your copy to userChrome.css
- Open userChrome.css your editor of choice and dump the following code in it:
#appmenu-button-container {position: fixed !important;}#appmenu-button {padding: 3px 18px 3px 18px !important;margin-top:3px !important;background-color: rgba(54, 121, 166, 0.2) !important;}#navigator-toolbox[tabsontop="true"] #TabsToolbar {padding-left: 95px !important;}#navigator-toolbox[tabsontop="true"] #TabsToolbar {padding-left: 105px !important;padding-top:1px !important;padding-right:98px !important;}
The second block (#appmenu-button) is the most important. You could easily change the color (54, 121, 166) or the opacity (0.2) -- simply change the values, save, and restart Firefox 4.0.
With some knowledge of CSS you could also move the button around (padding and margin), but I'll investigate more tomorrow. In the mean time, enjoy your less intrusive Firefox 4.0 menu!
(Incidentally, if you missed the previous post, Firefox 4.0 beta 1 is now available for download!)
Reader Comments (Page 1 of 2)
KualaBee said 7:59PM on 7-06-2010
How did you put the tab into the title bar?
Reply
jsmorley said 8:59PM on 7-06-2010
This is a good tip, and a good first cut at it, but has some issues. If you use your code, when you hit alt to show the menu bar items the first two or three are hidden behind the "Firefox" button and can't be accessed. You have to right click and turn on the "Menu Bar" which removes the button.
If you change it to "Tabs on Bottom", your code just blows up the interface. ;-)
Reply
Sebastian Anthony said 9:02PM on 7-06-2010
Yar, as the guy says (the one that wrote the code -- it wasn't me), Tabs Below simply doesn't work.
I spotted the Alt-Menu issue, but... it's hardly an issue. I usually hit Alt because I want to get to the menu... not continue playing with my tabs.
jsmorley said 9:14PM on 7-06-2010
It's early days. I'm sure there will be code soon to move the "Menu Bar" 30 pixels to the right or whatever is needed.
Sebastian Anthony said 6:48AM on 7-07-2010
Yeah, you'd think so -- but it hasn't been movable for quite a few builds now...
It might be forced there for a reason. I guess we'll find out!
Gary said 5:38PM on 7-07-2010
Add this to your userChrome.css to move the menu bar along.
#main-menubar{
margin-left: 108px !important;
}
Tyler said 12:16AM on 7-08-2010
You could add the code (like i did) that Gary said or u could just hit alt use the arrow keys to move it and then hit enter (like the code better though)
mfleigle said 9:28PM on 7-06-2010
I just clicked the button - customize - menu bar. And the button is gone
Reply
skyblaze said 9:38PM on 7-06-2010
...or you could downgrade to XP
(installed it on my XP mode VM... it's not there :P)
Reply
Praveen Premchandran said 9:42PM on 7-06-2010
I highly suggest replacing the Big Ugle OranJe button with a big awesome-looking firefox button kinda like MS Office 2010...
What say?
Reply
Slashee the Cow said 10:20PM on 7-06-2010
I'd much prefer the Big UglY OranGe button - what's ugly in Office is ugly elsewhere, but the orange button is less ugly. That and the fewer people that think Microsoft know how to design a UI, the better.
boris said 1:10AM on 7-07-2010
I think Microsoft UI for latest Office and Windows are excellent. If I had ability to change Firefox color scheme to Office 2010 I would.
kojo87 said 1:13AM on 7-07-2010
what i find strange is that Windows 7, in general has a fantastic UI, but their other software like Office 2007/2010 and Internet Explorer are pretty lame. i expected Office 2010 to be a drastic change from 2007 but it really wasn't.
cookiebits said 11:30PM on 7-06-2010
I rather like the Firefox button. It's great for small resolution screens like on my netbook, and I wouldn't really call it ugly either.
Reply
Sebastian Anthony said 6:47AM on 7-07-2010
True! But they could easily put it in the top right corner instead, so it's still easy to see and get to, without sacrificing about 5% of your vertical resolution (which is a big deal on a netbook!)
Wilco said 1:33AM on 7-07-2010
Is it just me or is the code in the article above redundant?
Specifically,
#navigator-toolbox[tabsontop="true"] #TabsToolbar {
padding-left: 95px !important;
}
#navigator-toolbox[tabsontop="true"] #TabsToolbar {
padding-left: 105px !important;
....
seems redundant. I don't think you need the first bit.
Also, for anyone who's interested, you can change what the button says instead of "Firefox". Just use:
#appmenu-button .button-text { display:none !important; } /*removes "Firefox"*/
#appmenu-button dropmarker:before { content: "asdf " !important; } /*Inserts new text*/
Reply
Sebastian Anthony said 6:46AM on 7-07-2010
Yep, it does look a bit redundant. The original code (if you follow the link), looks a bit different. I collapsed two blocks into one, but I'm no Firefox UI guru so I just left the other two as-is.
jery.gider said 2:52AM on 7-07-2010
Wondering only why they didn't call it Stacks, given the existence of the name and the obvious similarities, plus disappointed that the name Folders wasn't reserved for some future Finder-style filesystem browser.
Reply
Daniel Cassidy said 9:31AM on 7-07-2010
Feedback > Firefox Made Me Sad Because... > Hideously ugly orange Firefox button.
Reply
Sebastian Anthony said 9:37AM on 7-07-2010
I think by now they're well aware that the orange button needs to be movable!
I hope they let you change the colour too. Pink would be awesome.