The Home Button (for the Navigation Toolbar)

Many people have complained that the Home button of Mozilla is placed on the Personal Toolbar. Here's my solution! This tiny download will put a Home button in the Navigation Toolbar of Mozilla.

Screenshot of the Home Button

Unfortunately, the Location Bar gets a bit shorter. The Home button in the Personal Toolbar is left untouched, but you can remove it by unchecking the checkbox in Edit > Preferences > Navigator (this doesn't affect the button in the Navigation Toolbar).

The most recent version of Home Button is version 0.4.2. This version removes built-in support for some themes that support Home Button by themselves. Because of bug 152314 it is better that themes support the Home Button, rather than the Home Button support themes. Themes I know support the Home Button is Orbit, Orbit Retro, Internet Explorer, LittleMozilla and Wood. The list below is which themes the Home Button supports. Check the themes you want installed (note: the file size of the package is the same - but only the themes you have chosen, is registered):

WARNING! I will under no circumstances take any responsibility for any possible damage or dataloss caused by the method described below. To clean up the mess version 0.4 has made, close Mozilla. Find the folder where Mozilla is installed, and open the folder "chrome". Delete the folder "overlayinfo" and the file "chrome.rdf". Then open the file "installed-chrome.txt" delete the lines containing the text "home.jar" (if you open it in Notepad you might see rectangles instead of newlines - try Word Wrap). When you now open Mozilla the Home Button 0.4 should be gone, and you can install 0.4.2.

The image for the fullscreen button in Modern is the only image I had to create myself (the rest I stole, er... borrowed from some attachments to bug 49543), and that's why it's so ugly. And there is still no way to uninstall the Home Button, so you're trapped once you've installed it <evil grin>. I hope to address these issues in future releases.

Moving the button around

Some users have asked for the option to put the Home Button another place on the toolbar, e.g. some people want it before the Stop button. This can be done manually by finding the folder where Mozilla is installed, opening the subfolder Chrome, renaming home.jar to home.zip, opening the file in a zip program, and editing the file homeOverlay.xul (many zip programs let you edit files, if not you have to unzip the files, edit and rezip (IMPORTANT: keep the file paths when you're zipping!)).

In the element toolbarbutton, add the attribute isertbefore or instertafter with the id of the button you want to put the Home Button before or after (the Stop button has stop-button as id etc.).

Voilà, you actually learned some XUL. For the time being I'm not planning making a new version of the Home Button that can be moved automatically. The reason for that is that Toolbar Customization is on its way into Mozilla (it's already in Phoenix). I don't know how it will work with the Home Button, but I hope that an in-built Home button for the navbar will be added to Mozilla.

Guide for Theme Authors

If you want to add support for the Home Button in a theme you're making, then you can do it in different ways. The easiest method is adding this lines in navigator.css:

#home {
  list-style-image: url("chrome://communicator/skin/help/home.gif");
}

#home:hover {
  list-style-image: url("chrome://communicator/skin/help/home-hov.gif");
}

#home:hover:active {
  list-style-image: url("chrome://communicator/skin/help/home-act.gif");
}

#home[disabled="true"] {
  list-style-image: url("chrome://communicator/skin/help/home-dis.gif") !important;
}

#home[toolbarmode="small"] {
  list-style-image: url("chrome://communicator/skin/bookmarks/home.gif");
}

#home[toolbarmode="small"]:hover {
  list-style-image: url("chrome://communicator/skin/bookmarks/home-hov.gif");
}

#home[toolbarmode="small"]:hover:active {
  list-style-image: url("chrome://communicator/skin/bookmarks/home-act.gif");
}

#home[toolbarmode="small"][disabled="true"] {
  list-style-image: url("chrome://communicator/skin/bookmarks/home-dis.gif") !important;
}

Here the same icon that the Home button in the Help window is using, and the same icon that the ordinary Home button is used in fullscreen. In some themes the icons are the same size in fullscreen as in normal view. Then the lines with #home[toolbarmode="small"] isn't necessary to include

Some themes instead use one image and -moz-image-region. Other themes have different names and locations of the image files. The code will often have to be adjusted for each theme. Not all themes have icons for disabled="true". The line(s) can be left out, since there's no known circumstances where the Home Button is disabled.

In som themes it's best to use separate images instead of the icon for the Help window or the ordinary Home button. Then you can place the images in a folder named home (the URL has to be chrome://home/skin/) together with a file called home.css. You'll then have to have two extra lines in chrome.rdf where you register the package "urn:mozilla:skin:skinname/version:home".