Shopify

このガイドでは、Quickchat AI ウィジェットを Shopify ストアに追加する方法をご紹介します。

必要なもの

• Shopify ストア
• Shopify App Marketplace からインストールされたShopping Agent by Quickchat AIアプリ（インストールしたくない場合や手動で接続したい場合は、チュートリアルの第二部にスクロールしてください）
• テーマを編集するユーザー権限

完了時間：約 2 分

---

ステップ 1：テーマエディターを開く

2 つの方法があります：

オプション A（推奨）：Quickchat AI アプリから

Quickchat AI App → Your website → Installタブ → Embed in your Shopify Storeをクリック。

これにより、アプリの埋め込みを有効にできるページでストアのテーマエディターが直接開きます。

オプション B：Shopify 管理画面から

Shopify Admin → Online Store → Themes → 現在のテーマでCustomizeをクリック。

---

ステップ 2：アプリの埋め込みを有効にする

テーマエディター内で、左サイドバーを開き、App embedsに移動します。

Quickchat AI Widgetを見つけて、オンに切り替えます。

その後、Save（右上）をクリックします。

---

ステップ 3：ストアフロントで確認

ストアフロント（プレビューまたはライブサイト）を開き、ページの右下角にある Quickchat AI チャットバブルを探してください。

それで完了です！

Quickchat AI エージェントが Shopify ストアでライブになりました 🎉

---

ウィジェットスクリプトを手動で追加する方法

Quickchat AI アプリで既に AI エージェントを構築しているため、Shopify アプリをインストールしたくない場合は、Shopify ストアに表示するシンプルなスクリプトを追加できます。

AI を Shopify データに既に接続していますか？

AI エージェントを Shopify ストアのデータ（商品カタログやカートなど）に接続するには、以下を実行してください：

1. このページにストアリンクを貼り付けてください：quickchat.ai/shopify
2. それを要求し、カスタマイズして、サイトに埋め込んでください

1. テーマコードエディターを開く

1. Shopify 管理パネルに移動します。
2. 左メニューでOnline Store → Themesをクリックします。

3. 「Current theme」セクションで、Customizeボタンの横の**三点（⋯）**をクリックします。
4. ドロップダウンからEdit codeを選択します。

2. theme.liquidを見つける

1. コードエディターで、左側のlayoutフォルダーを展開します。
2. theme.liquidをクリックして、テーマのメインレイアウトファイルを開きます。

3. スクリプトを貼り付ける

1. Quickchat Appで、Your Website → Installに移動します。
2. 生成されたスクリプトをコピーします。
3. theme.liquidファイルの最後の**</body>タグの直上**に貼り付けます。

<script>
  window.__quickchat = {
    host: "app.quickchat.ai",
    init: "YOUR_AI_ID_HERE",
  };
</script>