ショップの画面の隅にチャットのアイコンを出し、選択肢で用件を聞いて、最後に連絡先を受け取る。この形のチャットボットは、外部のチャットサービスを契約しなくても、EC-CUBE のプラグインで作れます。

この記事では、チャットボットプラグイン「Grip Chatbot」の使い方を、インストールから順に説明します。メニュー名やボタン名は、プラグインの管理画面の表記に合わせています。

Grip Chatbot は、当サイト（ワプラボ）を運営する ibis studio株式会社が開発・販売しているプラグインです。オーナーズストアでは「ノーコードでチャットボット(シナリオ会話)を作成・配信するプラグイン」という名称で掲載しています。他の選択肢との違いは、比較記事で別にまとめています。

動作環境

• EC-CUBE 4.2系／4.3系（販売ページの対応バージョンの記載）
• PHP 8.1以上（販売ページの記載）
• AI 機能を使う場合のみ、Google の Gemini API キー
• grip space 連携を使う場合のみ、grip space のアカウント（連携キー）

EC-CUBE 4.0系・4.1系では動きません。オーナーズストアの対応バージョンは 4.2系（4.2.0〜4.2.3-p2）と 4.3系（4.3.0〜4.3.1-p1）で、PHP 8.1以上が必要です。

インストールと有効化

手順は EC-CUBE 4 のプラグイン共通です。オーナーズストアで購入したものを入れるか、ファイルをアップロードし、インストールしたあとに有効にします。

1. EC-CUBE オーナーズストアで購入する
2. 管理画面の「オーナーズストア」→「認証キー設定」で、認証キーを登録する（登録済みなら不要）
3. 「オーナーズストア」→「プラグイン」→「プラグインを探す」から、購入済みのプラグインをインストールする
4. 「プラグイン一覧」で有効にする

ファイルから入れる場合は、「プラグイン一覧」の「アップロードして新規追加」を使います。有効にすると、左メニューに「チャットボット」が増えます。

チャットボットを作る

「新規追加」を押すと、テンプレートが2つ出ます。

• チャットボット（基本） … 選択肢・テキスト入力・フォームを組み合わせて、会話の流れを自分で設計する
• AI Q&A チャットボット … アップロードした PDF の内容をもとに、AI が訪問者の質問に答える（Gemini API キーが必要）

選ぶと編集画面が開きます。作った直後は非公開なので、この段階ではまだショップには出ません。編集画面は「1 シナリオ」「2 ルール」の2段階です。

1. シナリオ

会話の流れを、ステップをつないで作ります。ステップの種類は次の6つです。

ステップをクリックすると編集でき、「+」ボタンで次のステップを足したり、分岐させたりできます。別の分岐の途中に合流させることもできます。右側のプレビューで、実際の会話の見え方を確認しながら進めます。

同じ画面で、見た目も設定します。

• チャットアイコン … 色・大きさ・表示位置（右下・左下・右上・左上）・挨拶メッセージ
• 視認性 / アニメーション … パルスアニメ、通知バッジ、登場アニメ、挨拶バブルの自動表示（既定はすべてオフ）
• デザイン … ウィンドウのタイトルと色、角の丸み、影
• アバター … なし、またはアップロードした画像
• メール送信設定 … 管理者宛のメールと自動返信メール（後述）

2. ルール

いつ、どのページに出すかを決めます。

• トリガー … 「最初から表示」「スクロールしたら表示」「滞在したら表示」「離脱時に表示」から選ぶ
• 表示期間 … 開始と終了の日時を決めて、その間だけ出す
• 表示するページURL … URL を登録したページにだけ出す。「前方一致」にチェックすると、その URL で始まるページすべてが対象になる

表示するページの URL は、1件以上登録してください。現在のバージョンでは、URL が1件もないチャットボットはショップに表示されません。全ページに出したい場合は「/」を登録して「前方一致」にチェックを入れます。

「離脱時に表示」は、マウスが画面の上端から外に出た動きで判定します。マウスを使うパソコン向けの設定で、スマートフォンではこの条件では表示されません。

都道府県で表示する相手を絞る設定もありますが、これは grip space 連携時に、契約プランによって使える機能です。

公開する

編集画面上部の「公開」スイッチをオンにして保存するか、一覧の「公開する」を押します。公開中のチャットボットは、管理画面以外のショップのページで、ルールに合うページに表示されます。テーマのテンプレートを編集する必要はありません。

リードとメール

