How to add google chrome omnibox-search support for your site?

Solution 1:

Chrome usually handles this through user preferences. (via chrome://settings/searchEngines)

However, if you'd like to implement this specifically for your users, you need to add a OSD (Open Search Description) to your site.

Making usage of Google Chrome's OmniBox [TAB] Feature for/on personal website?

You then add this XML file to the root of your site, and link to it in your <head> tag:

<link rel="search" type="application/opensearchdescription+xml" title="Stack Overflow" href="/opensearch.xml" />

Now, visitors to your page will automatically have your site's search information placed into Chrome's internal settings at chrome://settings/searchEngines.

OpenSearchDescription XML Format Example

<OpenSearchDescription xmlns="http://a9.com/-/spec/opensearch/1.1/" xmlns:moz="http://www.mozilla.org/2006/browser/search/">
<ShortName>Your website name (shorter = better)</ShortName>
<Description>
Description about your website search here
</Description>
<InputEncoding>UTF-8</InputEncoding>
<Image width="16" height="16" type="image/x-icon">your site favicon</Image>
<Url type="text/html" method="get" template="http://www.yoursite.com/search/?query={searchTerms}"/>
</OpenSearchDescription>

The important part is the <url> item. {searchTerms} will be replaced with what the user searches for in the omnibar.

Here's a link to OpenSearch for more information.

Solution 2:

Implementing omnibox support with search suggestions

The answer given by @element119 works perfect but here is a slightly tweaked code to support search suggestions as well as Mozilla Support.

Follow the steps below to implement omni box support for your site.

  1. Save the following code as search.xml
<OpenSearchDescription xmlns="http://a9.com/-/spec/opensearch/1.1/" xmlns:moz="http://www.mozilla.org/2006/browser/search/">
  <script/>
  <ShortName>Site Name</ShortName>
  <Description>Site Description (eg: Search sitename)</Description>
  <InputEncoding>UTF-8</InputEncoding>
  <Image width="16" height="16" type="image/x-icon">Favicon url</Image>
  <Url type="application/x-suggestions+json" method="GET" template="http://suggestqueries.google.com/complete/search?output=firefox&amp;q={searchTerms}" />
  <Url type="text/html" method="GET" template="http://yoursite.com/?s={searchTerms}" />
  <SearchForm>http://yoursite.com/</SearchForm>
</OpenSearchDescription>
  1. Upload search.xml to the root of your site.

  2. Add the following meta tag to your site's <head> tag

<link rel="search" href="http://www.yoursite.com/search.xml" type="application/opensearchdescription+xml" title="You site name"/>

Make sure to replace the domain urls with your domain.