オートコンプリートについて

オートコンプリートの様々な領域を設定して、オートコンプリートが有効な検索フォームの生成を制御したり、オートコンプリートが有効な検索フォームの一部として含まれるautocomplete_data.jsファイルを制御したりできます。

オートコンプリートについて

ファイル autocomplete_data.js は再生成され、オートコンプリートセットアップページで保存された変更があるたびに検索コンテンツネットワークに公開されます。

オートコンプリートの設定

オートコンプリート対応の検索フォームおよびファイルの生成を制御するオプションを設定および設定できます。

オートコンプリートを設定した後、結果として得られるHTMLソースをレビュー用に表示できます。 HTMLソースは、Webサイトのページにコピー&ペーストするものです。

詳しくは、検索フォームが表示されるとおりに プレビューするを参照してください。.

「オートコンプリートWordリストの 設定」を参照してください。

詳しくは、オートコンプリートCSSの 設定を参照してください

オートコンプリートを設定するには

  1. 製品メニューで、/をクリックし DesignAuto-CompleteAuto-Complete Setup

  2. ページで、目的のオプションを設定 Auto-Complete Setup します。

    検索フォームがユーザーの 目的に合わせて表示されるようにプレビューするものも参照してください。.

    オプション

    説明

    提案の最大数

    オートコンプリート提案リストに表示する項目の最大数を指定します。

    最小入力文字数

    顧客がオートコンプリート検索フォームに入力しなければ、サーチクエリが表示されない文字数を指定します。

    最大キャッシュエントリ数

    顧客のブラウザーにキャッシュするために以前に要求したオートコンプリートの提案の最大数を指定します。 通常、この設定はデフォルトの1000のままにしてください。

    このオプションを0に設定すると、ブラウザーのキャッシュを完全に無効にできますが、これはお勧めしません。

    フォーム名

    オートコンプリート対応検索フォームの「form」タグの「name」属性を指定します。 例:

    <form name="SiteSearch" method="get" action="https://sp1004337c.guided.t1.atomz.com"ターゲット="_blank">

    ここで、 SiteSearch はフォームタグのname属性です。

    DivタグID

    オートコンプリート対応検索フォームの"div"タグのID属性を指定します。 例:

    <div id="autocomplete">

    ここで、 オートコンプリートはdivタグの属性です。

    Input tag ID

    オートコンプリート対応検索フォームの「input」タグのID属性を指定します。 例:

    <input type="text" id="q" name="q" />

    ここで q は、inputタグのid属性です。

    シャドウを表示

    オートコンプリート候補リストに化粧用のドロップシャドウを追加します。

    フレーズの先頭にのみ一致

    入力テキストの先頭に一致する結果のみを提示します。

    UTF-8文字セットのサポート

    用語の非ASCII文字を正しく処理する。

  3. クリック Save Changes.

  4. (オプション)次のいずれかの操作を行います。

オートコンプリートWordリストの設定

オートコンプリートで顧客に対して表示する語句のリストを提案として設定します。

「オートコンプリートの 設定」を参照してください。

詳しくは、オートコンプリートCSSの 設定を参照してください

オートコンプリートワードリストを設定するには

  1. 製品メニューで、/をクリックし DesignAuto-CompleteAuto-Complete Word List

  2. ページで、目的のオプションを設定 Auto-Complete Word List します。

    詳しくは、検索フォームが表示されるとおりに プレビューするを参照してください。.

    オプション

    説明

    人気のある検索期間

    顧客の最近の検索で使用された語句を含める期間を制御します。

    最大検索数

    オートコンプリートの単語リストに含める検索語句の最大数を制御します。 最も人気の高いトップワードやフレーズが含まれます。

    フィールド名

    各フィールド名は、インデックス値を含める1つのフィールドの名前を定義します。 フィールド名を追加または削除するには、+と — を使用します。

    最大値

    選択したフィールド名に対して許可するフィールド値の最大数を定義します。 最も多く参照されるトップ値も含まれます。

    こ追加れらの語句

    オートコンプリートの単語リストには、この領域に一覧表示されている単語とフレーズが入力されます。

    編集」をクリック してリストを表示したり、リストに単語やフレーズを追加したりします。 完了したら、「変更の 保存」をクリックし ます。

    これらの語句を削除する

    この領域のエントリは、オートコンプリートの単語リストには表示されません。

    編集」をクリック してリストを表示したり、リストに単語やフレーズを追加したりします。 完了したら、「変更の 保存」をクリックし ます。

    このリストでは正規式を使用できます。 このリストで正規式を指定するには、行の後に1つのスペースを続け、その後に正規式を続けて開始します。 regexp 正規式に一致する単語リスト内の行はすべて削除されます。

    重要:正規式は、他のアプリケーションで以前に使用したことがある場合にのみ使用してください。

    詳しくは、 正規式を参照してくだ さい。

    大文字と小文字を区別しない

    オートコンプリートワードリストの重複エントリで、英字の大文字と小文字のみが異なるエントリは削除されます。単語リストのエントリはすべて強制的に小文字に変換されます。

    オートコンプリートの提案を「最初の文字が大文字」または「すべて大文字」で表示する場合は、「/* styles for result item */」の下のオートコンプリートCSSコンテンツに、 text-transform : capitalize; または text-transform : uppercase; CSSテキストプロパティを追加します。

    詳しくは、オートコンプリートCSSの 設定を参照してくだ さい。

    再インデックス時に更新

    アカウントの再インデックスが成功するたびに、単語のオートコンプリートリストが自動的に再生成されます。

  3. クリック Save Changes.

  4. (オプション)次のいずれかの操作を行います。

    • をクリック History すると、行った変更がすべて元に戻ります。

    • 行っ Preview Word List た変更を保存するには、をクリックします。その後、オートコンプリート候補リストを確認できる Auto-Complete Word List Preview ページを開きます。 ページ上部近くにあるナビゲーションオプションを使用して、表示されるリストを確認し、調整します。 完了したら、をクリック Close して Auto-Complete Word List ページに戻ります。

      「Historyオプションの 使用」を参照してください。

    • クリック Live.

      ライブ設定の 表示を参照してください

    • クリック Push Live.

      詳しくは、 ステージ設定をライブにプッシュするを参照してください

