Πώς να Προσθέσετε το Asyntai AI Chatbot στο PrestaShop

Πλατφόρμα:

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

Βήμα 1: Αποκτήστε τον Κωδικό Ενσωμάτωσής σας

First, go to your Asyntai Dashboard and scroll down to the "Embed Code" section. Copy your unique embed code which will look like this:

Βήμα 2: Χρήση Ενότητας Προσαρμοσμένου Κώδικα (Συνιστάται)

Ο ευκολότερος τρόπος για να προσθέσετε το chatbot είναι χρησιμοποιώντας μια δωρεάν ενότητα «Custom Code» από το marketplace PrestaShop Addons:

1. Συνδεθείτε στο Back Office PrestaShop
2. Μεταβείτε στο Modules → Module Manager
3. Κάντε κλικ στο «Ανέβασμα ενότητας» ή αναζητήστε στο marketplace για «Custom Code» ή «Header Footer Scripts»
4. Εγκαταστήστε μια ενότητα όπως "Custom JS and CSS" ή παρόμοια
5. Μόλις εγκατασταθεί, μεταβείτε στη διαμόρφωση της ενότητας
6. Βρείτε την ενότητα «Footer Scripts» ή «Before </body>»
7. Επικολλήστε τον κωδικό ενσωμάτωσης Asyntai
8. Κάντε κλικ στο «Αποθήκευση»

Εναλλακτικά: Επεξεργασία Προτύπου Θέματος (PrestaShop 1.7+/8)

Μπορείτε να προσθέσετε τον κώδικα απευθείας στο πρότυπο υποσέλιδου του θέματός σας:

1. Αποκτήστε πρόσβαση στα αρχεία PrestaShop σας μέσω FTP ή διαχειριστή αρχείων
2. Μεταβείτε στον φάκελο θέματός σας: themes/your_theme/templates/_partials/
3. Ανοίξτε το αρχείο footer.tpl (ή σε ορισμένα θέματα, ελέγξτε το templates/layouts/layout-both-columns.tpl)
4. Βρείτε την ετικέτα κλεισίματος </body> ή την ενότητα {block name='javascript_bottom'}
5. Επικολλήστε τον κώδικα ενσωμάτωσης Asyntai ακριβώς πριν την ετικέτα κλεισίματος </body>
6. Αποθηκεύστε το αρχείο
7. Εκκαθαρίστε την κρυφή μνήμη PrestaShop: Advanced Parameters → Performance → Clear cache

Εναλλακτικά: Χρήση Προσαρμοσμένου Αρχείου JavaScript του Θέματος

Πολλά θέματα PrestaShop περιλαμβάνουν ένα αρχείο custom.js για τα δικά σας script:

1. Μεταβείτε στο: themes/your_theme/assets/js/
2. Αναζητήστε ένα αρχείο με όνομα custom.js (δημιουργήστε το αν δεν υπάρχει)
3. Προσθέστε τον παρακάτω κώδικα για δυναμική φόρτωση του chatbot:
   (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. Αντικαταστήστε το YOUR_WIDGET_ID με το πραγματικό widget ID σας
5. Εκκαθαρίστε την κρυφή μνήμη PrestaShop

Εναλλακτικά: Δημιουργία Απλής Ενότητας (Για Προγραμματιστές)

Για προγραμματιστές, μπορείτε να δημιουργήσετε μια απλή ενότητα χρησιμοποιώντας το hook displayFooter:

1. Δημιουργήστε έναν φάκελο: modules/asyntaichatbot/
2. Δημιουργήστε το 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>(function(){var l=function(){var s=document.createElement("script");s.src="https://widget.asyntai.com/static/js/chat-widget.js";s.async=true;s.setAttribute("data-asyntai-id","YOUR_WIDGET_ID");document.head.appendChild(s)};if(document.readyState==="complete"){l()}else{window.addEventListener("load",l)}})();</script>';
  }
}
3. Αντικαταστήστε το YOUR_WIDGET_ID με το πραγματικό widget ID σας
4. Εγκαταστήστε την ενότητα μέσω Modules → Module Manager

Βήμα 3: Επαληθεύστε την Εγκατάσταση

Αφού αποθηκεύσετε τις αλλαγές σας και εκκαθαρίσετε την κρυφή μνήμη, επισκεφτείτε το κατάστημά σας σε μια νέα καρτέλα ή παράθυρο ανώνυμης περιήγησης. Θα πρέπει να δείτε το κουμπί της γραφικής εφαρμογής συνομιλίας στην κάτω δεξιά γωνία. Κάντε κλικ για να βεβαιωθείτε ότι ανοίγει και λειτουργεί σωστά.