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

Ghost CMSウェブサイト向けのステップバイステップガイド

埋め込みコードの取得

プラットフォーム:

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

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

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

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

ステップ2：コードインジェクションの使用（推奨）

Ghostにはコードインジェクション機能が組み込まれており、カスタムスクリプトの追加が非常に簡単です：

Ghost管理パネルにログインします
左下の歯車アイコン（設定）をクリックします
「詳細」セクションまでスクロールしてください
「コードインジェクション」をクリックしてください
「サイトフッター」セクションにAsyntaiの埋め込みコードを貼り付けてください
右上の「保存」をクリックしてください

ヒント: JavaScriptをサイトヘッダーではなくサイトフッターに追加することで、ページコンテンツの後に読み込まれるようになります。これはチャットウィジェットに推奨されており、ページの読み込み速度に影響しません。

代替方法：ページ固有のコードインジェクション

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

チャットボットを追加したい投稿またはページを開きます
右上の設定アイコン（歯車）をクリックします
Scroll down to find "Code injection"
セクションを展開し、Asyntaiの埋め込みコードを「投稿フッター」フィールドに貼り付けてください
フィールドの外をクリックして保存し、投稿を公開/更新します

注意: ページ固有のコードインジェクションは、サイト全体ではなく特定のページにのみチャットボットを表示したい場合に便利です。

代替方法：テーマファイルの編集（セルフホスティングの場合）

If you're self-hosting Ghost and prefer to edit theme files directly:

Access your Ghost installation files via FTP or file manager
テーマフォルダに移動します：content/themes/your-theme/
Open the default.hbs file (the main layout file)
</body>閉じタグを見つけます
</body>タグの直前にAsyntaiの埋め込みコードを貼り付けます
ファイルを保存します
Ghostを再起動するか、キャッシュをクリアします

重要: テーマファイルの直接編集は、必要な場合を除き推奨されません。テーマの更新時に変更が上書きされる可能性があります。コードインジェクション方式はテーマの更新後も維持されるため推奨されます。

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

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