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

プラットフォーム:

HubSpot

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

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

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

ステップ2：サイト設定の使用（推奨）

HubSpotウェブサイトのすべてのページにチャットボットを追加する最も簡単な方法：

1. HubSpotアカウントにログインします
2. メインナビゲーションバーの設定アイコン（歯車）をクリックします
3. 左サイドバーでWebsite > Pagesに移動します
4. Scroll down to the "Site footer HTML" section
5. テキストエリアにAsyntaiの埋め込みコードを貼り付けます
6. ページ下部の「保存」をクリックしてください

代替方法：ページ固有のインストール

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

1. Marketing > Website > Website Pages（またはLanding Pages）に移動します
2. 編集したいページをクリックします
3. ページエディターで、上部のSettingsをクリックします
4. 「詳細オプション」までスクロールしてください
5. 「フッターHTML」セクションを見つけてください
6. Asyntaiの埋め込みコードを貼り付けます
7. 「変更を適用」をクリックしてページを公開してください

代替方法：デザインマネージャーの使用

より細かい制御が必要な場合は、デザインマネージャーからJavaScriptファイルを追加できます：

1. Go to Marketing > Files and Templates > Design Tools
2. 左サイドバーでFile > New fileをクリックします
3. ドロップダウンから「JavaScript」を選択してください
4. ファイルに名前を付けます（例：asyntai-chatbot.js）
5. 以下のコードを追加します：
   (function() {
  var script = document.createElement('script');
  script.async = true;
  script.src = 'https://asyntai.com/static/js/chat-widget.js';
  script.setAttribute('data-asyntai-id', 'YOUR_WIDGET_ID');
  document.body.appendChild(script);
})();
6. YOUR_WIDGET_IDを実際のウィジェットIDに置き換えてください
7. 「変更を公開」をクリックしてください
8. テンプレートでrequire_jsを使用してこのファイルをインクルードするか、サイト設定でリンクします

代替方法：カスタムモジュールの使用

チャットボット用の再利用可能なモジュールを作成します：

1. Go to Marketing > Files and Templates > Design Tools
2. File > New file > Moduleをクリックします
3. 「Asyntai Chatbot」と名前を付けてください
4. module.htmlファイルに埋め込みコードを貼り付けます
5. モジュールを公開します
6. テンプレートのフッターセクションにモジュールを追加するか、個々のページにドラッグします

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

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