各機能の実装例

search-0 他の検索窓に影響されない検索窓

        <mf-search-box
           ajax-url="https://finder.api.mf3stg.marsflag.com/api/v1/finder_service/documents/f1fddd3e/search"
           submit-text=""
           ignore-search-result
           doctype-hidden
           options-hidden
           placeholder="Site Search_test"
        ></mf-search-box>

search-1 普通の検索窓

検索結果画面へ
        <mf-search-box
          submit-text="submit_test"
          placeholder="placeholder_test"
          ajax-url="https://finder.api.mf3stg.marsflag.com/api/v1/finder_service/documents/f1fddd3e/search"
        ></mf-search-box>

search-2 検索条件選択用UIトグル

search-3 インテリアドバイザの表示件数3

        <mf-search-box
          ajax-url="https://finder.api.mf3stg.marsflag.com/api/v1/finder_service/documents/f1fddd3e/search"
          :suggest-max=3
        ></mf-search-box>

search-4 ajaxURLに対応する従来の検索画面に遷移

search-5 検索条件選択用UIにリンクを使う場合

        <mf-search-box
          ajax-url="https://finder.api.mf3stg.marsflag.com/api/v1/finder_service/documents/f1fddd3e/search"
          pagemax-csv="10,50"
          use-links
        ></mf-search-box>
      

search-6 文書種別選択用UIを非表示にする、カテゴリの属性変更

        <mf-search-box
          ajax-url="https://finder.api.mf3stg.marsflag.com/api/v1/finder_service/documents/f1fddd3e/search"
          doctype-hidden
          force-category-csv="MARS FINDER, MARS QUALITY"
          category-default="MARS FINDER"
          category-all-text="All category_test"
        ></mf-search-box>

search-7 カテゴリ選択用UIを非表示にする、ソート順の属性変更

        <mf-search-box
          ajax-url="https://finder.api.mf3stg.marsflag.com/api/v1/finder_service/documents/f1fddd3e/search"
          category-hidden
          sort-default="1"
          sort-text-csv="match_test,recent_test"
        ></mf-search-box>

search-8 ソート選択用UIを非表示にする、表示件数の属性変更、カテゴリと文書種類のcsv設定

        <mf-search-box
          ajax-url="https://finder.api.mf3stg.marsflag.com/api/v1/finder_service/documents/f1fddd3e/search"
          sort-hidden
          pagemax-csv="10,50"
          pagemax-default="50"
          category-csv="MARS FINDER, MARS QUALITY, test_mfx"
          doctype-csv="html_test,pdf,doc,xls,ppt"
        ></mf-search-box>

search-9 表示件数選択用UIを非表示にする、画像サイズの属性変更

        <mf-search-box
          ajax-url="https://finder.api.mf3stg.marsflag.com/api/v1/finder_service/documents/f1fddd3e/search"
          pagemax-hidden
          imgsize-default="3"
          imgsize-text-csv="none_test,small,medium,large"
        ></mf-search-box>

search-10 画像サイズ選択用UIを非表示にする、文書種別の属性変更

        <mf-search-box
          ajax-url="https://finder.api.mf3stg.marsflag.com/api/v1/finder_service/documents/f1fddd3e/search"
          imgsize-hidden
          doctype-all-text="All_test"
          force-doctype-csv="test,pdf"
          doctype-default="pdf"
        ></mf-search-box>

search-11 検索オプション非表示

search-12 input-title指定

search-13 target-blank指定

search-14 1.0.3追加オプション disable-category-all

        <mf-search-box
          ajax-url="https://finder.api.mf3stg.marsflag.com/api/v1/finder_service/documents/f1fddd3e/search"
          disable-category-all
          category-default="MARS FINDER"
          force-category-csv="MARS FINDER, MARS QUALITY"
        ></mf-search-box>

search-15 1.0.3追加オプション disable-suggest-cursor

        <mf-search-box
          ajax-url="https://finder.api.mf3stg.marsflag.com/api/v1/finder_service/documents/f1fddd3e/search"
          disable-suggest-cursor
        ></mf-search-box>

page-1 トグルありのドリルダウン、キーワードランキング、関連ワード

page-2 初期状態トグルONのドリルダウン、キーワードランキング、関連ワード

page-3 リザルトフレームありのおすすめコンテンツ

page-4 リザルトフレーム無効のおすすめコンテンツ

page-5 ドリルダウン

page-6 キーワードランキング

page-7 関連キーワード

page-8 他のコンポーネントとは違うajaxURLを指定

page-9 1.0.1追加機能

        <mf-featured-contents
          ajax-url="https://finder.api.mf3stg.marsflag.com/api/v1/finder_service/documents/f1fddd3e/search"
          target-auto
          outbound-doc-class="example_outbound-doc-class"
          show-in-all-pages
        ></mf-featured-contents>

results-1 普通の検結果画面

        <mf-search-results></mf-search-results>
      

results-2 リザルトフレーム無効の検結果画面

      <mf-search-results
        disable-resultframe
      ></mf-search-results>

results-3 関連ワードを表示する検結果画面

results-4 検索結果ヘッダー2か所設置、ページャーが空白

      <mf-search-results
        :pager-item-count=2
        pager-pagenum-blank
      ></mf-search-results>

results-5 タイトル文字列中の 'MARS' を 'まーず' に置換する

results-6 各種言語対応

英語

日本語

中国語(簡体字)

中国語(繁体字)

韓国語

スペイン語

ポルトガル語

アラビア語

タイ語

イタリア語

インドネシア語

オランダ語

ギリシャ語

ドイツ語

トルコ語

フランス語

ベトナム語

ポーランド語

ラトビア語

リトアニア語

ロシア語

ペルシャ語

results-7 1.0.1追加機能

        <mf-search-results
          target-auto
          outbound-doc-class="example_outbound-doc-class"
          show-resultframe-on-hover
          :pcs-urls="[
            'https://www.marsflag.com/img/resp/mflogo_resp.gif',
            'https://www.marsflag.com/img/resp/mflogo_resp.gif',
            'https://www.marsflag.com/img/resp/mflogo_resp.gif'
          ]"
        ></mf-search-results>

results-8 1.0.3追加機能の確認

        <mf-search-results-header></mf-search-results-header>
        <mf-search-results-pager></mf-search-results-pager>

こちらにはmf-search-results-headerとmf-search-results-pagerが設置されていますが consoleにエラーがはきだされていないことを確認してください。

動作サンプル - 各機能の実装例

トップ > 動作サンプル - 各機能の実装例

リファレンスマニュアル内検索