15 Tips-n-Tricks to Tweak and Customize Mozilla Firefox Web Browser

If you are a Mozilla Firefox user, this topic will definitely help you. Today in this topic, we are going to share 15 awesome tips-n-tricks for Mozilla Firefox which have been contributed by our reader “Satish S“. These tips will help you in tweaking and customizing Firefox functionality, performance and interface.

Mozilla_Firefox_Browser.png

So without wasting time, lets share the tricks:

Advertisement

1. Use Windows Classic (Windows 9x, Me, 2000) style menus

If you want Firefox menus to appear using Windows Classic theme, add following code in your userChrome.css file:

/* Windows Classic style menus in Firefox */
menupopup, popup {
border: 2px solid !important;
-moz-border-top-colors: ThreeDLightShadow ThreeDHighlight;
-moz-border-right-colors: ThreeDDarkShadow ThreeDShadow;
-moz-border-bottom-colors: ThreeDDarkShadow ThreeDShadow;
-moz-border-left-colors: ThreeDLightShadow ThreeDHighlight;
padding: 1px !important;
}
menubar > menu[disabled=”true”] {
border: 1px solid transparent !important;
}
menubar > menu[_moz-menuactive=”true”] {
border-top: 1px solid ThreeDHighlight !important;
border-right: 1px solid ThreeDShadow !important;
border-bottom: 1px solid ThreeDShadow !important;
border-left: 1px solid ThreeDHighlight !important;
background-color: transparent !important;
color: MenuText !important;
}
menubar > menu[_moz-menuactive=”true”][open=”true”] {
border-top: 1px solid ThreeDShadow !important;
border-right: 1px solid ThreeDHighlight !important;
border-bottom: 1px solid ThreeDHighlight !important;
border-left: 1px solid ThreeDShadow !important;
}

2. Use desired background image for Firefox toolbars

You can put your desired image as Firefox toolbar background. Just add following code in your userChrome.css file:

/* Use desired image in Firefox toolbars */
menubar, toolbox, toolbar, .tabbrowser-tabs {
background-image: url(“image.gif”) !important;
background-color: none !important;
}

Replace image.gif text in above code with your image file name. Also put the image in same location as userChrome.css file.

Advertisement

3. Don’t use bold text on active tab

If you don’t want to show title of active tab in bold, add following code in your userChrome.css file:

/* Active tab title not bold */
tab[selected=”true”] {
font-weight: normal !important;
}

4. Customize location and appearance of close button in tabs

To customize display and location of close tab button present in tab bar, you’ll need to open about:config and edit the preference browser.tabs.closeButtons

You can set its value to any of following:

0 – Display close button on active tab only
1 – (Default) Display close buttons on all tabs
2 – Don’t display close button at all
3 – Display single close button at the end of the tab bar

5 and 6. Display bookmarks or history sidebars on right-side of Firefox window

To display bookmarks or history sidebars on right-side of Firefox window instead of left, add following code in your userChrome.css file:

/* Move sidebars to right-side */
hbox#browser { direction: rtl; }
hbox#browser > vbox { direction: ltr; }

New Method: [Firefox Tip] How to Move Bookmarks and History Sidebars from Left to Right

7. Change width of Search Box

By default, the Search box in Firefox toolbar is very small. To specify your desired width in pixels, add following code in your userChrome.css file:

/* Make Search box long */
#search-container, #searchbar {
max-width: 300px !important;
width: 300px !important;
}

You can replace 300px with your desired size.

8 and 9. Change mouse cursor for JavaScript links and hyperlinks that open in a new window

This trick is my favorite. This trick changes the mouse pointer when you hover the cursor over hyperlinks that open in a new window and links that include a JavaScript command. It makes it easier to differentiate between links that open in same window, links that open in new window and JavaScript links.

Check out following topic for details:

[Tip] Show Different Cursors for JavaScript Links and Hyperlinks that Open in New Window

10. Make Firefox portable and run it from USB drive

You can visit following link to run Firefox from a removable media, such as USB stick:

Download Portable Version of Mozilla Firefox for USB Drives, No Need to Install

11. Speed up Firefox page rendering mechanism

By default, Firefox doesn’t try to render a page for 250 milliseconds while it’s waiting for website data. But you can change this functionality by using about:config and add new Integer preference nglayout.initialpaint.delay and set its value to 0. Now Firefox will immediately start showing the web page.

12. Enable Pipelining feature

Pipelining is a feature which has been designed to improve page loading time. To enable it, open about:config and set following preferences:

network.http.pipelining (Set it to true to enable pipelining)

network.http.proxy.pipelining (Set it to true to enable pipelining to proxy server)

network.http.pipelining.maxrequests (Set it to 8 to have maximum of 8 pipelining requests at once. You can choose values between 1-8)

13. Specify browser cache folder location

When you open a website, Firefox stores the required data in its cache folder so that it can load the same web page faster when you open it again in future. If you want, you can specify a desired location to store the cache files. Open about:config and add new String preference browser.cache.disk.parent_directory. Now set its value to your desired location for example D:\Cache.

14. Specify Firefox memory cache usage

By default, Firefox dynamically utilizes the memory cache based on the amount of your system memory. To specify a fixed amount of memory cache, open about:config and add new Integer preference browser.cache.memory.capacity and set its value to any of following:

-1 : (Default) Set memory cache dynamically
0 : No memory cache
Numbers : Memory size in KB, For example 1024

You can also disable memory cache completely by setting the preference browser.cache.memory.enable to false.

15. Set an external program to view page source

When you want to view page source, Firefox opens it in its built-in page source viewer. If you want to view page source in your desired text editor program like Notepad, open about:config and set the preference view_source.editor.external to true. After that set the preference view_source.editor.path to full path of your desired program’s EXE file for example, C:\Windows\Notepad.exe.

NOTE: Both files “userChrome.css” and “userContent.css” can be found in Firefox Profile folder. To know more about these files, please visit following link:

All About Mozilla Firefox Profile Folder and Configuration Files

about:config” page can be accessed by typing about:config in Firefox addressbar and pressing Enter as mentioned in this exclusive tutorial.

Also Check:

[Fix] userChrome.css and userContent.css Codes Stopped Working After Firefox Upgrade

Published in: Mozilla Firefox

About the author: Vishal Gupta (also known as VG) has been awarded with Microsoft MVP (Most Valuable Professional) award. He holds Masters degree in Computer Applications (MCA). He has written several tech articles for popular newspapers and magazines and has also appeared in tech shows on various TV channels.

Comments

NOTE: Older comments have been removed to reduce database overhead.

  1. network.http.proxy.pipelining,VG i dont find this in about:config in firefox 35.0.01! can it still be used and how would i set it up?thanks

  2. Firefox with twice as less installed extensions is 4x slower as Chrome with twice as much extensions installed ! Real life use of not some Lab like Woklswagen environmental cheat abuse !
    Lately Firefox chokes on 4 core CPU unbelievable !!!

Leave a Comment

Your email address will not be published. Required fields are marked *

NOTE: Your comment may not appear immediately. It'll become visible once we approve it.