リード獲得フォームから送信された内容は、EC-CUBE の中に保存されます。左メニューの「リード」を開くと、チャットボットごとの件数と最終送信日時が並び、チャットボット名から一覧と詳細を開けます。詳細では、送信内容に加えて、送信したページの URL と、それまでの会話のやり取りも確認できます。

メールは、編集画面の「メール送信設定」で、管理者宛のメールと自動返信メールを個別にオンにします。

• 管理者宛の送信先を空欄にすると、EC-CUBE の基本設定の「送信元メールアドレス(From)」宛に送られます。複数指定はカンマ区切りです
• 自動返信は、会話の中で受け取った訪問者のメールアドレス宛に送られます
• 件名と本文では {values}（送信値）、{conversation}（会話ログ）、{page}（ページURL）が使えます。空欄なら既定の文面になります

メールの送信には EC-CUBE 本体と同じ送信の仕組みを使います。メールが届かなくても、リードは管理画面に残ります。

AI 機能を使う（任意）

AI 機能は、Google の Gemini API を使います。先に「設定」の「AI 機能（Gemini）」で API キーを登録してください。キーは Google AI Studio で取得できます。登録したキーはサーバー側だけで使われ、ショップの画面には出力されません。

AI Q&A

AI Q&A のステップに PDF をアップロードしておくと、訪問者の自由な質問に、AI がその資料だけを根拠に回答します。回答のトーン（フォーマル・カジュアル・フレンドリー）と、最大回答数を決められます。最大回答数に達したあとは、お問い合わせページなどへのボタン（CTA）を表示します。API キーを登録するまでは、訪問者には CTA のボタンが表示されます。

AIでシナリオを生成

「AIで生成」から、サイトURL・目的・収集したい情報などを入れると、会話の流れの下書きを作れます。生成した内容は、今のステップと置き換えるか、後ろに追加するかを選べます。生成には1分ほどかかることがあります。

AI 機能を使うと、訪問者の質問やアップロードした PDF の内容が Google の API に送られます。API の利用条件や料金は Google 側の案内を確認してください。個人情報や社外秘の資料は PDF に含めないでください。

grip space と連携する（任意）

grip space は、BtoB 向けのアクセス解析・営業支援のサービスです。連携しなくても、チャットボットの作成・表示・リード・メールはすべて使えます。

1. 「設定」を開き、grip space で発行した連携キーで接続する。使っていない場合は、同じ画面から grip space のフリープランに登録して接続する
2. 「チャットボット」の一覧で、連携したいチャットボットの「grip連携する」を押す
3. 連携したチャットボットは「連携済みチャットボット」に移り、grip space の計測タグ経由で表示・計測される

チャットボットを連携すると、アクセス計測が自動で有効になります。「連携済みチャットボット」では、表示・開封・回答の数を期間を指定して確認できます。

チャットボットの連携は、grip space の契約プランによって使えない場合や、件数に上限がある場合があります。その場合は管理画面に案内が表示されます。

連携を有効にすると、設定に応じてアクセス計測データやフォームの送信内容が grip space のサーバーへ送られ、保存されます。当社のフォームプラグインなど、grip space に連携するプラグインを複数入れている場合は、すべて同じサイト（同じアカウント）に連携してください。連携先が違うと、管理画面に警告が出ます。

プラグインを無効にすると、grip space 側で配信していた連携済みチャットボットは非表示になります。データは残るので、有効に戻せば公開中のものから再び表示されます。

公開前に確認したいこと

1. ルールに URL を登録したページで、実際にアイコンが出るか
2. スマートフォンで、アイコンや挨拶バブルがカートボタンなどに重なっていないか。重なる場合は表示位置を変える
3. 会話を最後まで進め、リードが「リード」メニューに入るか
4. 管理者宛メールと自動返信メールが、自分のアドレスに届くか
5. AI 機能を使う場合、PDF にない質問をしたときの答え方と、最大回答数に達したあとの CTA

最初から全ページに出すより、問い合わせにつながりやすいページ（料金や配送の案内、法人向けの案内など）に絞って出し、反応を見てから広げるほうが、訪問者の邪魔になりにくく、効果も比べやすくなります。

まとめ

1. インストール後に有効化すると「チャットボット」メニューが増える
2. テンプレートを選び、シナリオ（会話）とルール（どこに・いつ出すか）を決める
3. 表示するページの URL は必ず1件以上登録する。全ページなら「/」を前方一致
4. フォームの送信はリードとして EC-CUBE に保存され、メール通知もできる
5. AI 機能と grip space 連携は任意。AI は自社の Gemini API キーで動く