Customize Firefox Appearance
If you are running Windows XP and want your menus to fit in with the default (Luna) style, add the following code to your userChrome.css file:
/* Make menus XP style */
menupopup, popup {
border: 1px solid ThreeDShadow !important;
-moz-border-left-colors: ThreeDShadow !important;
-moz-border-top-colors: ThreeDShadow !important;
-moz-border-right-colors: ThreeDShadow !important;
-moz-border-bottom-colors: ThreeDShadow !important;
padding: 2px !important;
background-color: Menu !important;
}
menubar > menu {
border: 1px solid transparent !important;
padding: 2px 5px 2px 7px !important;
margin: 0 !important;
}
menubar > menu[_moz-menuactive="true"] {
background-color : Highlight !important;
color: HighlightText !important;
}If you want the menus to appear native to the Windows Classic appearance, add the following code to your userChrome.css file:
/* Windows Classic (9x/Me/2000) style Menus */
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;
}- Use your own background image for the toolbars
In addition to changing themes, you can personalize Firefox even more by using your own toolbar background image. Add the following code to your userChrome.css file:
/* Use a background image for the toolbars:
(Substitute your image file for background.gif) */
menubar, toolbox, toolbar, .tabbrowser-tabs {
background-image: url("background.gif") !important;
background-color: none !important;
}It's easiest to place the image file in the same location as the userChrome.css file. The image can be of any image format supported by Firefox.
- Make the active tab easier to distinguish
In order to make the active tab easier to distinguish among the currently opened tabs, you can also change the colors for the tabs. Add the following code to your 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;
}- Don't use bold text on the active tab
If you don't want the title of the active tab to be bold, add the following code to your userChrome.css file:
/* Make the active tab not bold */
tab[selected="true"] {
font-weight: normal !important;
}- Remove the close button from the tab bar
You can remove the close button from the tab bar by adding the following code to your userChrome.css file:
/* Remove the close button on the tab bar */
.tabs-closebutton-box {
display: none !important;
}You can still close tabs by right clicking on them and select
Close Tab
, or by pressing Ctrl+WSome people like to place all their toolbar items on the same row as the menu. In order to save horizontal space, you can remove top menu items that you don't use. Add the following code to your userChrome.css file:
/* Remove the Go and Help menus
Id's for all toplevel menus:
file-menu, edit-menu, view-menu, go-menu, bookmarks-menu, tools-menu, helpMenu */
#go-menu, #helpMenu {
display: none !important;
}- Remove extra padding from the Navigation Toolbar
This tip will make the toolbars use less space around the buttons, allowing Firefox to use more space for the actual webpages. This also affects additional toolbars such as the Googlebar. Add the following code to your userChrome.css file:
/* Remove extra padding from the Navigation Bar */
.toolbarbutton-1, .toolbarbutton-menubutton-button {
padding: 2px 3px !important;
}
.toolbarbutton-1[checked="true"], .toolbarbutton-1[open="true"],
.toolbarbutton-menubutton-button[checked="true"],
.toolbarbutton-menubutton-button[open="true"] {
padding: 4px 1px 1px 4px !important;
}- Change the window icon
You can change Firefox's default window icon to any icon you want, by following these steps:
- Go to the folder you installed Firefox in (e.g.
C:\Program Files\Mozilla Firefox\
) and then go to the subfolder chrome. - While in
chrome
, create a new subfolder calledicons
, then go to that folder and create yet another subfolder calleddefault
. The full path to this folder could be C:\Program Files\Mozilla Firefox\chrome\icons\default\. - Choose the icon you want to use (on Windows use .ico files, on Linux use .xpm files) and then place it in this folder and rename it to
main-window.[ext]
, e.g.main-window.ico
on Windows andmain-window.xpm
on Linux.
In addition to the main window, you can also change the icon on the Bookmark Manager and JavaScript Console. The icon names are
bookmark-window.[ext]
andjsconsoleWindow.[ext]
, respectively.After this is done, restart Firefox and you should be able to see your chosen icon in the title of the browser windows.
- Go to the folder you installed Firefox in (e.g.
To display the Sidebar on the right side of the window instead of the left, add the following code to your userChrome.css file:
/* Place the sidebar on the right edge of the window */
window > hbox {
direction:rtl;
}
window > hbox > * {
direction:ltr;
}- Change the width of the Search Bar
By default, the Search bar on the toolbar is relatively small. To specify your own width in pixels, add the following code to your userChrome.css file:
/* Make the Search box flex wider
(in this case 400 pixels wide) */
#search-container, #searchbar {
max-width: 400px !important;
width: 400px !important;
}
Source: Mozilla.org
Labels: Firefox
0 Comments:
Previous Posts
- Convert PowerPoint to high quality video
- Remove Windows XP From A Vista/XP Dual Boot
- How To Search Google For Confidential Files On The...
- Increase The Number Of Simultaneous Downloads In IE 7
- Speed Up SATA Hard Drives & USB Drives In Windows ...
- Defrag Multiple Hard Drives At Once In Windows XP
- Small Yet Awesome Utilities To Make Your System Fa...
- Adding Windows Vista Fonts In Windows XP & Win2000
- Easy Way To Download Videos From Google, YouTube, etc
- The Back Button Hack In Firefox To Reduce Memory U...
Post a Comment