A very simple example of Internet Explorer addon development

This is not a complete tutorial. It shows how easy it is to build an IE addon/extension in just 5 minutes. And it does not stop you from building a far more complex addon with the other mechanisms.

This example adds a menu item to the default context menu of IE. When right click on IE, the user can see the new menu item and click on it. A dialog pops up showing the title of the Web page you are viewing.

Adding extensions to IE usually requires adding keys to the Windows registry. We prepare a REG file to add the keys to the Windows registry. In our REG file, we also specify the location of an HTML file which contains a JavaScript to run when our context menu item is clicked.

Here is the step-by-step of building the simplest IE addon:

1. Create a new folder in disk C:, e.g. C:\YBPM\

2. Use your favorite editor to create 3 files in that folder, e.g.
      C:\YBPM\ybpm.reg
      C:\YBPM\ybpm_rm.reg
      C:\YBPM\ybpm.html

   ybpm.reg is the REG file that create the menu item on the default context menu. ybpm_rm.reg is the uninstaller which remove the menu item from the default context menu. ybpm.html contains the script that runs when the context menu item is clicked.

   *** file ybpm.reg***
Windows Registry Editor Version 5.00

[HKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\MenuExt\&YouTube Bulk Player Mate]
@="C:\\YBPM\\ybpm.html"
"Contexts"=dword:00000001
"Flags"=dword:00000001

Note: it adds a key "YouTube Bulk Player Mate" (don't mind the name, it is a piece of code from one of my open source projects. You should use your own one.) to the registry to create an item in the context menu. The default value (@) of the key is set to the URL of the file that contains the script that will run when the menu item is clicked.

   *** file ybpm_rm.reg ***
Windows Registry Editor Version 5.00

[-HKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\MenuExt\&YouTube Bulk Player Mate]

Note: it simply deletes the key that was generated by ybpm.reg.

   *** file ybpm.html ***
<SCRIPT>

var parentwin = external.menuArguments;
var doc = parentwin.document;
var ttl = doc.getElementsByTagName("title");

if (ttl.length > 0)
   document.write(ttl[0].innerHTML);

</SCRIPT>

Note: external.menuArguments lets you access the window object of the current page.

3. Restart your Internet Explorer. Right click on any page. You will see "YouTube Bulk Player Mate" item in the context menu. Click on it and you will see a pop-up window showing the title of the current page.

If you are interested to see a live example, you can find the YouTube Bulk Player Mate addon for IE here.