Cómo añadir el chatbot de IA de Asyntai a Adobe Commerce (Magento)

Guía paso a paso para sitios web de Magento

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: Usar Page Builder (Recomendado)

La forma mas fácil de agregar el chatbot es usando el bloque de código HTML del Page Builder:

Log in to your Magento Admin Panel
Ve a Content → Pages
Edita su página de inicio (o cualquier página donde desees el chatbot)
En el Page Builder, arrastre un elemento "HTML Code" a la página
Pegue su código de inserción de Asyntai
Haga clic en "Save"
Vacia la cache: System → Cache Management → Flush Magento Cache

Importante: Usar Page Builder agrega el código solo a páginas individuales. Para una instalación en todo el sitio, use el método Layout XML a continuacion.

Alternativa: Usar Layout XML (Todas las páginas)

To add the chatbot to all pages, create a layout file in your theme:

Navegue a la carpeta de su tema: app/design/frontend/[Vendor]/[theme]/
Cree la estructura de carpetas si no existe: Magento_Theme/layout/
Cree o edita el archivo default_head_blocks.xml
Añada el siguiente código:
<?xml version="1.0"?> <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"> <head> <script src="https://asyntai.com/static/js/chat-widget.js" src_type="url" async="true" data-asyntai-id="YOUR_WIDGET_ID"/> </head> </page>
Reemplaza YOUR_WIDGET_ID con su ID de widget real
Ejecuta: bin/magento cache:flush
Ejecuta: bin/magento setup:static-content:deploy -f (si estas en modo producción)

Alternativa: Usar bloque CMS

También puede crear un bloque CMS e incluirlo en su pie de página:

Ve a Content → Blocks
Haga clic en "Add New Block"
Establece un título como "Asyntai Chatbot"
Establece el identificador como asyntai_chatbot
In the content editor, switch to HTML mode and paste your embed code
Haga clic en "Save Block"
Añada el bloque a su plantilla del pie de página usando: {{block id="asyntai_chatbot"}}
Limpie la caché

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.