PrestaShopにAsyntai AIチャットボットを追加する方法
PrestaShopウェブサイトのステップバイステップガイド
ステップ1:埋め込みコードを取得する
まず、Asyntaiダッシュボードに移動し、「埋め込みコード」セクションまでスクロールしてください。次のような固有の埋め込みコードをコピーしてください:
<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
注意: 上記のコードは一例です。個人のウィジェットIDが含まれているため、ダッシュボードから固有の埋め込みコードをコピーしてください。
ステップ2:カスタムコードモジュールを使用(推奨)
チャットボットを追加する最も簡単な方法は、PrestaShop Addonsマーケットプレイスの無料"Custom Code"モジュールを使用することです:
- PrestaShopバックオフィスにログインしてください
- Modules → Module Managerに移動してください
- 「モジュールをアップロード」をクリックするか、マーケットプレイスで「Custom Code」または「Header Footer Scripts」を検索します
- Install a module like "Custom JS and CSS" or similar
- インストール後、モジュールの設定に移動してください
- "Footer Scripts"または"Before </body>"セクションを見つけてください
- Asyntaiの埋め込みコードを貼り付けます
- 「保存」をクリックしてください
ヒント: この目的で人気のある無料モジュールには、"Custom JS and CSS Pro"、\"Custom Code"、"Header and Footer Scripts"があります。これらのモジュールはテーマやPrestaShopの更新後も維持されます。
代替方法:テーマテンプレートを編集(PrestaShop 1.7以降/8)
テーマのフッターテンプレートにコードを直接追加できます:
- Access your PrestaShop files via FTP or file manager
- テーマフォルダに移動してください:
themes/your_theme/templates/_partials/ - ファイルfooter.tplを開いてください(一部のテーマでは
templates/layouts/layout-both-columns.tplを確認してください) - 閉じ
</body>タグまたは{block name='javascript_bottom'}セクションを見つけてください - 閉じ
</body>タグの直前にAsyntai埋め込みコードを貼り付けてください - ファイルを保存します
- PrestaShopキャッシュをクリアしてください:Advanced Parameters → Performance → Clear cache
重要: テーマファイルへの変更は、テーマの更新時に上書きされる可能性があります。より永続的なソリューションとして、子テーマまたはモジュールの使用を検討してください。
代替方法:テーマのカスタムJavaScriptファイルを使用
Many PrestaShop themes include a custom.js file for your own scripts:
- 次のパスに移動してください:
themes/your_theme/assets/js/ - custom.jsという名前のファイルを探してください(存在しない場合は作成してください)
- チャットボットを動的に読み込むために、以下のコードを追加してください:
(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);
})(); YOUR_WIDGET_IDを実際のウィジェットIDに置き換えてください- PrestaShopキャッシュをクリアしてください
代替方法:シンプルなモジュールを作成(開発者向け)
開発者向けに、displayFooterフックを使用してシンプルなモジュールを作成できます:
- フォルダを作成してください:
modules/asyntaichatbot/ - 以下のコードでasyntaichatbot.phpを作成してください:
<?php
class AsyntaiChatbot extends Module {
public function __construct() {
$this->name = 'asyntaichatbot';
$this->version = '1.0.0';
$this->author = 'Your Name';
parent::__construct();
$this->displayName = 'Asyntai Chatbot';
}
public function install() {
return parent::install() && $this->registerHook('displayFooter');
}
public function hookDisplayFooter($params) {
return '<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>';
}
} YOUR_WIDGET_IDを実際のウィジェットIDに置き換えてください- Install the module via Modules → Module Manager
ステップ3:インストールの確認
変更を保存してキャッシュをクリアした後、新しいブラウザタブまたはシークレットウィンドウでストアにアクセスしてください。右下にチャットウィジェットボタンが表示されるはずです。クリックして正しく開き、正常に動作することを確認してください。
ウィジェットが表示されませんか? PrestaShopのキャッシュをクリアしてください:Advanced Parameters → Performance → Clear cacheに移動してください。また、ブラウザのキャッシュをクリアするか、シークレットウィンドウで表示してみてください。カスタムモジュールを使用している場合は、Module Managerで有効になっていることを確認してください。
Weebly