Cómo añadir el chatbot IA de Asyntai a Backdrop CMS

Guía paso a paso para sitios web de Backdrop CMS

Plataforma:

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

Primero, ve a tu Panel de control de Asyntai y desplázate hasta la sección "Código de inserción". Copia tu 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: Añadir a la plantilla del tema (Recomendado)

Backdrop CMS usa archivos de plantilla .tpl.php en sus temas. El enfoque recomendado es añadir el código de inserción directamente a la plantilla de página de su tema activo:

Acceda a su instalación de Backdrop CMS vía FTP o Administrador de archivos
Navegue al directorio de su tema activo: themes/yourtheme/
Abra el archivo page.tpl.php (o layout.tpl.php dependiendo de su tema)
Encuentra la etiqueta de cierre </body> o la línea <?php print $page_bottom; ?>
Pegue su código de inserción de Asyntai justo antes de esa línea
Guarde el archivo

<!-- Asyntai AI Chatbot -->
<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
<?php print $page_bottom; ?>
</body>

Consejo: Colocar el código justo antes de <?php print $page_bottom; ?> o la etiqueta de cierre </body> asegura que el chatbot se cargue después del contenido de la página, proporcionando mejor rendimiento de carga. Este método añade automáticamente el chatbot a cada página que use este tema.

Método alternativo 1: Usando un módulo personalizado

Puede crear un módulo simple de Backdrop CMS que inyecte el script del chatbot usando backdrop_add_js():

Cree el directorio del módulo: modules/custom/asyntai_widget/
Cree el archivo del módulo asyntai_widget.module con el siguiente código:
// modules/custom/asyntai_widget/asyntai_widget.module function asyntai_widget_init() { backdrop_add_js('https://asyntai.com/static/js/chat-widget.js', array( 'type' => 'external', 'scope' => 'footer', 'attributes' => array('async' => 'async', 'data-asyntai-id' => 'YOUR_WIDGET_ID'), )); }
Cree el archivo asyntai_widget.info:
name = Asyntai AI Chatbot Widget description = Adds the Asyntai AI chatbot widget to all pages. backdrop = 1.x package = Custom type = module
Ve a Functionality (admin/modules) en su panel de administración de Backdrop
Encuentra "Asyntai AI Chatbot Widget" bajo el paquete Custom y habilítalo
Haga clic en "Save configuration"

Nota: Reemplaza YOUR_WIDGET_ID en el código del módulo con su ID de widget real del Panel de control de Asyntai. El enfoque de módulo personalizado es seguro ante actualizaciones y no se sobrescribirá al actualizar su tema.

Método alternativo 2: Usando el módulo "Add to Head" de Backdrop

El módulo contribuido "Add to Head" proporciona una forma fácil de inyectar scripts sin editar código:

Descarga e instale el módulo contribuido "Add to Head" desde el sitio web de Backdrop CMS
Ve a Configuration > Development > Add to Head
Agrega tu código de incrustación de Asyntai en la sección del pie de página
Haga clic en "Save configuration"

Consejo: Usar el módulo "Add to Head" es el método más fácil si prefieres no editar archivos de tema o crear módulos personalizados. Proporciona una interfaz de administración simple para gestionar scripts inyectados.

Método alternativo 3: Usando el sistema de bloques

El sistema de diseño y bloques de Backdrop CMS también se puede usar para añadir el chatbot:

Inicia sesión en tu panel de administración de Backdrop CMS
Ve a Structure > Layouts
Seleccione el diseño que deseas editar (ej., el diseño predeterminado)
Haga clic en "Add block" en la región del pie de página
Elija "Custom block"
Establece el formato del bloque como "Full HTML" o "Raw HTML"
Pegue su código de inserción de Asyntai en el cuerpo del bloque
Dale un título al bloque (ej., "Asyntai Chatbot") y opcionalmente marca "Hide title"
Haga clic en "Save block" y luego "Save layout"

Importante: Asegúrese de que el formato de texto esté configurado como "Full HTML" o "Raw HTML" para que la etiqueta script no se elimine. El formato predeterminado "Filtered HTML" eliminará las etiquetas script por razones de seguridad.

Paso 3: Limpiar caché y verificar

Después de realizar sus cambios, limpia la caché de Backdrop CMS y verifique la instalación:

Ve a Configuration > Performance en su panel de administración
Haga clic en "Clear all caches"
Abre tu sitio web en una nueva pestaña del navegador o ventana de incógnito
Deberías ver el botón del widget de chat en la esquina inferior derecha
Haz clic en él para asegurarte de que se abre y funciona correctamente

¿No ves el widget? Asegúrese de haber limpiado la caché de Backdrop CMS en Configuration > Performance. Intenta ver su sitio en una ventana de incógnito o limpia la caché de su navegador. Abra la consola del navegador (F12) para verificar errores de JavaScript. Si usaste el método de módulo personalizado, verifique que el módulo esté habilitado en Functionality.