Add your search engine to the browser

There is a great new feature in both Internet Explorer 7 and Firefox 2, which will allow you to integrate your site search directly into the browser.

I have been surprised how little buzz the new Open Search functionality in the next generation of browsers has received. After all, the additional exposure it could provide websites is considerable.

The concept

Open Search is a very powerful concept but for the purposes of this post, I am just going to focus on what it can quickly and easily offer website owners.

At the most basic level, it allows you to easily add the search functionality from your site to the search box found in the top right of both IE 7 and 2.0b1.html">Firefox 2. Although this search functionality is only available while visiting a site, it does give users the option to save your search engine to their browsers and even set it as the default if they wished.

How to add open search

At first, the documentation associated with implementing open search appears very complex. This is largely because Open Search is capable of doing a lot more than basic browser implementation. However, below I give you the absolute basics to get your search in the browsers search box.

Step One: Create a description

The description is a very simple piece of XML that tells the browser about your search engine. There is a lot more information you can pass across but this is the basics:

<?xml version="1.0" encoding="UTF-8" ?>
<OpenSearchDescription xmlns="http://a9.com/-/spec/opensearch/1.1/">
<ShortName>Boagworld Search</ShortName>
<Description>Search for web site management advice.</Description>
<Tags>Boagworld</Tags>
<Image width="16" height="16" type="image/png">http://www.boagworld/favicon.ico</Image>
<Url type="text/html" template="http://www.boagworld.com/mt/mt-search.cgi?search={searchTerms}" />
</OpenSearchDescription>

Most of the above is hopefully self-explanatory. The most important bit is the URL template attribute. The simplest way of finding out what this is, is to search using the search box on your site. Once you have arrived at the search page, copy and paste the url into the above XML file and replace your search term with {search term}.

However, this will not necessarily work for your search engine. It will depend on the set up on your particular site. For example on boagworld, I had to strip out some of the other parameters being passed across. Other search engines might work in an entirely different way, in which case you will have to refer back to the 1.1/">open search documentation.

Once you have made the changes to your XML file upload it to your server. For this demo I saved it as search.xml and put it on my site’s root: www.boagworld.com/search.xml

Step Two: Pointing to your description

The next step is to point the browser at search.xml when it loads your site. You can do this by simply adding one line of code into the header of your pages.

<link title="Boagworld Search" type="application/opensearchdescription+xml" rel="search" href="http://www.boagworld.com/search.xml" />

Rename the title and make sure the href is pointing at your uploaded description.

Once you open the page in either Internet Explorer 7 or Firefox 2 you should see your search engine listed under the search engine dropdown.

See also:

More on Development

Boagworks

Boagworld