Cómo añadir el chatbot de IA de Asyntai a PrestaShop

Plataforma:

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

Paso 1: Obtén su código de inserción

Primero, ve a su Panel de control de Asyntai y desplácese hasta la sección "Código de inserción". Copie su código de inserción único que se verá así:

Paso 2: Usar el módulo de código personalizado (Recomendado)

La forma mas fácil de agregar el chatbot es usando un modulo gratuito de "Custom Code" del marketplace de PrestaShop Addons:

1. Inicia sesión en su Back Office de PrestaShop
2. Ve a Modules → Module Manager
3. Haga clic en "Upload a module" o busque en el marketplace "Custom Code" o "Header Footer Scripts"
4. Install a module like "Custom JS and CSS" or similar
5. Una vez instalado, ve a la configuración del módulo
6. Encuentra la sección "Footer Scripts" o "Before </body>"
7. Pegue su código de inserción de Asyntai
8. Haga clic en "Save"

Alternativa: Editar la plantilla del tema (PrestaShop 1.7+/8)

You can add the code directly to your theme's footer template:

1. Access your PrestaShop files via FTP or file manager
2. Navegue a la carpeta de su tema: themes/your_theme/templates/_partials/
3. Abra el archivo footer.tpl (o en algunos temas, revise templates/layouts/layout-both-columns.tpl)
4. Encuentra la etiqueta de cierre </body> o la sección {block name='javascript_bottom'}
5. Pegue su código de inserción de Asyntai justo antes de la etiqueta de cierre </body>
6. Guarde el archivo
7. Vacia la cache de PrestaShop: Advanced Parameters → Performance → Clear cache

Alternativa: Usar el archivo JavaScript personalizado del tema

Many PrestaShop themes include a custom.js file for your own scripts:

1. Navegue a: themes/your_theme/assets/js/
2. Busque un archivo llamado custom.js (crealo si no existe)
3. Añada el siguiente código para cargar dinámicamente el 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. Reemplaza YOUR_WIDGET_ID con su ID de widget real
5. Limpie la caché de PrestaShop

Alternativa: Crear un módulo simple (Para desarrolladores)

Para desarrolladores, puede crear un modulo simple usando el hook displayFooter:

1. Cree una carpeta: modules/asyntaichatbot/
2. Cree asyntaichatbot.php con este código:
   <?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. Reemplaza YOUR_WIDGET_ID con su ID de widget real
4. Install the module via Modules → Module Manager

Paso 3: Verificar la instalación

Después de guardar sus cambios y vaciar la cache, visite su tienda en una nueva pestana del navegador o en una ventana de incognito. Deberias ver el botón del widget de chat en la esquina inferior derecha. Haga clic en el para asegurarte de que se abra y funciona correctamente.