ダッシュボードに戻る

ドキュメント

Asyntaiの使い方を学ぶ

はじめに
インストール ナレッジベース AIをテスト ウェブサイト管理
カスタマイズ
ウィジェットの色 AIアシスタント名 初期メッセージ ウィジェットの位置 自動トリガー 挨拶バブル 未読バッジ インストラクションモード 質問を促す 絵文字を使用 メールアドレスの収集 電話番号の収集 スマートリード獲得 ローカライズ ブランディングの非表示 プライバシーリンク カスタム通知文 トランスクリプトのダウンロード 新しい会話 会話履歴 タグラインとステータスドット 音声テキスト変換 チャットアイコン 会社ロゴ 文字数制限 Temperature
AI指示のヒント プラン比較
機能
ウェブサイトクロール 知識のギャップ 商品カード 動的商品カード Dynamic Images ユーザーコンテキスト ライブモニタリング オペレーター対応 エスカレーション AI通知 デイリーレポート リアルタイムデータフィード リアルタイムデータフィードMax チームメンバー シングルサインオン 画像を含める 画像認識 翻訳ウィジェット ローカライズ リード スマートリード獲得 サポートチケット 予約 埋め込み ページの除外 ブロックされたIP よりスマートなモデル 思考モードを有効化 返信候補 フォローアップメッセージ 音声テキスト変換 トランスクリプトのダウンロード 埋め込みチャット
アナリティクス
チャット分析 チャットログ
連携
REST API Instagram Messenger WhatsApp Zapier Email モバイルアプリ
その他
ホーム画面に追加 カスタムオープンボタン
AIに質問

BubbleにAsyntai AIチャットボットを追加する方法

Bubbleアプリ向けステップバイステップガイド

埋め込みコードの取得
プラットフォーム:
HTML HTML/Custom WordPress WordPress Shopify Shopify WooCommerce WooCommerce BigCommerce BigCommerce Ecwid Ecwid Wix Wix Squarespace Squarespace Webflow Webflow Weebly Weebly HubSpot HubSpot Tilda Tilda Adobe Experience Manager Adobe Experience Manager Duda Duda Google Sites Google Sites Bludit Bludit Plesk Plesk Concrete CMS Concrete CMS Craft CMS Craft CMS Contentful Contentful Docusaurus Docusaurus Strapi Strapi Joomla Joomla Kentico Kentico Drupal Drupal Magento Magento Blogger Blogger Bitrix Bitrix TYPO3 TYPO3 PrestaShop PrestaShop OpenCart OpenCart Ghost Ghost Hugo Hugo Statamic Statamic Umbraco Umbraco Volusion Volusion Moodle Moodle SilverStripe SilverStripe Grav Grav October CMS October CMS ProcessWire ProcessWire Sanity Sanity ExpressionEngine ExpressionEngine Sylius Sylius Backdrop CMS Backdrop CMS MODX MODX Bagisto Bagisto PayloadCMS PayloadCMS e107 e107 CrafterCMS CrafterCMS Kirby Kirby MedusaCMS MedusaCMS DatoCMS DatoCMS GoDaddy GoDaddy Framer Framer Bubble Bubble Carrd Carrd Jimdo Jimdo Strikingly Strikingly Kajabi Kajabi Teachable Teachable Thinkific Thinkific ClickFunnels ClickFunnels Hostinger Hostinger Unbounce Unbounce Leadpages Leadpages Systeme.io Systeme.io Instapage Instapage

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

まず、Asyntaiダッシュボードに移動し、「埋め込みコード」セクションまでスクロールしてください。次のような固有の埋め込みコードをコピーしてください：

<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>

注記: 上記のコードは一例です。個人のウィジェットIDが含まれているため、ダッシュボードから固有の埋め込みコードをコピーしてください。

ステップ2：アプリ設定を使用する（推奨）

Bubbleにはアプリ設定からカスタムスクリプトを追加する機能が組み込まれています：

  1. Bubbleアプリエディターにログインします
  2. 左サイドバーの設定に移動します
  3. 「Web App」タブをクリックします
  4. 「Advanced Settings」までスクロールします
  5. 「Custom headers and body」セクションを探してください
  6. Asyntaiの埋め込みコードを「Script in body」フィールドに貼り付けてください
  7. アプリをデプロイします

ヒント: ボディスクリプトフィールドにコードを追加すると、Bubbleアプリのすべてのページで読み込まれます。これはチャットウィジェットの推奨されるアプローチです。この機能は無料プランを含むすべてのBubbleプランで利用できます。

代替方法：HTML要素を使用する

特定のページにのみチャットボットを追加したい場合：

  1. Bubbleエディターでチャットボットを追加したいページを開きます
  2. ページにHTML要素を追加します
  3. 要素にAsyntaiの埋め込みコードを貼り付けます
  4. アプリをデプロイします

注記: アプリ設定方式は、アプリ全体にチャットボットを適用するため推奨されます。HTML要素方式は、要素を配置した特定のページにのみチャットボットを追加します。

ステップ3：インストールの確認

アプリをデプロイした後、新しいブラウザタブまたはシークレットウィンドウでBubbleサイトにアクセスしてください。右下にチャットウィジェットボタンが表示されるはずです。クリックして正しく開いて動作することを確認してください。

ウィジェットが表示されませんか？ コードを追加した後にアプリをデプロイしたことを確認してください。ブラウザキャッシュのクリアやシークレットウィンドウでの表示をお試しください。開発モードでテストしている場合は、アプリのライブバージョンも確認してください。