ものしりAI
導入ガイド

Shopifyにチャットボットを設置する方法|アプリ不要のカスタムLiquid手順【2026年版】

2026年9月6日ものしりAI編集部

Shopifyにチャットボットを設置する方法 アプリ不要のカスタムLiquidで導入する手順

Shopifyでチャットボットを探すと、まずApp Storeにたどり着きます。数は多く、レビューもたくさん付いています。ところが実際に入れてみると、月額が思ったより高い、管理画面が英語のまま、日本語の回答が不自然といったところでつまずきます。

そして見落とされがちなのが、Shopifyのチャットボットはアプリを入れなくても設置できるという点です。テーマに埋め込みコードを貼るだけで動きます。アプリの権限を渡す必要も、アンインストール時に残骸が残る心配もありません。

この記事では、Shopifyストアにチャットボットを設置する3つの方法を整理し、もっとも手間が少ないカスタムLiquidでの手順を説明します。あわせて、テーマを差し替えると消えるというShopify特有の落とし穴と、チェックアウトページには表示できない仕様も扱います。


この記事で分かること

  • Shopifyへの設置方法3つ(カスタムLiquid / theme.liquid / アプリ)の違いと選び方
  • アプリ不要で設置する具体的な手順
  • テーマを変更したときにコードが残る方法・消える方法
  • 無料でどこまで運用できて、どこから有料になるのか
  • チェックアウトやShopify Marketsなど、Shopify固有の制約

1. 設置方法は3通り

やり方は3つあり、貼るコードはどれも同じです。違うのは「どこに置くか」だけで、そこが運用のしやすさを決めます。

図解 Shopifyにチャットボットを設置する3つの方法 カスタムLiquid・theme.liquid編集・アプリの比較

カスタムLiquid theme.liquid 編集 アプリ
やること セクションを追加して貼る コードファイルを開いて貼る App Storeからインストール
必要な知識 なし コード画面を開ける程度 なし
対応テーマ Online Store 2.0 すべて すべて
所要時間 3分程度 5〜10分 数分
テーマ差し替え時 消えることがある 消える(新テーマに再設置) 残る
追加のアプリ権限 不要 不要 必要
向いている人 ほとんどのストア 古いテーマ/確実に全ページに出したい アプリでまとめて管理したい

Shopifyの現行テーマ(DawnをはじめとするOnline Store 2.0テーマ)を使っているなら、カスタムLiquidが最短です。テーマカスタマイザーの画面から操作でき、コードファイルを一度も開かずに済みます。

Online Store 1.0の古いテーマを使っている場合や、テーマの構造に関係なく確実に全ページへ出したい場合は、theme.liquid を直接編集します。

アプリ方式は、インストールするだけで済む代わりに、ストアへのアクセス権限をアプリに渡すことになります。ものしりAIは現在カスタムLiquid方式での設置を提供しており、アプリのインストールや審査を待たずにすぐ導入できます。


2. 推奨手順: カスタムLiquid(3ステップ)

ここではものしりAIを例に説明します。Shopify側の作業はすべて管理画面内で完結します。

ステップ1: 埋め込みコードを取得する

ものしりAIの管理画面でウィジェットを開き、「埋め込みコード」をコピーします。形はこのような1行のスクリプトタグです。

<script async src="https://monoshiri.ai/widget/embed.js" data-api-key="(発行された自分のキー)" data-api-url="https://api.monoshiri.ai"></script>

ストアのドメインを事前に登録する必要はありませんmyshopify.com のドメインでも独自ドメインでも、同じコードがそのまま動きます。ドメインごとに設定を分ける手間がないので、独自ドメインへの移行や、テスト環境から本番への切り替えでも貼り直しは不要です。

ステップ2: テーマカスタマイザーを開く

Shopify管理画面から「オンラインストア → テーマ → カスタマイズ」を開きます。

ここで注意したいのが、編集しているテーマが公開中のテーマかどうかです。テーマ一覧には公開中のテーマとライブラリのテーマが並んでいます。ライブラリ側を編集しても、実際のストアには反映されません。「貼ったのに出ない」の原因として、意外と多いパターンです。

ステップ3: カスタムLiquidを追加して貼り付ける

