So fügen Sie den Asyntai-KI-Chatbot zu PrestaShop hinzu

Plattform:

PrestaShop

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

Schritt 1: Ihren Einbettungscode erhalten

Gehen Sie zunächst zu Ihrem Asyntai Dashboard und scrollen Sie zum Abschnitt "Einbettungscode". Kopieren Sie Ihren einzigartigen Einbettungscode, der so aussieht:

Schritt 2: Benutzerdefiniertes Code-Modul verwenden (empfohlen)

Der einfachste Weg, den Chatbot hinzuzufügen, ist die Verwendung eines kostenlosen "Custom Code"-Moduls aus dem PrestaShop Addons-Marktplatz:

1. Melden Sie sich in Ihrem PrestaShop Back Office an
2. Gehen Sie zu Modules → Module Manager
3. Klicken Sie auf "Upload a module" oder suchen Sie im Marktplatz nach "Custom Code" oder "Header Footer Scripts"
4. Installieren Sie ein Modul wie "Custom JS and CSS" oder ähnlich
5. Gehen Sie nach der Installation zur Konfiguration des Moduls
6. Finden Sie den Abschnitt "Footer Scripts" oder "Before </body>"
7. Fügen Sie Ihren Asyntai-Einbettungscode ein
8. Klicken Sie auf "Save"

Alternative: Theme-Vorlage bearbeiten (PrestaShop 1.7+/8)

Sie können den Code direkt zur Footer-Vorlage Ihres Themes hinzufügen:

1. Greifen Sie per FTP oder Dateimanager auf Ihre PrestaShop-Dateien zu
2. Navigieren Sie zu Ihrem Theme-Ordner: themes/your_theme/templates/_partials/
3. Öffnen Sie die Datei footer.tpl (oder überprüfen Sie bei manchen Themes templates/layouts/layout-both-columns.tpl)
4. Finden Sie das schließende </body>-Tag oder den Abschnitt {block name='javascript_bottom'}
5. Fügen Sie Ihren Asyntai-Einbettungscode direkt vor dem schließenden </body>-Tag ein
6. Speichern Sie die Datei
7. Leeren Sie den PrestaShop-Cache: Advanced Parameters → Performance → Clear cache

Alternative: Benutzerdefinierte JavaScript-Datei des Themes verwenden

Viele PrestaShop-Themes enthalten eine custom.js-Datei für Ihre eigenen Skripte:

1. Navigieren Sie zu: themes/your_theme/assets/js/
2. Suchen Sie nach einer Datei namens custom.js (erstellen Sie sie, falls sie nicht existiert)
3. Fügen Sie den folgenden Code hinzu, um den Chatbot dynamisch zu laden:
   (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);
})();
4. Ersetzen Sie YOUR_WIDGET_ID durch Ihre tatsächliche Widget-ID
5. Leeren Sie den PrestaShop-Cache

Alternative: Ein einfaches Modul erstellen (für Entwickler)

Für Entwickler können Sie ein einfaches Modul mit dem displayFooter-Hook erstellen:

1. Erstellen Sie einen Ordner: modules/asyntaichatbot/
2. Erstellen Sie asyntaichatbot.php mit folgendem Code:
   <?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>';
  }
}
3. Ersetzen Sie YOUR_WIDGET_ID durch Ihre tatsächliche Widget-ID
4. Installieren Sie das Modul über Module → Modul-Manager

Schritt 3: Installation überprüfen

Nachdem Sie Ihre Änderungen gespeichert und den Cache geleert haben, besuchen Sie Ihren Shop in einem neuen Browser-Tab oder Inkognito-Fenster. Sie sollten den Chat-Widget-Button in der unteren rechten Ecke sehen. Klicken Sie darauf, um sicherzustellen, dass er sich öffnet und korrekt funktioniert.