---
title: Cómo instalar el agente en Shopify
description: Dónde insertar el código en el tema de Shopify, cómo el agente lee el catálogo de la tienda, qué hacer con el carrito y el pago, y cómo verificar la instalación.
section: platforms
keywords: Shopify, widget Shopify, theme.liquid, chat Shopify, agente IA Shopify, asistente virtual Shopify, instalación Shopify, integración Shopify, chatbot para tienda online, catálogo Shopify, soporte Shopify, atención al cliente Shopify
updated: 2026-09-06
---
Shopify ya cuenta con un catálogo en formato legible por máquina, por eso el agente recopila los productos con mayor precisión que en cualquier otro lugar: los precios, variantes, disponibilidad y fotos provienen directamente de la tienda.

## Paso 1. Inserta el código en el tema

1. En el panel de administración de Shopify, abre **Online Store → Themes**.
2. En el tema activo, haz clic en **… → Edit code**.
3. En la lista de archivos, busca `layout/theme.liquid`.
4. Inserta la línea de código de tu panel de control justo antes de la etiqueta de cierre `</body>`.
5. Guarda.

Alternativa sin editar el tema: **Online Store → Preferences → Custom code** o cualquier aplicación para insertar scripts. El resultado es el mismo.

```liquid
    <!-- Commerce Agents -->
`<script src="https://comag.vibevox.pro/widget.js" data-slug="tu-slug" async></script>`
  </body>
</html>
```

Obtén la línea exacta en tu panel de control con el botón «Copiar código»: ya incluye la dirección de tu tienda.

## Paso 2. Recopila el catálogo

En la configuración, indica la dirección de la tienda e inicia el análisis. El rastreador de Shopify lee los datos estructurados de los productos: nombre, precio, moneda, disponibilidad, descripción y fotos. Las variantes (tallas, colores) aparecen en la ficha como características.

Un nuevo análisis actualiza los precios y la disponibilidad. Ejecútalo después de cambios importantes en el surtido: el agente no se conecta directamente a tu base de datos, sino que trabaja con el catálogo recopilado.

## Paso 3. Deja el pago a la tienda

En Shopify, no es necesario activar el pago en el chat. El esquema correcto es:

1. En la configuración de la tienda, indica el enlace al carrito, normalmente `https://tu-dominio/cart`.
2. El agente selecciona el producto, muestra la ficha y, mediante un botón, lleva al comprador al carrito de Shopify.
3. El proceso de compra y pago sigue el camino habitual, con todas tus reglas de envío e impuestos.

Para ver qué diálogos terminan en compra, inserta el fragmento del píxel de compra en la página de agradecimiento. En Shopify, esto es **Settings → Checkout → Order status page → Additional scripts**. El fragmento con la sustitución del número de pedido y el importe se encuentra en tu panel de control, en la sección «Widget y enlace».

## El producto se añade al carrito sin interrumpir la conversación

Aquí Shopify se destaca sobre otras plataformas. El agente muestra fichas de productos con foto, precio y un botón, pero este botón no solo lleva a la página, sino que añade el producto al carrito de la tienda.

Funciona así: el enlace del producto de Shopify contiene un identificador de variante, y el agente lo envía a tu propio carrito a través de la interfaz estándar `/cart/add.js`. La página no se recarga, el diálogo no se interrumpe, el comprador ve una breve confirmación y sigue eligiendo. El producto ya está en el carrito de Shopify, con todas tus reglas de descuentos, impuestos y envío.

Si no hay una variante en el enlace, el agente abre la ficha del producto y el comprador lo añade por sí mismo. Nada se rompe, solo es un clic más.

Cuando el usuario está listo, el botón «Ir a la compra» lleva a `/cart`, donde ya está todo preparado. A partir de ahí, es la caja habitual de Shopify.

Y un apunte sobre el contexto: el agente lee los datos estructurados de la página donde se abre el chat. El comprador mira un producto específico y pregunta «¿lo tienen en talla L?»; el agente entiende a qué se refiere sin necesidad de preguntar de nuevo.

- Abre la tienda en modo incógnito, espera a que aparezca el botón del chat.
- Pregunta por un producto por su nombre; debería aparecer una ficha con el precio.
- Haz clic en «Ir a la compra»; debería abrirse el carrito de Shopify.
- Realiza un pedido de prueba y asegúrate de que la compra se registre en «Solicitudes».

## Chat a juego con la tienda

El tema de Shopify marca el estilo de toda la tienda, y el chat no debería desentonar. En la configuración del widget hay tres opciones: claro, oscuro y «como el del visitante», que sigue la configuración del dispositivo del comprador.

Para tiendas con tema oscuro, configura el oscuro de forma fija; para las claras, el claro. El color de acento de los botones sigue siendo el tuyo en ambos casos.

## Paso 4. Comprueba

## Problemas frecuentes

- El widget desapareció después de cambiar el tema. El código reside en el archivo del tema. Un cambio o actualización del tema borra la modificación; inserta el código de nuevo o usa Custom code, que no depende del tema.
- El catálogo no se recopiló por completo. El rastreo toma productos de páginas públicas. Los productos ocultos del catálogo y los borradores no se incluyen, lo cual es correcto.
- Los precios del catálogo están desactualizados. Ejecuta el análisis del sitio de nuevo; actualizará los precios y la disponibilidad de las fichas existentes.
- El widget entra en conflicto con la aplicación de chat. Deja un solo chat: dos ventanas en la misma esquina se estorban y confunden al comprador.

## Preguntas frecuentes

### ¿Se necesita una aplicación de Shopify App Store?

No. El agente se conecta con una sola línea de código, no es necesario instalar ninguna aplicación.

### ¿Puede el agente mostrar variantes de productos?

Sí, las variantes aparecen en la ficha como características: talla, color, volumen. El comprador elige la variante específica en el carrito de Shopify.

### ¿Qué pasa con varias monedas?

El agente muestra los precios en la moneda del catálogo, que determina durante el rastreo. La funcionalidad multimoneda de Shopify opera más adelante, en el carrito y el pago.

### ¿Conocerá el agente el stock disponible?

La disponibilidad se toma en el momento del análisis. Para productos que se agotan con frecuencia, ejecuta el análisis más a menudo o añade una línea en las condiciones indicando que la disponibilidad se confirma al finalizar la compra.

### ¿Afecta el widget a la velocidad de la tienda?

El script se carga de forma asíncrona y no bloquea el renderizado. Esto prácticamente no afecta a las métricas de Core Web Vitals.