カスタマイザーの左側で「セクションを追加」→「カスタム Liquid」を選び、表示された入力欄にステップ1のコードを貼り付けて保存します。

貼る場所は、**全ページ共通のレイアウト(ヘッダーやフッターの領域)**を選ぶのが基本です。特定のテンプレートの中に入れると、そのページでしか表示されません。配送や返品の質問はトップページやコレクションページでも出るため、最初は全ページで様子を見るほうが取りこぼしが減ります。

保存したらストアを開き、右下にチャットボタンが出るか確認します。

画面つきの詳しい手順はShopify連携ページにまとめています。Shopify以外のサイトも含めた考え方はチャットウィジェット導入ガイドを参照してください。


3. theme.liquid に直接貼る場合

古いテーマを使っている場合や、テーマの構成に関係なく確実に全ページへ出したい場合はこちらです。

  1. Shopify管理画面 → オンラインストア → テーマ → コードを編集
  2. 左サイドバーから layout/theme.liquid を開く
  3. </body> の直前に埋め込みコードを貼り付けて保存

</body> の直前に置くのは、ページ本体の描画を妨げないためです。<head> に入れても動きますが、表示速度の観点では終了タグ直前が無難です。

編集前にテーマを複製しておくことをおすすめします。テーマ一覧の「複製」でバックアップを作ってから触れば、貼る場所を間違えても元に戻せます。


4. テーマを変更すると消えるのか

Shopifyでもっとも見落とされる点がここです。

カスタムLiquidで追加したセクションは、そのテーマの中に保存されます。つまり、別のテーマに差し替えると引き継がれず、チャットボットは表示されなくなります。theme.liquid を直接編集した場合も同じで、新しいテーマにはコードが入っていません。

図解 Shopifyでテーマを差し替えたときにチャットボットの設置が引き継がれるかどうか

これは事故として気づきにくいのが厄介です。デザインをリニューアルした翌日から、静かにチャットボットが消えているという状態になります。

対策はシンプルです。

  • テーマを切り替えたら、新しいテーマで再度カスタムLiquidを追加する。作業チェックリストに入れておく
  • リニューアルの予定があるなら、テーマ公開直後の確認項目にチャットボタンの表示を含める
  • 複数のテーマを行き来する運用をしているなら、それぞれのテーマに設置しておく

WordPressのプラグイン方式ではテーマを変えても設定が残りますが、Shopifyのカスタムコードはテーマに紐づくという違いを理解しておくと、事故を防げます。プラットフォームごとの「無料」と設置方式の違いは、WordPressにチャットボットを無料で入れる方法で整理しています。


5. 無料でどこまでできるのか

Shopifyにチャットボットを入れる場合、費用はチャットボット側のみです。カスタムLiquidでの設置にShopifyへの追加料金はかかりません。ベーシックを含むすべての有料プランで、同じ手順が使えます。

参考として、ものしりAIの場合の数字を挙げます。

Free Light Standard Pro
月額(税込) 0円 2,980円 7,980円 29,800円
AIの回答数(月間) 150回 1,000回 3,000回 20,000回
フォルダ数 1 5 10 30
1フォルダあたりファイル数 30件 100件 300件 300件
チャットウィジェット 1つ(月150回) 1つ 1つ 1つ

※ 2026年9月時点。最新の内容は料金プランをご確認ください。

判断の目安は、月間の問い合わせ想定回数です。

  • 月150回以内で収まりそう → 無料プランで実際の質問を集め、内容を見てから有料化を判断する
  • セールや新商品の投入で問い合わせが跳ねる → 上限に達すると質問機能が一時停止するため、繁忙期を前提にプランを選ぶ
  • 越境ECで多言語の問い合わせがある → 言語が増えると質問数も増えます。回数の見積もりは多めに取る

無料プランは「自分のストアで使えるか確かめる」ためのものと考えるのが実態に近いです。チャットボットが機能し始めると、月150回は1日5回のペースで到達します。


6. Shopify固有の制約と、つまずきポイント

チェックアウト(Shop Pay)ページには表示されない

Shopifyのチェックアウトページは、Shopify側でカスタマイズが制限されています。埋め込みコード方式のウィジェットはチェックアウトには表示されません

