iPox – Mozilla Firefox Theme
iPox is a Mozilla Firefox theme loosely based off the classic iPod and Apple GUI. Ok, that’s where it started, it has since evolved into a sleek theme of blues and whites.
iPox 3 Information
iPox 3 includes some completely re-designed elements, quite a few bug fixes and address some compatibility issues with Firefox 3.6. iPox fans will love the updated theme and if you haven’t tried it out before, it’s worth the install.
To get the iPox Aqua buttons, you’ll need to:
1. Install Stylish
2. Create a new style and use this code:
.toolbarbutton-1,
#back-forward-dropmarker {
list-style-image: url("chrome://browser/skin/custom/ToolbariAqua.png") !important;
}
#stylish-toolbar-button {
list-style-image: url("chrome://stylish/skin/s1-24.png") !important;
}
toolbar[iconsize="small"] #stylish-toolbar-button {
list-style-image: url("chrome://stylish/skin/s1-16.png") !important;
}
iPox 2 Information
iPox 2 has been completely re-coded for Firefox 3, however the same look and feel has been kept.
Note: At this time, most hacks from iPox 1 have not been worked into iPox 2.
iPox 1 Information
With iPox 1.0 it makes a huge step forward. I started from scratch throwing out all the previous iPox code in order to create the best possible version for Firefox 2.0. While working though the code, I found more areas to theme and areas that needed fixing up. iPox has come a long way from version 0.7x which was developed for Firefox 1.5. iPox 1.0 leaves Firefox 1.x behind and embraces Firefox 2.0 fully.
Not only is the theme more complete, it also comes with a few options. That’s right, I added some code for all those that have expressed dislikes to a few certain areas. Just grab Stylish and go to town.
1) Don’t like the blue bar? Turn it into a metal/gray bar by using this code:
@import url(“chrome://global/skin/extra/bookmarks-bar2.css”);
2) Need more color behind the buttons? Add a bright blue, Apple like, bar with this code:
@import url(“chrome://global/skin/extra/toolbar2.css”);
3) In love with the old status bar? Get it back with this code:
@import url(“chrome://global/skin/extra/statusbar2.css”);
4) Kill bookmark icons in the bookmarks bar with this code:
toolbarbutton.bookmark-item > .toolbarbutton-icon { display: none; }
5) Customize the bookmarks bar any way you want.
Change Personal Toolbar Background Color
#PersonalToolbar { background: #e5e5e5 !important; }
Change Personal Toolbar Background Image
#PersonalToolbar { background: url(“yourImage.png”) repeat-x !important; }
Change Personal Toolbar Text Color
.toolbarbutton-text { color: #464646 !important; }
See most the iPox hacks enabled. This screenshot is with them all enabled, you can choose to only do one if you wish.
6) If you have your bookmarks bar replaced with the del.icio.us bookmark bar, use this code for nice tags:
.yb-tag-item { color: #CCD4F5; list-style-image: url(chrome://global/skin/icons/tag.png) !important; }
7) Want the old Apple like throbber?
@import url(“chrome://global/skin/extra/old-throbber.css”);
I hope you enjoy iPox and please let me know what bugs come up. Also, if you use some of the hacks above to customize your install of iPox, feel free to drop a link to the image and show it off.
Version 3 Updates:
– Completely re-designed address bar utilizing CSS.
– Integrated iPox Aqua.
– Re-designed scrollbars.
– Brought back the Mac throbber.
– Fixed the full screen button.
– Fixed a number of other items.
Version 2.071508 Updates:
– First public release for Firefox 3 with a whole new code base.
– Toolbars are all blue now too.
Version 1.3 Updates:
– Fission Support (as good as I can get)
– AddBlock Plus Fixes (I think)
– Added New Tab Button on Tab Bar Extension Support
– Old Throbber Hack
Version 1.2 Updates:
– New Throbber
– Addon’s separator themed.
– Colored tabs working??
– ForcastFox/Statusbar Separators cleanup.
– Tiny Dot by Go Button gone.
– Linux crashes fixed (I hope)
Version 1.1 Updates:
– Fix to secure URL background.
– Bigger Big Buttons and more normal sized small buttons.
– Sage icon comes back. (thanks Jon Hicks)
– All in One Sidebar code. (not sure how well that works)
Hey Thomas,
looks really awesome! Can’t complain at all, but since I guess that you’re a perfectionist, check out the options-dialog in XP: http://stuff.pellkofer.de/ipox_options.png
Kudos to you!
Dodo that’d look better if you were using an XP look and feel and not Windows Classic. 😉 I did searched for that background color and haven’t find it yet.
Thomas, thanks for the effort. Doesn’t really matter, don’t use the dialog much anyways — and like the classic look sooo much better 😉
Dude, thanks for the coolest theme above earth ! (no, I am not megalomaniac 😉 )
Mozilla ad-on page is down, is there a 2nd party source to the theme?
Sorry Eric, there is no secondary download area as I prefer to keep official releases on Mozilla’s site. I doubt it can be down for long.
how and where do I add the options mentioned up above? I have Stylish, but I don’t know how exactly I’m supposed to implement the changes for the theme…
how – To use the edits above, just open Stylish, click on write, then add the code. Here is a preview: http://beta.zooomr.com/photos/twistermc/372450
Very nice job Thomas. I really like the theme.
The only comment I have at the moment, is the help-button. I liked the previous help-button more, this doesn’t seem to fit.
Check my screen: http://img465.imageshack.us/img465/3850/ipoxhi2.jpg
Wow, in my testing there wasn’t a help button at all. 🙂 That goes on the fix-it list. Thanks
i absolutely love the iPox is finally fixed up for firefox 2.0!
my only qualm is the new background on the menus.. is there anyway to remove that (ie a hack like the ones described above) and have the old white background?
Can’t seem to get the first code working or any other ‘change colour’ codes in fact. I realised they do not seem to come up as global codes, does that make any difference?
Ok, I should’ve been more specific; I can’t get the hacks beginning with “@import url” to work, stylish basically says they don’t work. I guess I’ll have to mess with them a bit. I did figure out how to change the thing that was bothering me, the blue bookmark bar. I do have a question though; How can I change the scrollbars to a different color? I rather have white bars than blue, but I’m not very educated when it comes to CSS, unfortunately. 🙁
argh, hate leaving all these posts…is there a way to turn the scrollover for the buttons in the bookmark and custom toolbars back on?
jrk – You’ll need to add this code:
menupopup > menu,
popup > menu,
menupopup > menuitem,
popup > menuitem {
max-width: 42em;
background: none !important;
}
menupopup > menu[_moz-menuactive=”true”],
menupopup > menuitem[_moz-menuactive=”true”],
popup > menu[_moz-menuactive=”true”],
popup > menuitem[_moz-menuactive=”true”] {
background: url(“chrome://global/skin/menu/menu-hover2.png”) repeat left center !important;
color: #fff !important;
}
Ed – Yes, they need to be global styles and do need to be enabled. Did you see my screen shot a few comments above you?
How – Scrollbars are a much bigger issue to deal with as there are 8+ images to deal with and it’s not something I can just post here. As far as the bookmarks bar question. I’m not sure what you did so I’m not sure how to fix it.
If you need specific Stylish help, look at the Stylish website and or forum.
New: Install the hacks automatically: http://userstyles.org/user/show/1063
Is it possible to change the text color of the main menus (file/edit/view/history/etc.)? From what I can tell the color’s based on your system’s default text color, but I was hoping it was possible to assign a specific text color to them.
Thomas, about the bookmark toolbar; usually when you scroll over a bookmark’s text, it would highlight, but it doesn’t do that in this extension, so I presumed that it was turned off. I was wondering if someone could write up a code that would turn the bookmark text highlight back on.
and about the scrollbar, no problem. Now that the blue bar behind the bookmarks is gone, they aren’t so bad.
Thanks Thomas Still a great theme
wow, thanks for that code, and the install link for stylish.. makes it real simple for someone like me who really doesn’t know anything about how to code the appearance of firefox……. yeah..
is there any way to get back the old blue highlight colour in the menus as well, though? cos now that i’ve gotten rid of the stripes in the right-click menus, anything i hover over disappears (i guess the highlight got removed?)….
i swear i’m not picky… i just love the blue of iPox!
jrk – I thought the code I added with the stylish button (see Stylish page http://userstyles.org/user/show/1063 ) had all the correct code. Is that what you are using?
how – I’m not sure why your bookmark highlights left. You overwrote the highlight code when you added some other code I’m guessing.
Not so Thomas, it was like that as soon as I installed Ipox, and before I modified it at all. I also turned off all my other Stylish stuff, and none of my other extensions affect it.
the only code i’ve added was the one you mentioned, the ‘Remove iPox’s Right Click Background’ code on the userstyles page.. it’s almost as if the highlight colour is white, and so whenever i hover over any menu item, it disappears. kinda sounds like how and i have the same thing going here, i believe? not sure though…
here’s a screenshot of what i’m talking about: http://photos1.blogger.com/blogger/1061/924/1600/disappearinghilight.0.jpg
not quite, jrk. I’m talking about the toolbar scrollover effect. It just isn’t there anymore, so when I put my cursor over a toobar link or button, it doesn’t highlight, it stays the same.
Dittos on the menu background. It seems too busy and distracting to my eyes at least 😉
Also, I don’t know if it was already mentioned but on the bottom right of the Tools | Options dialog box, the Help button is squished over towards the right. When I hover over it, it only half shows a button icon. The rest is buried under the Cancel button.
yeah, it’s been mentioned, if not here, then at the mozilla extensions page for Ipox. I also have that “problem.” Not really bothered by it, since it’s in a spot I don’t go to very frequently.
jrk – I updated the Stylish code as it had fancy quote marks and that was throwing errors. Try again: http://userstyles.org/style/show/1299
how – I think you just don’t see it or are expecting more. It’s now a light white (like 70% transparent) and might be easily lost on some monitors. I know it looks good on mine. 😉
no, it’s not my monitor. It’s not there at all. I even changed the color to black and also switched it back to the original blue background to see if it just didn’t show up on the white, but it’s just not there. 🙁
Maybe a W2K issue. I’ll have to look into it. Thanks
yay! the blue highlight’s back! thanks!!
but uh….. yeah, i found something else. hehe.. for sites with unauthenticated content, it highlights the location bar in red and has the little padlock with a line through it… only the padlock repeats for the entire location bar, so you can’t see the location bar at all..
here’s my screenshot so you can see exactly what i mean: http://photos1.blogger.com/blogger/1061/924/1600/securedsite.jpg
jrk – That’s a known issue that I missed. I’ll get that fixed up for the next release.
any chance of getting the bigger icons back?
Eric – Hopefully.
Are the small icons on the navigation toolbar purposeful, or is this an error? I’d really like to get back the size of icons that were existent in the theme for Firefox 1.5.
Huy – They were made to match the PC’s default sizes. I can’t believe how many people hate the PC sized icons. I’ll get them back when I get time.
can you make that optional, then? I don’t mind the icon size.
Small and Large will be back to their prior iPox 1.0 sizes very soon. No more tiny.
Hi. I’m Dao Gottwald, the developer of the Aging Tabs extension (http://en.design-noir.de/mozilla/aging-tabs/).
I noticed that my extension can’t change the color of the tabs when using iPox. I guess this is due to your use of !important, which shouldn’t be needed. See chrome://global/skin/tabbox.css lines 185 and 211. Would be great if you could fix this.
Thanks in advance, Dao
Hi. I use SUSE Linux 10.0 and FF 2.0 and your very cool style.
BUT: If I want to add a site to my favourites, my Firefox crashs down.
The same problem with the download-dialogue.
-> Therefore, I would say, that it doesn’t work with Linux!?
Dao – Thanks for the comment. I’ll have to see what I can do. Thanks for the detailed instructions too as that helps a lot.
plitvicer – Linux has always been a problem for me. I’m not sure how to support it.
This theme works fine for me! I’m using Firefox 2.0 on Mepis Linux 6.0 (Firefox 2.0 is a backport for Mepis).
It has only little minor issues as when I move the mouse over the close tab button it deforms a bit the bar of the tab. But nothing really nasty. The rest works fine for me!
Have loved the theme for some time, but it does stop one of my favourite xetensions working – ‘colourful tabs’. When I change back to other themes, I get all the tabs in pretty colours, but ipox obviously is too dominant! Any way I can adjust the theme to get the coloured tabs back? Thanks for all the work…
it has already been mentioned.
“Hi. I’m Dao Gottwald, the developer of the Aging Tabs extension (http://en.design-noir.de/mozilla/aging-tabs/).
I noticed that my extension can’t change the color of the tabs when using iPox. I guess this is due to your use of !important, which shouldn’t be needed. See chrome://global/skin/tabbox.css lines 185 and 211. Would be great if you could fix this.”
Thomas says he will look into it.
Yes, colorful tabs is on my fix list. I never thought so many people would be so concerned.
It’s because we love all the pretty colours…
Comments Closed on this page. Please add any comments to the current release blog post.