MARS FINDER 2.0 Custom Element Version Setting Up Manual (2020/06)

MARS FINDER 2.0 Custom Element Version Setting Up Manual (2020/06)

MARS FINDER 2.0 Custom Element Version
The custom element version is one of the version extensions of Mars Finder 2.0search service which enables our customer to allocate the search box and search result anywhere just with 2 steps. 

Easy Setting Up of Custom Element Version
★Files to prepare
-html file of the search box（for example: window.html）
-html file of the search result (for example: result.html)

★Flow of Navigation
If a user click the button of the html file of the search box（for ex: window.html）, the browser navigates to the result page (for example: result.html).  


If the user click the button of the html file of the result page, the browser will refresh the result page and show the result.



STEP 1 ★Inserting tags in the search box html file
1) Insert the tag of following square in the search box html file (for ex: window.html) just in between <head> and </head>

<!-- ↓CSS -->
<link href="//c.marsflag.com/mf/mfx/1.0-latest/css/mfx-sbox.css" rel="stylesheet" type="text/css" media="all" charset="UTF-8">


2) Insert the tag of following square in the search box html file (for ex: window.html) just in between <body> and </body>
<div class="mf_finder_container">

<!-- Custom element for search box-->
<mf-search-box
submit-text=""
ajax-url="//xxxx.marsflag.com/xxxx__xxxx__xxxx/x_search.x"
serp-url="//xxxx.marsflag.jp/result.html#/"
></mf-search-box>

</div>
※The blue part may differ based on the each client?s information
※The green part should be the pass name or file name of the search result html（full pass recommended）


3) Insert the tag of following square in the html file of sarch box (for ex: window.html) just in front of the </body> tag.  
<script src="//c.marsflag.com/mf/mfx/1.0-latest/js/mfx-sbox.js" charset="UTF-8"></script>


STEP 2 ★Inserting the tags in the search result html file
1) insert the tags in the following square in the html file of the search result (for ex: result.html) just in between <head> and </head>
<!-- ↓CSS -->
<link href="//c.marsflag.com/mf/mfx/1.0-latest/css/mfx-serp.css" rel="stylesheet" type="text/css" media="all" charset="UTF-8">

2) insert the following tags in the square in the html file of the search result (for ex: result.html) in between <body> and </body> tag 　　
<div class="mf_finder_container">
        <!-- custom element tag of the search box -->
        <mf-search-box
           submit-text=""
           ajax-url="//xxxx.marsflag.com/xxxx__xxxx__xxxx/x_search.x"
        ></mf-search-box>
        <!-- element for ZUBA-KEN -->
        <mf-zubaken></mf-zubaken>
        <!-- element for organic -->
        <mf-search-results></mf-search-results>
</div>
※The bule part may differ based on the each client?s information

3) insert the tag of following square in the html file of search result (for ex: result.html) just in front of the tag </body>
<script src="//c.marsflag.com/mf/mfx/1.0-latest/js/mfx-serp.js" charset="UTF-8"></script>
It's already done!

★The Rendering Image 
-html file of the search box（for ex: window.html)


-html file of the search result  (for ex: result.html)


    • Related Articles

    • 2024.07.18 【復旧】MARS FINDER 3.0 の障害について

      MARS FINDER 3.0 におきまして、下記の障害が発生しておりましたが、現在は復旧し、通常通りサービスをご利用いただけます。 ■影響サービス MARS FINDER 3.0 サービス ■障害発生期間 2024年07月17日(水) 10:20頃 ～ 2024年07月18日(木) 09:49頃 ■障害内容 弊社が提供しております MARS FINDER3.0サービスをご利用の一部のお客様につきまして、検索窓が表示されない状態が発生しておりました。 ...

    • 2024.11.05　[MARS FINDER 3.0]　リリース情報

      以下の項目におきまして、リリースと機能改善を行いました。 MARS FINDER 3.0 　・カスタムエレメントのアップデートを行いました。 　・一時的に無効化しておりましたカスタムエレメントVer.1とVer.2の切り替え機構を再開しました。

    • MARS EmoTechの利用にはMARS FINDERが必要ですか？

      はい。 MARS EmoTechは、サイト内検索サービス「MARS FINDER」と連携することで、お客様サイトに強いAIチャットサービスを提供するものとなります。 MARS Emotechの管理画面にて、連携するMARS FINDERのサービスを選択してご利用ください。

    • 2024.07.17　[MARS FINDER 3.0]　リリース情報

      以下の項目におきまして、リリースと機能改善を行いました。 MARS FINDER 3.0 　・カスタムエレメントVer.2をリリースしました。 　・クローラ即時実行機能を追加しました。 　・サービス一覧画面にてサービスの非公開が判るようにしました。 　・検索DB詳細画面のレイアウトを調整しました。

    • 2024.01.11　[MARS Platform/MARS FINDER 3.0]　リリース情報

      以下の項目におきまして、リリースを行いました。 MARS Platform 　・管理画面から組織削除時のエラーを修正しました。 MARS FINDER 3.0 　・銀行決済時、契約プラン変更できない件を修正しました。 　・同義語画面のレイアウト崩れを修正しました。