あなたの会社のWebサイトのコンテンツは、絶えず更新され、ウェブサイトを増加し続けているとして、あなたはますます困難見つけたいものを発見していません。一方で、コンテンツは新しいコンテンツがリンクも使用することができないサイトを更新する予定である前に、保存された一方、増加し続けるです。あなたは私達のウェブサイトを検索するために当社または当社のお客様に、より便利で、あなたのサイトのために検索ボックスを追加することの思考の考えたことがあります。あなたがそう思うならば、弾性サイト内検索は、あなたの答えになります。あなたは、あなただけの簡単な設定が完了することができます必要がある、多くの作業を行う必要はありません。やるべき仕事の弾性残り。使用弾性サイト内検索では、あなたのウェブサイトにあなたのウェブサイト、弾性サイト内検索クローラーのURLを提供する必要があり、生産データを検索することができます。

学ぶことなく - （旧Swiftypeサイトの検索として知られている）弾性サイト内検索は、強力なWeb検索を構築するために必要なツールを提供します。メンテナンスフリーの検索は、コンテンツ新鮮を可能にし、直感的なカスタマイズと強力な解析は、検索の関連性を完全に制御できます。これらのすべてはElasticsearchの大規模なサポートされています。

あなたは、強力な検索バックエンド+うまく設計されたUIを必要としています。サイトの目的や規模に応じて、検索が重要な機能は、ユーザーがすぐに必要な情報を見つけることができかもしれません。簡単に関連性の高い検索結果を提供するために建物をElasticsearchが、ビルドのバックエンドへの検索だけで就職活動の経験の一部を実現します。いいえ直感的な検索インターフェースは、ユーザーが検索エンジンの完全な値を取得していないかもしれません。

弾性サイト内検索（旧Swiftypeサイト内検索として知られている）は、完全に検索エンジンを処理するサービスとしてバックエンドを検索し、我々はまた、あなたがうまく設計された検索のUIを構築するのに役立ちます。私たちは50億のクエリ上で10,000人以上の検索エンジンの生産、毎月のサービスをサポートすることを可能にするサイト検索を構築する弾性スタックに基づきます。それは我々がLyft、AT＆T、Twilio、助けたので、それを言うことは安全だアサナ私たちは一つや検索に2つのことを学びましたので、年間で、ファーストクラスの検索体験を提供し、このようなサムスンのような小さな企業を。あなたはより多くのSwiftypeアーキテクチャおよびスタックの回復力を使用する方法について学習したい場合は、「参照してくださいelasticsearchでSwiftypeの技術の旅を。」

弾性サイト内検索では、検索を検索するための3つの簡単な手順を使用しています。弾性サイト内検索の強力な検索が容易になります。ない「上級開発者の単純な」シンプルですが、単純な「への人のための単純な」。調整するためにクロール、ドラッグ＆ドロップにクリックしてください。参照してください？シンプル。


あなたのウェブサイトのアドレスを入力し、強力な「サイト内検索」は、ハンドルにコンテンツの残りの部分を検索してみましょう。	Elasticsearchを搭載し、検索ボックスを追加するために、あなたのサイトに数行のコードを実行します。	微調整には、ユーザーの検索体験を重量と同義語を増強することによって。

次のチュートリアルでは、我々は我々のサイト内検索の一つを作成する方法を詳細に説明します。

あなた自身のウェブサイトを作成します。

私たちのショーを尊重するために、私は自分自身のウェブサイトの1を作成しました。あなたはサイトのコードをダウンロードするには、以下の方法に従うことができます。

git clone https://github.com/liu-xiao-guo/the-example-app.nodejs

私たちは、アプリケーションをダウンロードしたら、私たちは、インストールするには、次のコマンドを使用することができます。

npm install

インストールしたら、私たちは私たちのサーバーを実行するには、次のコマンドを使用することができます。

npm run start:dev

当社のサーバーは、ローカルホストのポート3000で実行されていることを示している以上。私たちは、ブラウザに入力された3000：localhostを：

我々は我々が正常に稼働してサーバーを入れている、上から見ることができます。

これはnodejsサイトはフレームワークを表現しています。当社のウェブサイトは、サイト内検索サイトにアクセスすることができるようにするために、我々は、オンライン公共の場でそれを入れて、アクセスできるドメイン名を与えることができます。私の場合のために、私が使用しnatapp.cn。あなたが好きなドメイン名を選択してください。私たちは、自分のコンピュータ上で実行されているこのnodejsアプリケーションを置くことができます。ピーナッツの殻のようないくつかの開発者のために、また、ウェブサイトを参照することができhttps://www.oray.com/これを実行します。

私は私のnatappアプリケーションから実行します。

3000 http://liuxg.natapp1.cc上にマッピング：上記では、我々は我々のアプリケーションが正常に私たちの127.0.0をnatappされていることがわかります。私たちは、ブラウザで独自のURLを入力します。

上記では、我々は成功したURLを働いていることがわかります。

弾性サイト内検索アカウントを作成し、Swiftypeにプログラムされたデータ

あなたは自由に起動することができ、14日間の試用期間登録するに。セットアップ中に、「サイト内検索は、」あなたのWeb URLを入力するように要求されます。あなたのドメインがクロールされます、そして、あなたの文書がインデックス化されます。

