Add custom search to IE & Firefox

I use the NetcraftWhat’s that site running?…” search a lot in my day to day activities.  Whenever I see a site doing something cool I am instantly curious to see what OS and Web Servers the site is running.  There is a wealth of information about a company’s web presence available through this tool.


I thought “wouldn’t it be cool if I did not have to go through so many steps to search on the Netcraft site”?  Then I remembered that you can add additional search providers to your IE7 search bar (that thing in the upper right hand corner of the browser):



There is a list of about 25-30 search providers that IE knows about, but you can also add “custom” providers that IE does not know about (like Netcraft).  There is a nice wizard that will guide you through adding your custom providers.  All of this is available on this page (link current as of this posting):


http://www.microsoft.com/windows/ie/searchguide/en-en/default.mspx


That is all very well and you could probably go to that link right now and add some custom providers to your browser and be happy with this tip.  What is even cooler is that you can add these custom providers by using the DOM and a little bit of JavaScript.  So you as a webmaster could let you customers add your provider to their browsers programmatically with the click of a button.  Now you can’t force your customer to add a provider (the browser will ask them for permission), but you can give them the option to add it.


Create a search provider XML File


The first step is to create an XML File that describes your provider.  The format of the XML file is the OpenSeachDescription specification (currently version 1.1) documented here on OpenSearch.org.  The one for my Netcraft search is below:



     http://a9.com/-/spec/opensearch/1.1/”>
     Netcraft …
     Netcraft What’s that site running provider
     UTF-8
     http://searchdns.netcraft.com/?host={searchTerms}&position=limited&lookup=Wait..”/>


Call the AddSearchProvider Method


You can call the search provider with something as simple as the onclick method on an tag (Yes – it is very bad form to use the onclick property, but it is a lot easier to show one line of code in a blog entry):


onclick=”window.external.AddSearchProvider(‘netcraft.xml’);”


When you call this, you will see a dialog box like this (this is the security feature that prevents a webmaster from forcing a provider on a user that I mentioned earlier):



You can see this in action by checking out this page:  http://www.28thessential.com/AddProviderSample/AddSearch.htm


Did I mention Firefox yet?


Firefox 2.0 supports this same format with only one small tweak (I had to fully qualify the URL).  Isn’t it wonderful when everyone follows the same specification?


Some things you will want to do



  • Add error handling
  • Check the browser version so that you don’t offer to add the provider to a browser that does not support it
  • Add something to the URL that is specific to people searching from the browser (let’s you know how effective it is versus people searching from within your web page)

Let me know if you implement this on your site, I will add a link to it from this article (also let me know if you use it on your intranet site – although I can’t link to it!)

Leave a Reply

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