Hack43.Hack Firefox

Hack 43. Hack Firefox

The free browser Firefox has gained millions of adherents since its release because of its security features, customizability, and features that Internet Explorer lacks, such as tabbed browsing. Here's a grab bag of hacks for powering it up.

Internet Explorer has some serious problems. Because it's intimately tied to Windows XP, it's become a favorite source of malware-writers, who use its security holes not just to harm the browser itself, but also to get into the guts of the operating system. And it has a variety of security holes that never seem to get plugged.

In addition, it hasn't gotten a face-lift or significant new features for years (other than pop-up blocking in SP2), and it's starting to show its age. It doesn't, for example, let you browse the Web with tabs, letting you visit multiple sites simultaneously by putting each site in its own tab.

Because of this, the free, open source browser Firefox (available for download from http://www.mozilla.org/products/firefox), shown in Figure 4-31, has gained millions of followers. It's more secure than Internet Explorer, includes features such as a pop-up blocker, lets you browse to multiple web sites using tabs, and much more.

Figure 4-31. Browsing multiple sites at once, using tabs

Many people consider Firefox superior to Internet Explorer for another reason as well: it's much more customizable, and hundreds of free add-ins are available that extend its power and features. In this hack, you'll learn how to add new features with Firefox extensions, and how to hack the interface with a hidden style sheet.

4.13.1. Using Firefox Extensions

Perhaps the most remarkable feature of Firefox is its ability to use extensions. Extensions are free add-ins that give the browser all kinds of new features. Because Firefox is open source, anyone can write an extension, and developers all over the Internet have put their creativity to use. There are hundreds of them, and new ones are added every day (by the time you read this, more than 1,000 extensions could be available). They add a mind-boggling array of capabilities, such as telling you the real URL of a site you're visiting so that you can't be the victim of a phishing exploit; letting you navigate the Web using mouse gestures so that you can browse by moving your mouse rather than by clicking; blocking ads; and much more.

How to find extensions? In Firefox, choose Tools Extensions Get More Extensions. Youll be sent to a web page that lists extensions by category, and also lists the most popular and most recent one. This is the official Firefox extensions site, but it's not the only place you can find extensions. You can find them on other places on the Web as well, notably at http://texturizer.net/firefox/extensions and http://extensionroom.mozdev.org.

Browse to the extension you want to install and click Install. If you want more information about the extension before you install it, click the title of the extension, and you'll be sent to a page with more information about it; from there, you can also download the extension (see Figure 4-32).

Figure 4-32. Finding the Adblock extension

After you click Install, the screen shown in Figure 4-33 appears.

Figure 4-33. Starting to install the extension

Click Install Now, and after several moments, the extension will be installed and will appear in your Extensions window, as shown in Figure 4-34. The extension won't work yet; first you have to close Firefox and restart it.

Figure 4-34. The installed extension

When you restart Firefox, the extension will start working. Many extensions allow you to customize their options. So, immediately after installing an extension, you should do that. To customize the options for an extension, choose Tools Extensions, select the extension you want to customize, and choose Options. If you want to uninstall an extension, select it, click Uninstall, and then click OK. You'll have to close Firefox and restart for the extension to uninstall.

Hundreds of extensions are available, and everyone has their favorites. Here are a few of mine:

Googlebar

This installs the equivalent of the Google toolbar in Firefox. (For more information about the Google toolbar, see [Hack #47] .)

BugMeNot

Many web sites require free registration before you can read their content. This nifty add-in supplies you with login information and logs you into most of those web sites so that you don't have to fill out registration forms.

SpoofStick

A great antiphishing tool, SpoofStick displays the real URL of a web site you're visiting so that you can't be fooled by spoof sites. For more information about the tool and about stopping phishing attacks, see [Hack #37] .

Autofill

When you buy online, or register with a web site, you have to fill out long forms, which can be tedious and time-consuming. With this extension, you click a button, and the form is filled in automatically.

Mouse Gestures

Instead of clicking your way around the Web, you can use mouse gestures. Hold down the mouse button and make a gesture with your mouse, and you can open and close windows, navigate from page to page, and more. So, for example, to close a tab, you would hold down the right-mouse button and move the mouse in a reverse "L" motion, and the tab would close.

Bandwidth Tester

What's the true speed of your Internet connection? Install this extension and find out. Figure 4-35 shows it at work.

Figure 4-35. Bandwidth Tester in action

4.13.2. Hacking the Firefox Interface

It's easy to apply themes to Firefox, which give it different colors and graphics. To apply a theme, choose Tools Themes Get More Themes, and you'll be sent to a web site with many different themes. When you find a theme you want, click Install. For more information about a theme, click the title, and you'll be sent to a page with more information, which sometimes includes a preview. You can install the theme from that page as well.

After you click Install, the theme will be available to use. Click Tools Themes, choose the theme you want to use, as shown in Figure 4-36, and then choose Use Theme. You'll have to restart Firefox for the new theme to take effect. If you want to uninstall a theme so that it's no longer available, select Uninstall from the screen shown in Figure 4-36.

Figure 4-36. Choosing a new theme in Firefox

But Firefox lets you do more than just change the theme. You can also hack the interface. Firefox's interface can be controlled by a cascading style sheet (CSS), a file that contains instructions on how Firefox should display. By editing that file, you can change Firefox's appearance.

The file is named userChrome.css, and for it to work, it needs to be located in the folder C:\Documents and Settings\<Your Name>\Application Data\Mozilla\Firefox\Profiles\default.xxx\chrome, where <Your Name> is your XP account name, and the .xxx will be three random characters.

When you install Firefox, there is no userChrome.css file in that folder. Instead, you can find it in C:\Documents and Settings\<Your Name>\Application Data\Mozilla\Profiles\Default\xxxxxxxx.slt\chrome, where xxxxxxxx is a random collection of characters. Copy the file to C:\Documents and Settings\<Your Name>\Application Data\Mozilla\Firefox\Profiles\default.xxx\chrome. Once it's there, you can edit it to change Firefox's interface. It's a plain-text file, so you can edit it with Notepad. Following are some of the hacks you can make by editing the file. If you don't already have a userChrome.css, you can start off with a blank text file, and name it userChrome.css.

Note that it's a good idea, when putting in this code, to put in a reminder for yourself so that later on you remember what it does. You have to tell userChrome.css to ignore your reminder so that it doesn't try to interpret it as code. So, surround your comments with /* to begin and */ to end, like this:

/* This is a comment */

4.13.2.1 Put your own graphic on the Firefox toolbar

If you don't like the plain background of Firefox's toolbar, you can put your own graphic there. Type the following into the userChrome.css file, and put the graphic you want to usefor instance, background.gifin the same directory as userChrome.css:

/* Change the toolbar graphic */ menubar, toolbox, toolbar, .tabbrowser-tabs {    background-image: url("background.gif") !important;    background-color: none !important;    }

4.13.2.2 Make it easier to find the active tab

When you use many tabs when you browse, sometimes it can be difficult to distinguish the active one. So, you can make that tab stand out more, and gray out the background tabs. Type the following into the userChrome.css file:

/* Change color of active tab */ tab{    -moz-appearance: none !important; } tab[selected="true"] {    background-color: rgb(222,218,210) !important;    color: black !important; }     /* Change color of normal tabs */ tab:not([selected="true"]) {    background-color: rgb(200,196,188) !important;    color: gray !important; }

4.13.2.3 Change the width of the search bar

You can change the width of the search bar on the upper-right corner of Firefox. (To hack the search bar, see [Hack #44] .) You do it by specifying the width of the bar in pixels. This code tells the search bar to be 400 pixels wide:

/* Make the Search bar wider    (in this case 400 pixels wide) */  #search-container, #searchbar {    -moz-box-flex: 400 !important; }

4.13.2.4 Move the sidebar to the right

Firefox lets you use a sidebar when you want to view your history or your bookmarks. The sidebar displays on the left side when you choose View Sidebar. If you prefer, you can have the sidebar appear on the right, by typing this code into the userChrome.css file:

/* Place the sidebar on the right edge of the window  */ window > hbox {    direction:rtl; } window > hbox > * {    direction:ltr; }

Naturally, you wouldn't necessarily use all these hacks in concert with one another. But you could, of course. Figure 4-37 shows what Firefox looks like after we've added the hacks to the userChrome.css file.

Figure 4-37. Firefox, after the userChrome.css file has been edited

You can hack Firefox using the userChrome.css file in several additional ways. For more, go to http://www.mozilla.org/support/firefox/tips and http://www.mozilla.org/unix/customizing.html.

4.13.3. See Also

• [Hack #44]

• [Hack #47]

• [Hack #32]