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

Guía paso a paso para sitios web de OpenCart

Plataforma:

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

<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></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.

Paso 2: Editar la plantilla del pie de página (Recomendado)

La forma mas 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
Vacia la cache de OpenCart: Dashboard → Icono de engranaje azul (arriba a la derecha) → Refresh o elimina el contenido de system/storage/cache/

Consejo: Si estas usando el tema predeterminado, la ruta seria catalog/view/theme/default/template/common/footer.twig. Siempre cree una copie de seguridad antes de editar archivos de plantilla.

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

Many modern OpenCart themes include a built-in option for custom code:

Log in to your OpenCart Admin Panel
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 edicion de plantillas o instale una extension.

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

Puede instalar una extension gratuita del OpenCart Marketplace para agregar scripts personalizados:

Ve al OpenCart Marketplace
Busque "Custom Script", "Header Footer Scripts" o "Custom Code"
Descarga e instale una extensión adecuada
En su panel de administracion, ve a Extensions → Extensions → Modules
Busque e instale el módulo de código personalizado
Configure el modulo y pegue su código de inserción de Asyntai en la sección de pie de página
Guarde y limpia la caché

Importante: Se recomienda usar extensiones en lugar de editar archivos del nucleo, 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 programatica 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, necesitaras modificar el footer.twig para incluirlo manualmente, o agregar JavaScript en linea después del bucle de scripts

Nota: Para que el widget funcione correctamente con el atributo data, el método de plantilla es mas 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 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.

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