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

Guía paso a paso para tiendas WooCommerce

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: Usar un plugin (recomendado)

La forma más fácil de agregar el chatbot a su tienda WooCommerce es usando un plugin gratuito de encabezado/pie de página:

Inicia sesión en tu panel de administración de WordPress
Ve a Plugins → Add New
Busque "Insert Headers and Footers" de WPCode (o un plugin similar)
Haga clic en "Install Now" y luego en "Activate"
Ve a Code Snippets → Header & Footer (o la página de configuración del plugin)
Pegue su código de inserción de Asyntai en la sección "Footer"
Haga clic en "Save Changes"

Consejo: Agregar el código en el pie de página asegura que se cargue después del contenido de su tienda, lo cual es ideal para widgets de chat y no ralentizará la carga de su página ni interferirá con la funcionalidad de WooCommerce.

Alternativa: usar el personalizador de temas

Muchos temas de WooCommerce tienen opciones integradas para agregar scripts personalizados:

Ve a Appearance → Customize
Busque una sección llamada "Additional CSS/JS", "Custom Code" o "Footer Scripts"
Pegue su código de inserción de Asyntai en el campo correspondiente
Haga clic en "Publish" para guardar sus cambios

Nota: No todos los temas tienen esta opción. Si su tema no incluye campos de script personalizados, use el método del plugin o edite el archivo functions.php de su tema.

Alternativa: editar archivos del tema (functions.php)

Para desarrolladores o quienes se sientan cómodos editando archivos de tema:

Ve a Appearance → Theme File Editor
Seleccione su tema activo (o preferiblemente su tema hijo)
Abra el archivo functions.php
Añada el siguiente código al final del archivo:
function add_asyntai_chatbot() { echo '<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>'; } add_action('wp_footer', 'add_asyntai_chatbot');
Reemplaza YOUR_WIDGET_ID con su ID de widget real
Haga clic en "Update File"

Importante: Siempre use un tema hijo al editar archivos de tema. Los cambios en el tema principal se perderán cuando actualice su tema. Si no se siente cómodo editando código, use el método del plugin en su lugar.

Alternativa: Hook específico de WooCommerce

Para cargar el chatbot solo en páginas de WooCommerce (tienda, producto, carrito, pago):

Agrega este código al archivo functions.php de tu tema:
function add_asyntai_chatbot_woocommerce() { if (is_woocommerce() || is_cart() || is_checkout() || is_account_page()) { echo '<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>'; } } add_action('wp_footer', 'add_asyntai_chatbot_woocommerce');
Reemplaza YOUR_WIDGET_ID con su ID de widget real
Guarde el archivo

Consejo: Este método es útil si solo quiere que el chatbot de IA aparezca en las páginas de su tienda para ayudar a los clientes con productos y pedidos, en lugar de en todo su sitio web.

Paso 3: Verificar la instalación

Después de guardar sus cambios, visite su tienda WooCommerce en una nueva pestaña del navegador o 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? Si tiene un plugin de caché instalado (como WP Super Cache, W3 Total Cache o WP Rocket), borre su caché primero. También intente borrar la caché de su navegador o verlo en una ventana de incógnito.