Monday 22 October 2007

Web browser built in search engine links

We've started investigating linking the GoodnessDirect search page into the search box found on browsers like Firefox 2 and Internet Explorer 7.

The technique for this is actually really simple. You create an XML file to the OpenSearch standard, host it on your web server and add a reference to that in the head of your web pages.

The XML file looks something like this:


<?xml version="1.0" encoding="UTF-8" ?>
<OpenSearchDescription xmlns="http://a9.com/-/spec/opensearch/1.1/"
xmlns:moz="http://www.mozilla.org/2006/browser/search/">
<shortname>EngineName</shortname>
<description>EngineDescription</description>
<inputencoding>UTF-8</inputencoding>
<image width="16" height="16">ImageData</image>
<url type="text/html" method="GET" template="searchURL?query={searchTerms}">
<Url type="application/x-suggestions+json" method="GET"
template="suggestionsURL?search={searchTerms}" />
<moz:searchform>searchPageURL</moz:SearchForm>
</opensearchdescription>



One little snag we hit was that our site makes a lot of use of extended path info as processed by Apache. This is fine with searches that are just single words or words with single spaces between them, but each space is translated into a + and the resulting ++ of two spaces causes the CGI processor to get upset. So we changed to using GET parameters for this and all is well.

The suggestionsURL above is used to produce some suggestions for the drop down box you get in the search bar. It's up to you as to how you handle this and you simply return a JSON array with the results such as:

["tofu",["tofu", "tofutti", "tofutti rock n roll cones 4x110ml", "tofutti rock 'n roll non-dairy ice cream cake 700ml", "tofutti organic vanilla non-dairy frozen dessert 750ml", "tofutti mango & passion fruit non-dairy frozen dessert 750ml", "tofutti organic strawberry non-dairy frozen dessert 750ml", "blue dragon tofu, firm silken style 349g", "taifun graffiti tofu terrine 200g", "danival organic tofu ravioli 670g", "danival organic lentils and tofu with vegetables 525g", "tofutti sour supreme 227g"],[],[]]

the first item is the term that the user entered, then you have an array of suggestions, then an optional array of descriptions of the suggestions, then an optional array of urls for the array.

No comments: