Explorer Bar w. HTML

A few site visitors have asked me about my Explorer Bar sample. They all wanted to do something similar, but would prefer to use an HTML page to define the user interface instead of doing C++ programming. Amazingly, Microsoft anticipated this need and added this functionality already in IE4. So here is a short tutorial on adding your own Explorer Bar - without any need of programming skills at all.

Explorer Bars

Internet Explorer Bars are those bars you can toggle on and get annoyed with because they clutter up your browser's workspace. Like the Search bar and History bar.
Explorer Bars are docked to the left or in the bottom of your browser window. You turn them on from the View / Explorer Bar menu in Internet Explorer.

How to create these bars is described on MSDN in an article called "Creating Custom Explorer Bars, Tool Bands, and Desk Bands". Microsoft briefly mentions that you can create a bar from an HTML file, and then goes on to describe some complicated (incomplete) registry settings needed to do this.

Explorer Bars with HTML

The HTML Explorer Bar is a regular Explorer Bar, which loads an HTML file in its view. To create the bar, you must supply the following information:

The title used in the IE menu
The URL to the HTML file
The initial size of the bar
Whether the bar is horizontally or vertically docked

So this kind of Explorer Bar does not require programming at all. It will load and display any HTML page. You can, however, add scripting code, links, style sheets, animation, the lots, in your HTML file.
The Title can contain an ampersand character to allow a menu shortcut. The URL argument should contain a protocol; so if you use a locally installed file then prefix it with file:///; if it's a page on the web, prefix with http://. And yes, you can reference a page located on the web.

Your Explorer Bar navigates inside its own view if you click on a link in your HTML page. To navigate in the main window, you must reference the _main frame. You do this by setting the target attribute in your anchor (link).

<a href="http://www.viksoe.dk/code/" target="_main">my site</a>

It's actually easier to just set the base if you don't want to navigate locally at all.

<base target="_main">

Manipulating the main page using DHTML (JavaScript) becomes a bit trickier. I'm not sure this is really supported because IE doesn't seem to allow you to reference the main window through scripting code. One clever hack could be to send...

javascript:nasty js code goes here...

URLs to your _main frame. The object Microsoft tugged away in the window.external scripting property is an IShellUIHelper interface - not of much use.

Bar Installer

Because it's inconvenient to mess with registry settings manually, I've created a small utility that will install/uninstall an Explorer Bar. It takes a number of command line arguments and creates the appropriate registry keys.

It's a console application, so you need a command prompt to see the output (if any). Anyway, just run the file and it will display the arguments it needs to be called with.
The utility is called BarInst. Also found in the package is a Setup.exe file, which will install the bar configured in the BarInst.inf file.

Controlling the Bar

It is also possible to create a toolbar button in the Internet Explorer as well. Clicking on this button, toggles the newly installed Explorer Bar on and off.
To be able to use it, you must have used the -CLSID argument when installing the bar. Supply a CLSID by using the GUIDGEN utility. This creates a new unique identifier for your Bar so it doesn't conflict with other IE components.

Finally you can use the following registry script to create the button. The script was supplied by Johan Frithioff:


 [HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Internet Explorer\Extensions\{a73d8261-5d36-4eaa-bff1-bf21d51c8286}]

 "Default Visible"="Yes"

 "ButtonText"="ExpBar"

 "MenuText"="ExpBar"

 "MenuStatusBar"="ExpBar"

 "HotIcon"="%SystemRoot%\\system32\\SHELL32.dll,14"

 "Icon"="%SystemRoot%\\system32\\SHELL32.dll,14"

 "CLSID"="{E0DD6CAB-2D10-11D2-8F1A-0000F87ABD16}"

 "BandCLSID"="{xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx}"

where the BandCLSID is the CLSID of your Explorer Bar.

Known Bugs

There were a couple of strange installation problems in Internet Explorer 4. Most notably Microsoft attempts to explain why their code was broken in the following MS Knowledge Base articles: Q247705, Q195967 and Q230734.

Source Code Dependencies

Internet Explorer 4 or better
Microsoft Visual C++ 6.0

Installation Guide

Before you install an Explorer Bar, close Internet Explorer first. After the installation, wait a couple of seconds and then open Internet Explorer again. In case the menu item has not appeared, reboot the machine.

Download Files

Explorer Bar Installer (22 Kb)

Written by Bjarke Viksoe.
Article submitted 7/27/2001.

To the top