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

Guía paso a paso para sitios web de OpenCart

Plataforma:

The Easy Way: Install the Asyntai Extension

We publish a free extension on the OpenCart Marketplace. It puts the chatbot on your storefront and connects your account, and there is no code to copy and no template to edit. It works on OpenCart 3.x and 4.x.

Download Asyntai - AI Chatbot from the OpenCart Marketplace
In your admin panel, go to Extensions → Installer and upload the ZIP file
Go to Extensions → Extensions, choose Modules in the list, find Asyntai AI Chatbot and press the green install button
Press edit, then press Connect to Asyntai. A window opens where you sign in or create an account.

That is all. The chatbot is live on your storefront when the window closes.

Your products, prices and stock

When you connect, the extension also lets Asyntai read your catalogue. Your assistant then answers with the price you charge today and tells shoppers what is in stock, instead of repeating whatever your pages said when they were last read.

Asyntai reads your products through a read-only address on your own store. Every request is signed, and the reply carries the prices a shopper would actually pay, with your tax rules already applied. You can switch this off at any time on the extension's settings screen.

Updating from version 1.0.0? OpenCart clears a module's settings when you uninstall it, so press Connect to Asyntai once after the update. From this version on, updates keep your connection.

Or Add the Code Yourself

Prefer not to install an extension? The rest of this page shows how to add the chatbot by hand. You will not get the catalogue reading this way.

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

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

<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>

Nota: El código anterior es solo un ejemplo. Debe copiar su propio código de inserción único desde su Panel de control ya que contiene su ID de widget personal.

Step 2: Edit Footer Template

La forma más directa de agregar el chatbot es editando la plantilla de pie de página de su tema:

Acceda a sus archivos de OpenCart vía FTP o administrador de archivos
Navegue a la plantilla del pie de página de su tema:
- OpenCart 3.x/4.x: catalog/view/theme/YOUR_THEME/template/common/footer.twig
- OpenCart 2.x: catalog/view/theme/YOUR_THEME/template/common/footer.tpl
Abra el archivo del pie de página para editarlo
Encuentra la etiqueta de cierre </body>
Pegue su código de inserción de Asyntai justo antes de la etiqueta </body>
Guarde el archivo
Vacíe la caché de OpenCart: Dashboard → Icono de engranaje azul (arriba a la derecha) → Refresh o elimine el contenido de system/storage/cache/

Consejo: Si está usando el tema predeterminado, la ruta sería catalog/view/theme/default/template/common/footer.twig. Siempre cree una copia de seguridad antes de editar archivos de plantilla.

Alternativa: Usar la opción de código personalizado del tema

Muchos temas modernos de OpenCart incluyen una opción integrada para código personalizado:

Inicia sesión en tu panel de administración de OpenCart
Ve a Extensions → Themes (o Extensions → Extensions → Themes)
Haga clic en Edit en su tema activo
Busque una sección de "Custom Code", "Footer Scripts" o "Custom JavaScript"
Pegue su código de inserción de Asyntai
Haga clic en "Save"
Limpie la caché

Nota: No todos los temas tienen esta opción. Si su tema no incluye campos de código personalizado, use el método de edición de plantillas o instale una extensión.

Alternativa: Usar una extensión de código personalizado

Puede instalar una extensión gratuita del OpenCart Marketplace para agregar scripts personalizados:

Go to the OpenCart Marketplace
Busque "Custom Script", "Header Footer Scripts" o "Custom Code"
Descargue e instale una extensión adecuada
En su panel de administración, vaya a Extensions → Extensions → Modules
Busque e instale el módulo de código personalizado
Configure el módulo y pegue su código de inserción de Asyntai en la sección de pie de página
Guarde y limpie la caché

Importante: Se recomienda usar extensiones en lugar de editar archivos del núcleo, ya que sobreviven a las actualizaciones de OpenCart. Las extensiones populares incluyen "Custom Script in Header & Footer" disponible en el marketplace.

Alternativa: Usar el método addScript (Para desarrolladores)

Para desarrolladores, OpenCart 3.x/4.x proporciona una forma programática de agregar scripts:

Abra catalog/controller/common/footer.php
Agrega la siguiente linea antes de $data['scripts'] = $this->document->getScripts('footer');:
$this->document->addScript('https://asyntai.com/static/js/chat-widget.js', 'footer');
Para el atributo data, necesitará modificar el footer.twig para incluirlo manualmente, o agregar JavaScript en línea después del bucle de scripts

Nota: Para que el widget funcione correctamente con el atributo data, el método de plantilla es más simple ya que el método addScript no admite atributos personalizados directamente.

Paso 3: Verificar la instalación

Después de guardar sus cambios y vaciar la caché, visite su tienda en una nueva pestaña del navegador o en una ventana de incógnito. Debería ver el botón del widget de chat en la esquina inferior derecha. Haga clic en él para asegurarse de que se abra y funcione correctamente.

¿No ves el widget? Asegurate de vaciar la cache de OpenCart. Ve a su panel de administracion, haga clic en el icono de engranaje azul en la esquina superior derecha y haga clic en los botones de actualizar. También intenta limpiar la cache del navegador o ver la página en una ventana de incognito. Si modificaste el archivo de plantilla incorrecto, verifique que su tema este usando el archivo que editaste.

Documentación