オートコンプリートCSSの設定

オートコンプリートCSSを使用して、使用するオートコンプリートカスケードスタイルシートを設定します。

オートコンプリートCSSは、のコンテンツを制御し autocomplete_styles.cssます。このコンテンツはオートコンプリート対応の検索フォームの一部として含まれます。 ここで指定するCSSによって、オートコンプリートの提案リストが視覚的に表示されます。 可能な視覚的なプレゼンテーションのアイデアの例については、次を参照してください。

https://developer.yahoo.com/yui/examples/autocomplete/ac_skinning.html.

オートコンプリートWordリストの設定

オートコンプリートの設定

オートコンプリートCSSの設定が完了したら、検索フォームをプレビューして、指定したCSSが外観とレイアウトで許容可能かどうかを確認できます。

詳しくは、検索フォームが表示されるとおりに プレビューするを参照してください。.

重要:カスタムのオートコンプリートCSSを適用するには、HTMLコードに表示される2行目からコメントタグを削除する必要があります。 次に、検索フォームを含むページのheadセクション内に同じ行を移動します。

「検索フォームのHTMLコードを…に コピーする」を参照してください。.

オートコンプリートCSSを設定するには

  1. 製品メニューで、/をクリックし DesignAuto-CompleteAuto-Complete CSS

  2. テキストフィールドに、オートコンプリート提案リストに関連付けるカスケードスタイルシートの情報を貼り付けるか、入力します。 Auto-Complete CSS

  3. クリック Save Changes.

  4. (オプション)次のいずれかの操作を行います。

検索フォームがWebサイトに表示されるとおりにプレビューする

オートコンプリートCSSとオートコンプリートCSSの設定に基づいて、WebサイトにHTMLコードを追加する場合の検索フォームの表示をプレビューできます。

「オートコンプリートの 設定」を参照してください。

詳しくは、オートコンプリートCSSの 設定を参照してください

「検索フォームのHTMLコードを…に コピーする」を参照してください。.

「検索フォームでのコレクションの 使用」を参照してください。

フォーム でのフレームの使用を参照してください

詳しくは、「アドバンス検索フォーム の例」を参照してください。

詳しくは、HTMLコードからの 詳細検索を参照してください

アドバンス検索フォームテンプレートコード」を参照してください。

Webサイトに表示される検索フォームをプレビューするには

  1. 製品メニューで、/をクリックし DesignAuto-CompleteSearch Form
  2. (オプション)をクリック HTML code して、Webサイトのページにコピー&ペーストするHTMLを表示します。

検索フォームのHTMLコードのWebサイトのページへのコピー

オートコンプリートCSSとオートコンプリートCSSの設定に基づいて、WebサイトにHTMLコードを追加する場合の検索フォームの表示をプレビューできます。

「オートコンプリートの 設定」を参照してください。

詳しくは、オートコンプリートCSSの 設定を参照してください

「検索フォームのHTMLコードを…に コピーする」を参照してください。.

「検索フォームでのコレクションの 使用」を参照してください。

フォーム でのフレームの使用を参照してください

詳しくは、「アドバンス検索フォーム の例」を参照してください。

詳しくは、HTMLコードからの 詳細検索を参照してください

アドバンス検索フォームテンプレートコード」を参照してください。

検索フォームのHTMLコードをWebサイトのページにコピーするには

  1. 製品メニューで、/をクリックし DesignAuto-CompleteForm Source

    メモ

    フォームソースの form name= 値は変更しないでください。

  2. (オプション)次のいずれかの操作を行います。

    • オートコンプリートCSSを設定し、検索フォームにスタイルを適用する場合は、HTMLコードに表示される2行目からコメントタグを削除します。 次に、検索フォームを含むページのheadセクション内に同じ行を移動します。
    • パフォーマンスを最大にするには、HTMLコードの下部に表示されているタグを移動し、検索フォームを含む各ページのbodyセクションの下部に配置します。
  3. コードをコピーして、検索フォームを表示するWebサイトのWebページに貼り付けます。

このページ