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

Guía paso a paso para sitios web de Squarespace

Plataforma:

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

Primero, vaya a su panel de Asyntai y desplácese hacia abajo hasta la sección "Embed Code". Copie su código de inserción único, que tendrá este aspecto:

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

Paso 2: Añadir el código con Code Injection

Si su sitio tiene un plan Squarespace Core, Plus o Advanced (o un plan Business o Commerce antiguo), puede añadir el chatbot a todas las páginas a la vez con Code Injection:

Inicia sesión en tu cuenta de Squarespace y abre tu sitio
Haga clic en Pages en el panel izquierdo
Haga clic en Custom Code en la parte inferior del panel
Haga clic en Code Injection
Desplácese hasta la sección Footer
Pega tu código de incrustación de Asyntai en el cuadro de texto del pie de página
Haga clic en "Save"

Nota: En Squarespace 7.0, Code Injection se encuentra en Pages → Website Tools.

Consejo: Agregar el código en la sección Footer lo coloca justo antes de la etiqueta de cierre </body>, que es la ubicación recomendada para widgets de chat y no ralentizará la carga de su página.

Alternativa: Usar bloques de código

Para añadir el chatbot solo en páginas concretas, puede usar bloques de código (Code Blocks). Un bloque de código solo ejecuta JavaScript con un plan Core, Plus o Advanced (o un plan Business o Commerce antiguo).

Abra su sitio en el editor de Squarespace
Navegue a la página donde deseas añadir el chatbot
Haga clic en "Edit" en la página
Pasa el cursor sobre una sección y haz clic en "+ Agregar bloque"
Desplácese hacia abajo y seleccione "Code"
Haz clic en el icono de lápiz para editar el bloque de código
Pegue su código de inserción de Asyntai
Asegúrese de que el menú Mode del bloque esté configurado en HTML
Haga clic fuera del bloque para cerrar el editor
Haga clic en "Save"

Importante: Al usar bloques de código, deberá añadir el código en cada página donde quiera que aparezca el chatbot. Para instalarlo en todo el sitio, use el método Code Injection descrito arriba.

Paso 3: Verificar la instalación

Después de guardar sus cambios, abra su sitio web 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? Asegúrese de haber guardado y publicado sus cambios. Intente limpiar la caché del navegador o ver su sitio en una ventana de incógnito. Squarespace puede tardar unos minutos en aplicar los cambios de código. A veces el código no se ejecuta mientras tiene la sesión iniciada en Squarespace, así que compruebe el sitio en una ventana privada.

Añadir la barra de búsqueda con IA

La barra de búsqueda con IA es un widget aparte con su propio código. Añádala junto al chat, o sola. Requiere el plan Standard o superior: en un plan inferior la barra aparece pero no devuelve resultados.

Añade el atributo data-replace a la etiqueta script y la barra sustituirá a la que ya tiene tu tema. Añádalo en Pages, Custom Code, Code Injection, Footer, en el mismo lugar que el código del chat. Squarespace solo ofrece Code Injection con un plan Core, Plus o Advanced (o un plan Business o Commerce antiguo), así que necesita uno de ellos para instalar esto.

<script src="https://widget.asyntai.com/static/js/search-widget.js" data-asyntai-id="YOUR_WIDGET_ID" data-replace="auto" async></script>