How to Install a Stylish User Style
While you can add style code to Firefox’s
userChrome.css file by hand, it’s way easier if you install the Stylish extension for Firefox. Stylish helps you manage your user styles in an easy-to-use interface, where you can create, edit, search, enable, and disable user styles from the add-on’s Options dialog, as shown.
First, install the Stylish extension and restart Firefox. Then, to install a user style below, visit its homepage and click the “Load in Stylish” button on its homepage as shown.
Let’s take a look at a few Firefox-enhancing user styles.
Enhance Firefox’s Interface
These user styles add smart colours and features to Firefox’s chrome to make it easier to use.
Italicize unread tab names [Install] —If you open web pages in background tabs often (like by mousewheel clicking on them) when you’re browsing lists of links like Google search results or a blog, you’ll wind up with several tabs you haven’t viewed yet. This user style italicizes the titles of tabs you haven’t yet looked at for easy visual identification.
Combine Stop and Reload buttons [Install] —Either Firefox is loading a page (and should show a Stop button), or it’s fully rendered a page (and should show a Reload button). This user script combines the Stop and Reload buttons into one that changes functionality depending on the context. Update: Replaced the Smartly show Stop and Reload with this script, which is better implemented. Thanks, _Jonny!
Yellow the location bar for https:// sites [Install] —Firefox 2’s noticeable visual cue that you are browsing a site over an encrypted connection—a totally yellow address bar—got pulled from Firefox 3. Re-yellow the location bar on https:// web sites with this user style.
Add a keyword when you bookmark a page [Install] —If you use Firefox’s location bar as a command line with keyword bookmarks, this tweak’s a must-have for you. This user style displays the keyword field in the Add a Bookmark and Edit Bookmark dialog so you don’t have to navigate all the way into the Bookmark organizer to set up your keywords.
Enable multiple tab rows [Install] —While this user style makes your tabs’ borders look a little wonky, it’s super-handy if you often keep more than 15 or 20 tabs open at once. With this user style installed and several tabs open, instead of scrolling tabs off to the side, this user style stacks them in two rows.
Hide Unneeded Buttons, Menus, and Menu Items
If consolidating Firefox’s chrome to maximise browsing area is your thing and you’re a master of Firefox’s mouse and keyboard shortcuts, there’s a whole lot of unnecessary bells and whistles that the right user styles can cut out.
Hide the search box magnifying glass and location bar Go button [Install] —You already know you can hit Enter to go to a web site address or run a search from the upper right hand box, so give your text more room to breathe by removing the location bar Go button and search box magnifying glass.
Hide the Edit and Help menus [Install] —If you already know all the keyboard combinations for features in the Edit menu—like Ctrl+C to copy, Ctrl+V to paste, etc—you can remove that menu, as well as the Help menu from the pulldown menu bar. This comes in handy if you want to relocate your location bar to the pulldown menu area to save vertical space, as shown.
Hide the “Open all in tabs” item in bookmark folders [Install] —If you keep bookmarks in folders on your toolbar, each one will have a “Open all in tabs” option on the list. Since you can always mousewheel click the folder to open all links in tabs, this user style removes this item.
Auto-Hide the Bookmarks Toolbar [Install] —Get more vertical space but still have access to your bookmarks toolbar with this user style, which only shows your bookmark toolbar when you hover over it—the rest of the time it’s hidden. While this user style can get a bit annoying to folks who move their mouse up to the location bar, if you Ctrl+L often, it’s a nice space-saver.
Bonus about:config tweaks
If you’ve read this far, you get a prize. Have a couple of other useful Firefox configuration tweaks:
- Turn on spellcheck in text fields (only on in textareas by default)
- Enable colour profile support
- Tweak the “AwesomeBar”‘s algorithm weights
- Disable blinking text
What are your favourite user styles for Firefox? Post ’em (preferably with links to userstyles.org) in the comments.
Gina Trapani, the editor of Lifehacker, likes styling Firefox fo
r function instead of looks. Her feature Geek to Live appears every Monday on Lifehacker.