我々が正常に登録が完了したら、我々は対処できhttps://app.swiftype.com/loginログインします。

など私がログインした後、我々は以下の画像を見ることができます：

私たちは、「選択したサイト内検索を」：

私たちは「をクリックしてCREATE A NEW ENGINE」ボタン：

上記のURLで当社のウェブサイトを入力します。その後、我々は「をクリックしてのURLを確認します」：

私たちは、エンジン名を入力し、「上をクリックしますCREATE ENGINE」ボタン：

上記のショーは、当社のエンジンが正常に作成されていること。私たちは「をクリックすることができますインストール検索」メニュー：

上記のチャートから、我々が見ることができ、私たちのサイトがクロールされているサイト内検索がインデックス化されています。等の当社のウェブサイトが疲れクロールされ、我々は以下の画像を見ることができます：

この時間は、我々はをクリックして「コンテンツ」メニュー、我々は見ることができます：

私達は私達のウェブサイトの内容が正常に登ってきた、と独自の指標を確立していて見ることができる以上のことから。私たちは、上記にできるフィルタページ私たちは、このようなハローなどの検索ボックスにしたいキーワードを検索します

当社は、リンクの多くが出て記載されています見ることができます。私たちはをクリックすることができINSPECTボタンを：

私たちは、上でクリックすることができます詳細の表示このリンクの詳細を表示するボタン。

ここでは、自分自身を開発している左側の他のコンテンツです。

Webアプリケーションの検索ボックスプラス

完全にswiftype.comウェブサイト上でこれまでのところ、我々はすべての作業が、ほとんどの場合には、実際に我々はより多くの私たちは、実際のWebアプリケーションに適用される経験を検索します。私たちは、アプリケーション検索ボックスを追加します。この目的のために、我々はチュートリアル「に従うjQueryのプラグインのガイドを私たちの演習を行うために」。私たちは、ショーへの単純な検索ボックスを実装します。私たちは、nodejsアプリケーションをlayout.pugファイルを開きます。それは、次の場所にあります。

$ ls views/layout.pug 
views/layout.pug

私たちは、最初に注釈を付けている以下の3つの文を削除します。

声明上記三日は、私達のページのそれぞれの検索入力ボックスを作成します。そして、正しく動作するGoogleの検索ボックスを作ることができるようにするために、我々は最初のapp.swiftype.comウェブサイトで私たちのエンジンキーを取得する必要があります。

私たちは、LIBディレクトリ内のsite_search.js埋めるために、このエンジンキーを呼び出します。

$ ls lib/site_search.js 
lib/site_search.js

site_search.js塗りつぶした後、この次のとおりです。

$(function() {
  $('#st-search-input').swiftypeSearch({
    resultContainingElement: '#st-results-container',
    engineKey: 'YourEngineKey'
  });
});

私たちは、アプリケーションを再実行します：

上記の当社のアプリケーションの表示画面。今回我々は、ハローのように、我々は上記の検索に必要なキーワードを入力します。

私たちは、返される結果のいずれかをクリックすることができ、我々はハロー入力したとき、私たちは私たちのウェブページを検索結果の一部が存在していたこと上記を参照することができます。例えば、上記のリストをクリックして「こんにちはのSDK -例アプリケーションで」

明らかに、これはGoogleの検索結果のページです。

これまでのところ、あなたはああを冷却されていません！私たちは、少量のコードをしましたが、私たちのサイトの可用性が大幅に改善されます。

ディスプレイに結果のポップアップを追加します。

上記では、サイトの上部に表示するためにGoogleの検索結果を置きます。開発者は、CSSによって表示するように続けることが私たちのお気に入りの位置に、このボックスを置くことができます。これは、慎重に、開発者に任されています。このセクションでは、検索結果を表示するように表示するために別の方法を使用します。

私たちは、LIBディレクトリ内のoptions.jsというファイルを見つけることができます。

$ ls lib/options.js 
lib/options.js

ファイルの内容は、私たちは中app.swiftype.comから見つけることができます。

場所は上記の赤丸で囲まれたことをしてくださいノート。私たちは、コードの一部がoptions.jsファイルにcopyedされていることを置きます。<スクリプト...>と</ SCRIPT>セクションをコピーしないことに注意してください。

我々はまた、layout.pugを変更する二つの文は注釈が付けられ取り除きます。変更されたファイルを以下に示します。

等の変更、後に、私たちは私たちのサーバーを再実行します。

私たちは、上記の「こんにちは」と入力し、次のように入力します。

上記では、ポップアップボックスを見ることができます。これはGoogleの検索結果が含まれています。例：アプリケーションを - 私たちは、このようなこんにちはContentful上記のように、検索されるリンクをクリックすることができます

検索結果をカスタマイズします

弾性サイト内検索は、クエリごとのカスタム結果（結果ランク付け）に基づいて検索することができ、ウェイト（重り）のデータ型を調整し、ダッシュボードを通じて同義語（同義語）のセットを作成します。検索エンジンの関連性のためのプログラムで制御を完了するためには、使用することができますSwiftypeのAPIを。