マニュアル

サイトサーチの設定、設置、運用を開始するために必要なカスタマイズ方法について

このページでは、サイトサーチの契約後、【 サイトサーチを設定し、検索結果と検索ボックスの見た目をカスタマイズし、検索結果に優先的に表示する記事を設定して運用を開始する 】方法をまとめてご案内します。

サーチエンジンの設定

まず、サーチエンジンの設定を行います。契約(トライアル)しているサーチサービスの新しくサーチエンジンを作るをクリックして

サーチエンジンの作成ページを表示させます。

サーチエンジン作成ページでは以下の設定を行います。

  • タイトル:サーチエンジンの名前です。管理画面でわかりやすいように名前をつけます。
  • サイトURL:実際に表示されるドメイン名を入力します。例:https://example.tv/

    ワイルドカードの「*(アスタリスク)」を使った設定ができます。
    例)https://*.example.com
    上記のような設定をした場合、下記のような URL のサイトでご利用いただけます。

    • https://example.com
    • https://www.example.com
    • https://foo.example.com
  • 検索対象
    検索対象にしたいURLを指定します。そのURLを含むか除外するかも選択可能です。また、Googleカスタム検索エンジンのアノテーションから検索対象をインポートすることも可能です。
  • 使用言語:日本語、英語、繁體中文の3言語から選択できます。
  • 検索結果の件数:30 から 100 までの任意の件数を設定できます。
  • 検索結果にサムネイル画像を表示:検索結果にサムネイル画像を表示します。この設定が有効になっている場合でも、サムネイルが表示されない場合もあります。
  • 検索結果をモーダルウィンドウで表示:検索結果を同じページ内でモーダルウィンドウに表示します。
  • 検索結果のページ移動:有効にするとサイト内の特定のページに移動させることができるので、検索結果ページを作りそこで表示することができます。
    設定しない場合は、同じページ内に検索結果が表示されます。
    ※検索結果を作成した検索結果ページに表示する場合は、検索結果ページにも埋め込みコードを埋め込む必要があります。

    検索結果を別ページに表示させる場合は、noindex 指定を推奨します

  • 検索結果の挿入場所:検索結果をページ内のどこの場所に表示するか指定できます。検索結果を表示する箇所のHTMLタグのIDを入力してください。
  • 検索結果の並び順:検索結果の並び順を選択することができます。
  • ユーザー辞書:検索キーワードの表記揺れを修正できます。ユーザー辞書機能のユーザー辞書機能の利用方法
  • ディレクトリによる絞り込み:検索範囲をディレクトリで指定できるように設定できます。チェックを入れて有効にすると設定欄が表示されます。
    サイトサーチ:ディレクトリによる絞り込み
    公開サイト側では検索ボックスの下にディレクトリを絞り込むためのチェックボックスが表示されます。
  • プレースホルダー:検索ボックスの入力エリアに表示されるテキストを設定します。

埋め込みコードの取得

設定を行い、保存すると埋め込みコードが表示されます。枠内右側のアイコンをクリックするとソースコードをコピーできます。

サイトへの設置

続いて実際のサイトへ設置する具体的な方法をご紹介していきます。

まず、コピーした埋め込みコードを、検索窓を表示したい場所へ貼り付けます。(ヘッダーやサイドバーフッターなどサイトによって変わるかと思います。)

続いて今回は、検索結果のページ移動を有効にしたので検索結果のページを作成します。

URLはドメインの直下に/search-result.html といったように設定したので、サイトの同じ階層に同じファイル名で検索結果のページを作成します。
※検索結果を作成した「検索結果ページ」に表示する場合は、検索結果ページにも基本設定の「埋め込みコード」を埋め込む必要があります。

検索結果を別ページに表示させる場合は、noindex 指定を推奨します

検索結果の挿入場所で指定したidをそのページ内に指定させるのがポイントになります。

上記のように指定することにより、任意の場所に検索結果を表示することができます。

検索ボックス、検索結果の見た目のカスタマイズ

検索ボックスと、検索結果のHTML構造は決まっているので、それにあわせてCSSで見た目を自由にコントロールすることができます。

詳しくは以下のマニュアルをご覧ください。

検索ボックスと検索結果の見た目をカスタマイズする | マニュアル | MovableType.net サイトサーチ

Google アナリティクスと連携

Google アナリティクスと連携することで、いつどんな検索キーワードでどんなページにたどり着いたのかを調べることができます。

詳しくは以下のマニュアルをご覧ください。

Google アナリティクスと連携し、サイト内検索のデータを閲覧する方法 | マニュアル | MovableType.net サイトサーチ

検索対象を特定のフォルダ配下に限定する

サイト内の特定のフォルダ配下を検索対象にする、ということが可能です。
やり方は二つあり、Google側で設定する方法と、埋め込みコード内で指定する方法です。

Programmable Search で設定する場合

Programmable Search の設定画面の検索するサイトを example.com/blog/ といったように指定します。

埋め込みコード内で設定する場合

埋め込みコード内のidがmt-site-searchとなっているdivタグの中に以下の記述を追加します。

data-filter-pathname="/blog/"

/blog/の部分が指定したい任意のパスになります。

Googleでは復数のサイト(フォルダ)を指定することができるので、通常はGoogle側で設定することをおすすめします。

優先記事機能で特定のキーワードで任意のページを上に表示

検索結果の表示順番は基本的にはGoogleのエンジンによって決まります。しかし、このキーワードの場合はこのページを一番上に表示したいなぁ、、といった場合には独自機能の優先記事機能が利用できます。
※ 優先記事機能はスタンダードプラン以上でご利用いただけます。

優先記事は、左メニューの優先記事>投稿新規から作成できます。

  • 優先記事のタイトル:検索結果で表示させる記事のタイトルを入力
  • 記事URL:優先記事のリンク先URLを設定
  • 概要(記事の要約):検索結果に表示される記事の概要を入力
  • キーワード:ここで設定したキーワードの検索結果で優先的に表示される(スペース区切りで複数設定可能)
  • サーチエンジン:この優先記事を利用するサーチエンジンにチェックを入れる

上記のようにキーワードごとに優先的に表示したい記事を指定することができます。

以上で、運用を開始するまでに必要な一通りの設定と設置は完了です。

2つの検索ボックスを1ページ内に設置する場合