Create A Simple IE8 Search Provider

IE8 is cool. Sure, laugh at me, but know your facts and be open minded – just for a minute. There are many new features and improvements in IE8. One of them is the updated search experience, and specifically the visual search and suggestions capabilities. No Microsoft tools or servers required to play in this game. If you can build the service, you can make a very compelling search experience, like eBay and Amazon have done.

However, if you can’t (or you can’t get it done today), then there is the simple search experience alternative. I’m not sure what the exact name for this is, but in my talks with customers, I call it a “simple search provider”, since it doesn’t do the new cool stuff (search suggestions, and visual icons). Let me describe how to build this.

Let’s first cover a few basics:

The Simple Search Provider

So, let’s say that you just want to build a simple search experience – for whatever reason, like it’s not your site, you haven’t and/or can’t build the proper search service, etc. That’s when you need to consider this option (and it’s not a new idea). This solution assumes that the target web site has a search page that accepts querystring parameters.

First, let’s get some help on creating the XML. Go to the IE8 Gallery Create Search page, and paste in your search URL with a search value of “TEST”. For example, here is the MSDN search URL: https://social.msdn.microsoft.com/Search/en-US?query=TEST

Notice that I’ve included the search text TEST, and I do this per the instructions on the page. They are using this to determine where the search parameters are in the URL.

After providing a name of your search provider, you can click on “View XML” and you’ll see something like the following (note the removal of TEST, and the replacement searchTerms):

<?xml version="1.0" encoding="UTF-8" ?>

<OpenSearchDescription xmlns="https://a9.com/-/spec/opensearch/1.1/">

<ShortName>Jon’s MSDN Search</ShortName>

<Description>Jon’s MSDN Search provider</Description>

<InputEncoding>UTF-8</InputEncoding>

<Url type="text/html" template="https://social.msdn.microsoft.com/Search/en-US?query={searchTerms} " />

</OpenSearchDescription>

 

The cool thing about this “Create Search” page is that you can also choose to install the search provider into your IE8 directly. Nice touch, I’d say.

Now you can quick pick your search provider, type in some search text, hit ENTER, and then IE8 will hit that search page and pass in the search parameters. For clarification, “quick pick” is my term for changing search providers.

If the newly created search provider is for your site, then go to the IE8 Gallery and register your search provider. It’s FREE. Congratulations, you have simple search ready for your users/customers. And when you have the cool search experience built, come back and update the gallery.

Missing ICON Solution

Depending on your site, you might end up without a icon in the quick pick list, so IE8 assigns the plain icon (a magnifying glass). This usually happens because the targeted site does not have the FAVICON in the default place (various arguments here as to the correctness are ignored for this conversation). There’s a couple of easy ways to fix this problem. One is to copy the icon to the root folder of the web site. When this is not possible (for example, not your site, or using a CMS), there is a solution. The OpenSearch specification provides a way to express the URL to the icon:

<Image height="16" width="16" type="image/icon">https://YourSiteURL/image/favicon.ico</Image>

Problem solved!

Adding Preview, if you’re really lucky

Last pointer for today. If you’re search results page is really small, this might be a nice addition. Hopefully, you’re familiar with the preview capability in IE8 accelerators

  • highlight some text on a web page,
  • click the accelerator icon,
  • let the mouse hover over an accelerator that supports preview,
  • and a window appears with the accelerator results.

This is a very nice browsing experience.

You’ll also note that the search providers show up in the accelerator list. So, one can highlight some text, click on a search provider in the accelerator list, a new tab fires up, and IE8 is hitting the targeted search page. But wait, there’s more.

If you have a small search results page (or can build a small search results page, which I highly recommend as a crowd pleaser), then there’s another cool option for you. You can tell IE8 that you have the preview window capability in your search experience by adding the following line to your search provider XML file:

<ie:PreviewUrl type="text/html" template=" https://YourSiteURL/search/?q={searchTerms}"/ >

To use this IE8 customization, you’ll also need to add the namespace declaration at the top. So, it should look like this:

<OpenSearchDescription xmlns=" https://a9.com/-/spec/opensearch/1.1/" xmlns:ie=" https://schemas.microsoft.com/Search/2008/" > …

And now you get the accelerator preview experience. This is another very nice addition, that your users/customers will appreciate.

Conclusion

IE8 really is innovative, and you can provide a nice search experience in a phased approach. The first step, the simple search provider, can be built in minutes.

As usual, if you have an interesting IE8 add-on, let me know about it. I’m always looking to promote my customers’ cool IE8 add-on’s.