これは制約ではありますが、実務上の影響は限定的です。配送や返品の質問はカートに入れる前に出るもので、そこで解消できていれば目的は果たせています。商品ページ・コレクションページ・トップページ・ポリシーページでは通常どおり表示されます。

Shopify Marketsの多言語ストアで使う

Shopify Marketsで多言語展開している場合、訪問者の言語はさまざまです。ものしりAIは日本語・英語・中国語・韓国語に対応しているため、海外のお客様の質問にもそのまま一次対応できます。

ただし、AIが答えられるのはアップロードした資料に書いてあることだけです。日本語の配送ポリシーしか入れていなければ、英語の質問にも日本語資料の内容をもとに答えます。多言語ストアなら、各言語の配送・返品ポリシーを揃えて入れておくと精度が上がります。

高速化アプリ・遅延読み込みとの衝突

ストア高速化系のアプリには、JavaScriptの読み込みを遅延させたり結合したりする機能があります。これがチャットボットのスクリプトと衝突すると、ボタンが出ない・開かないといった症状になります。多くのアプリには除外設定があるので、チャットボットのスクリプトを除外リストに入れると解決します。

右下でボタンが重なる

Shopifyのストアには、カートドロワーのボタンや各種アプリのフローティング要素が並ぶことがあります。重なる場合は、チャットボット側の設定でボタンを左下に変更すると解決します。ものしりAIでは管理画面から位置を切り替えられます。

注文の確認や変更はできない

チャットボットができるのは、資料に基づいて質問に答えることです。注文状況の照会・キャンセル・決済の処理といったストアの操作は行いません。「私の注文はいつ届きますか」のような個別の照会には、有人窓口への案内が必要です。ウィジェットの設定に問い合わせフォームのURLを登録しておくと、AIが答えきれないときの逃し先が用意できます。


7. 最初に入れる資料

回答の質は、入れた資料の質でほぼ決まります。シナリオ設計は不要で、テキストやPDFをアップロードすればAIがその内容から答えます。

Shopifyストアなら、次の5つから始めるのが効率的です。

  1. 配送ポリシー — 送料、発送までの日数、地域別の到着目安、海外配送の可否
  2. 返品・交換ポリシー — 受付期間、送料の負担、対象外の商品
  3. 特定商取引法に基づく表記 — すでにストアに掲載しているページをそのままコピーすれば十分です
  4. サイズ表・素材・お手入れ方法 — 商品説明に書いている「ゆったりめの作りです」といった表現も一緒に入れると、曖昧な質問を拾えます
  5. 支払い方法・領収書の発行方法 — 意外と問い合わせが多い領域です

コツは、新しく書き起こさず、既存のポリシーページをそのままファイルにすることです。書き起こそうとすると、それだけで導入が止まります。

設置後は会話ログを確認してください。答えられなかった質問は、そのままストアに書かれていない情報のリストです。資料に追記するだけでなく、商品ページの説明文自体を直すきっかけにもなります。問い合わせを減らす一番効く手は、そもそも聞かれない状態を作ることです。


まとめ

  • Shopifyへの設置方法はカスタムLiquid / theme.liquid編集 / アプリの3つ。貼るコードはどれも同じで、違いは置き場所
  • Online Store 2.0テーマならカスタムLiquidが最短。コードファイルを開かずに3分程度で設置できる
  • アプリのインストールは不要。ストアへのアクセス権限を渡さずに導入できる
  • 最大の落とし穴はテーマの差し替えで設置が消えること。リニューアル後の確認項目に入れておく
  • 埋め込みコードはドメインごとの登録が不要。myshopify.comでも独自ドメインでもそのまま動く
  • チェックアウト(Shop Pay)には表示されない仕様。ただし配送・返品の質問はカート前に出るため、影響は限定的
  • 無料プランの分岐点はほぼ月間の回答回数。セール時の跳ね上がりを見込んでプランを選ぶ
  • 越境ECなら、各言語のポリシーを揃えて入れると多言語の一次対応の精度が上がる

この記事をシェア

関連記事

ものしりAIを無料で試してみませんか?

ドキュメントをアップロードするだけで、AIに質問できる環境が作れます。ユーザー数無制限の無料プランで、まずはお試しください。

クレジットカード不要 / 最短1分で利用開始