サイトにGoogle Chromeのomnibox-searchサポートを追加するにはどうすればよいですか？

150

Google ChromeのアドレスバーにいくつかのURLを入力すると、「TABを押して$ URLで検索」というメッセージが表示されます。たとえば、ロシアのサイトhabrahabr.ruまたはyandex.ruがあります。Tabキーを押すと、検索エンジンではなく、そのサイトで検索できます。それを可能にするために私のサイトを作る方法は？たぶん、私は自分のサイトのページに特別なコードを書く必要がありますか？

— アブザック
ソース

では、私のサイトが検索エンジンであることをChromeに伝えるにはどうすればよいですか？

— Abzac

回答:

204

Chromeは通常、これをユーザー設定で処理します。（経由chrome://settings/searchEngines）

ただし、これをユーザー専用に実装する場合は、サイトにOSD（Open Search Description）を追加する必要があります。

Google ChromeのOmniBox [TAB]機能を個人のWebサイトで使用していますか？

次に、このXMLファイルをサイトのルートに追加し、<head>タグでそれにリンクします。

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

これで、ページへの訪問者は自動的にサイトの検索情報をChromeの内部設定に配置しますchrome://settings/searchEngines。

OpenSearchDescription XML形式の例

<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>

重要な部分は<url>アイテムです。 {searchTerms}ユーザーがオムニバーで検索したものに置き換えられます。

詳細はOpenSearchへのリンクです。

— element119
ソース

Firefoxとは異なり、ChromeはOpen Search Descriptionをウェブサイトのルートに配置した場合にのみ、それを検出することに注意してください。

— ヴァレプシロン2014

その「オムニボックス検索」をFirefoxで動作させる方法はありますか？

— JinSnow 2015年

ターゲットサイトのクエリボックスに直接つながるURLを見つける方法は？（グーグルで例えば翻訳）

— JinSnow

グーグル翻訳のための答えこれをあなたの検索エンジンに追加してください：translate.google.com/

— source

に検索エンジンを追加するchrome://settings/searchEnginesと、時間を節約できます。ありがとう！

— エドラスロペス

検索候補を使用したアドレスバーサポートの実装

@ element119による回答は完璧に機能しますが、検索候補とMozillaサポートをサポートするために少し調整されたコードを次に示します。

以下の手順に従って、サイトにオムニボックスサポートを実装してください。

次のコードを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>

search.xmlをサイトのルートにアップロードします。
次のメタタグをサイトの<head>タグに追加します

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

ドメインのURLを自分のドメインに置き換えてください。

— シャンイーペンコーシー
ソース

それはあります<SearchForm>か<moz:SearchForm>？SearchFormOpenSearchのドキュメントや、オンラインで見つけた他のすべてのリソースで使用して<moz:SearchForm>いるものは見つからないようです。

— Niels R.