Cómo crear un asistente de compras con IA para Shopify

Un asistente de compras con IA para Shopify ayuda a un visitante a describir lo que necesita, busca en tu catálogo y explica un conjunto pequeño de productos coincidentes. En este tutorial, crearás uno que pregunta sobre preferencias de uso, compara snowboards dentro de un presupuesto y comprueba un color o una talla solicitados antes de afirmar algo sobre disponibilidad.

El ejemplo es Quickboards, una tienda ficticia de snowboards. Construimos su agente en una Quickchat AI App ejecutada localmente, la conectamos a un catálogo de demostración real de Shopify y grabamos las conversaciones que aparecen abajo. Las tarjetas de producto contienen imágenes reales del catálogo y precios de demostración. La ilustración alpina es una imagen editorial generada con IA, no otro producto en venta.

También aprenderás a inspeccionar las herramientas detrás de una respuesta, probar el asistente por lotes y, de forma opcional, seguir un carrito hasta AI-Assisted Revenue. El ejemplo de atribución usa un pedido de demostración local claramente etiquetado, no una venta real.

La experiencia final es una página dedicada de búsqueda de productos con una conversación inline:

La página de demostración ejecutada localmente usa el Quickchat AI Embed real y el catálogo de Shopify en vivo. No es una captura de pantalla de un tema de Shopify publicado. En la sección de pruebas aparece una vista más cercana de las recomendaciones.

La comprobación importante viene después de que la conexión se realiza correctamente. Nuestro catálogo mencionaba longitudes de 144 a 160 cm en una descripción, pero no exponía una opción Size seleccionable. La prueba de variantes muestra cómo el agente gestiona esa brecha sin prometer una tabla de 156 cm.

¿Qué vas a crear y qué necesitas?

Crearás un buscador conversacional de productos que recopila tres preferencias útiles, muestra como máximo dos recomendaciones y permite que el comprador refine la elección.

Esta es una implementación específica de un chatbot de recomendación de productos. Admite un resumen como “rider intermedio, pistas preparadas, máximo $800”, así como un visitante que necesita ayuda para articular esas preferencias. No exige que todos los visitantes completen el mismo cuestionario.

Antes de empezar:

1. Crea una cuenta de Quickchat AI, o usa una existente. Free incluye acceso MCP y 50 créditos mensuales de IA para pruebas personales y no comerciales. Las conversaciones y pruebas de Simulation consumen créditos. Para una implementación para un comerciante, elige un plan de uso comercial.
2. Ten lista la URL raíz de tu tienda Shopify, por ejemplo https://your-store.myshopify.com. Para reproducir nuestras pruebas específicas de catálogo, usa https://quickchat-ai.myshopify.com, la tienda de demostración de Quickchat AI. Sus datos de demostración pueden cambiar; comprueba los resultados actuales antes de comparar precios.
3. Para la implementación, ten permiso para editar tu sitio web o tema de Shopify. Un tema con una sección Custom Liquid, como Dawn, puede alojar el fragmento inline. También puedes usar la plantilla completa de página independiente.

Empieza con el buscador solo de comparación en los pasos 1 a 7. Las secciones opcionales luego añaden creación de carrito, atribución de pedidos y canales de mensajería. El agente nunca cobra pagos ni reserva inventario; el comprador completa cualquier compra en el checkout de Shopify.

¿Ya estás evaluando distintas apps de Shopify? Nuestra comparación de chatbots con IA para Shopify cubre esa decisión. Esta guía se centra en construir y probar el flujo de búsqueda de productos.

¿Cómo elige el asistente productos de Shopify?

El agente combina las preferencias del comprador con los datos de producto devueltos por Shopify y luego explica una lista breve en la conversación.

El comprador proporciona las restricciones. Shopify proporciona los datos de producto. El modelo decide qué candidatos devueltos encajan y cómo explicarlos.

Shopify MCP es la conexión entre el agente y las herramientas anunciadas por la tienda. MCP significa Model Context Protocol. Introduces la URL de la tienda; Quickchat AI gestiona el descubrimiento de herramientas y las solicitudes al catálogo. No hay una acción REST personalizada, cuerpo de solicitud ni clave de Shopify Admin API para pegar en esta receta.

Esa división importa cuando pruebas:

Un resultado de búsqueda es un candidato. Aun así, puede ser de la categoría incorrecta o una mala coincidencia. Del mismo modo, que un producto exista en el catálogo no prueba que cada combinación de color y talla esté disponible.

Shopify documenta la interfaz de la herramienta de catálogo en su guía Storefront Catalog MCP. Para más detalles sobre los problemas de datos de producto detrás de esta integración, consulta nuestras notas de ingeniería sobre Shopify MCP.

¿Cómo creas el asistente de compras?

Crea el agente manualmente, asígnale una tarea de búsqueda de productos y deja los precios fuera de su Knowledge Base.

Paso 1. Completa la configuración inicial

1. Regístrate con Google o correo electrónico. Si usas correo electrónico, sigue el correo de verificación antes de iniciar sesión.
2. En la pantalla de configuración inicial, elige Set up manually.
3. En Identity, introduce Quickboards Guide en Name your AI Agent. En Describe what you want your agent to do, introduce:

Eres Quickboards Guide, el asistente de compras de Quickboards, una tienda de demostración de snowboards. Ayuda a los visitantes a encontrar un snowboard que se adapte a su estilo de riding y presupuesto. Usa el catálogo de Shopify conectado para productos y precios. Haz preguntas de seguimiento útiles, explica tus recomendaciones brevemente y muestra tarjetas de producto. Sé conciso y amable. Esta es una conversación de buscador de productos: compara productos y comprueba detalles, pero no crees ni cambies un carrito ni inicies el checkout. No inventes especificaciones de producto, disponibilidad ni políticas.

4. Haz clic en Next. En Knowledge Base, deja vacías las opciones de importación para este ejemplo solo de catálogo y luego haz clic en Next.
5. En External apps, selecciona Shopify y luego Next. Esto registra la integración que quieres; la conexión real viene en el paso 2.
6. En Deployment, selecciona Chat embed y luego Next. Esto todavía no publica nada.
7. En Choose your plan, elige Skip for now para continuar en Free. Si aparece un diálogo de oferta, ciérralo y elige Skip for now otra vez.

Para un agente existente, ve directamente a Identity → AI Persona. Configura Name como Quickboards Guide. El campo Main Prompt es donde instalarás las instrucciones probadas en el paso 3.

En la misma pestaña AI Persona, configura Personality como Friendly, Profession como Shopping Assistant, Creativity como Low y Reply Length como Normal para coincidir con esta demostración.

Empieza en Identity en la barra lateral izquierda. AI Persona contiene los ajustes de esta receta; el acercamiento de abajo muestra los campos que debes editar.

El dashboard llama Main Prompt al campo de instrucciones. Abre su control Edit para reemplazar la descripción inicial; los cambios se guardan automáticamente.

Más adelante puedes añadir políticas verificadas de envíos o devoluciones a Knowledge Base. Nuestra guía de configuración de Knowledge Base explica cómo organizar ese contenido. Este ejemplo deja las políticas fuera para que haya una fuente clara para precios, opciones y disponibilidad de productos: el catálogo conectado. No mantengas una segunda lista de precios en el prompt.

Paso 2. Conecta y activa Shopify MCP

1. Abre Actions & MCPs.
2. En Custom Actions, elige Add Action y luego Shopify MCP.
3. En Shopify store URL, introduce la URL raíz:

https://quickchat-ai.myshopify.com

4. Elige Save. La conexión se comprueba antes de guardarse.
5. Activa el interruptor en la tarjeta Shopify Storefront MCP. Guardar mediante este diálogo y activar la acción son pasos separados.

Busca Shopify Storefront MCP en Custom Actions. Su interruptor controla si el agente puede usar la conexión.

Pega la URL raíz de la tienda en Shopify store URL. No añadas un endpoint MCP ni una ruta de producto.

Si tu agente ya tiene una acción de Shopify, usa Edit Action en esa tarjeta en lugar de crear otra conexión. La documentación de implementación de Shopify también describe la ruta independiente de instalación de la app de Shopify. Instalar esa app no es obligatorio para la conexión MCP manual usada aquí.

Para la primera comprobación de conexión, abre AI Preview y pregunta:

Comprueba si el snowboard Iron en Ice está disponible para pedido y cuánto cuesta. No lo añadas a un carrito.

En nuestra fecha de prueba, la variante devuelta estaba disponible a $699.95 USD. Para tu propia tienda, sustituye un producto y una opción cuyo valor actual puedas verificar. Una conexión correcta es necesaria, pero esta respuesta por sí sola no valida todo el buscador.

Paso 3. Pega el Main Prompt completo

Abre Identity → AI Persona → Main Prompt → Edit, reemplaza la descripción inicial con el bloque siguiente y luego cierra el editor después de que se guarde automáticamente. Este es el prompt usado para las pruebas finales. Para otra categoría, reemplaza la identidad de la tienda y las preguntas de preferencia en conjunto; conserva las reglas de anclaje al catálogo y coincidencias faltantes.

Eres Quickboards Guide, el asistente de compras de Quickboards, una tienda de demostración de snowboards. Ayuda a un visitante a reducir el catálogo a una o dos tablas adecuadas y a entender las diferencias. Mantén la conversación concisa, amable y específica. Empieza con la pregunta útil o el dato de producto, sin elogios ni relleno.

Recopila solo las preferencias que importan:
- Para una solicitud amplia como "ayúdame a elegir un snowboard", haz una pregunta breve a la vez. Averigua su nivel de riding, terreno habitual y presupuesto máximo solo para la tabla, con moneda. No busques en el catálogo ni muestres tarjetas de producto hasta conocer estos tres datos.
- Reutiliza los datos ya proporcionados. Si el visitante proporciona los tres en un solo mensaje, pasa directamente a buscar. No conviertas la conversación en un cuestionario fijo.
- Pregunta por una preferencia como color solo cuando cambiaría la lista breve. No preguntes altura ni peso a menos que el catálogo contenga una guía de tallas utilizable. Nunca infieras una longitud de tabla solo a partir de medidas corporales.

Busca y explica una lista breve:
- Consulta el catálogo de Shopify conectado para productos y precios actuales. No uses Knowledge Base, conversaciones anteriores ni tu propia memoria como fuente de precio, opciones o disponibilidad.
- Los resultados de búsqueda son candidatos, no recomendaciones automáticas. Comprueba la categoría, descripción y precio actual del producto frente a cada requisito indicado. Nunca muestres un producto no relacionado solo porque la búsqueda lo devolvió.
- Muestra como máximo dos productos coincidentes. Si solo uno encaja, muestra uno. Para cada uno, nombra el producto, da su precio y moneda actuales, y explica una razón relevante basada en la descripción devuelta. Mantén la explicación de la lista breve por debajo de 90 palabras. Menciona una diferencia solo si los datos devueltos la respaldan; un precio más bajo por sí solo no significa que una tabla sea permisiva o adecuada para principiantes.
- Usa tarjetas de producto para la misma lista breve. No muestres productos adicionales como contexto ni rellenes la respuesta con un catálogo completo.
- No llames a un producto el "mejor", no prometas rendimiento ni declares una especificación técnica exacta a menos que los datos devueltos respalden la afirmación. No repitas texto de marketing exagerado como si fuera un dato medido.

Verifica una variante solicitada:
- Cuando el visitante pregunte por un color, talla u otra opción específica, comprueba la respuesta actual del catálogo para la variante exacta. Si la respuesta no incluye todos los valores de opción solicitados y la disponibilidad de esa variante, usa la herramienta de detalle de producto para inspeccionar el producto y la combinación seleccionada. Nunca infieras disponibilidad solo a partir del título o la descripción del producto.
- Los valores que aparecen por separado en listas de opciones no prueban que su combinación esté disponible. Comprueba la variante exacta devuelta y su disponibilidad.
- Un rango de tallas en una descripción no es una talla seleccionable. Si el catálogo tiene Color pero no opción Size, di que puedes comprobar el color pero no puedes confirmar una longitud específica. No prometas la talla solicitada ni afirmes que existe un selector de talla en la página del producto.
- No prometas que otro producto tiene la opción faltante a menos que lo hayas comprobado. Ofrece comprobar alternativas sin asumir el resultado.
- Da el precio y la moneda actuales de la variante comprobada. Mantén IDs internos de producto, IDs de variante y datos de herramienta sin procesar fuera de la respuesta dirigida al cliente.

Gestiona cambios y coincidencias faltantes:
- Si el visitante cambia el presupuesto, terreno, nivel u otro requisito, vuelve a consultar el catálogo con los requisitos actualizados. Reemplaza la lista breve anterior; no sigas recomendando un producto por encima del nuevo presupuesto.
- Si la búsqueda no devuelve nada adecuado, reintenta una vez con una consulta más simple o un sinónimo. Si ninguno de los conjuntos de resultados contiene una coincidencia, di "No pude encontrar un producto coincidente en este catálogo." No afirmes que una búsqueda vacía o irrelevante prueba que la tienda nunca vende esa categoría.
- Pregunta qué único requisito está dispuesto a relajar el visitante. No relajes silenciosamente presupuesto, talla, categoría ni disponibilidad. No muestres tarjetas de producto cuando no haya una coincidencia adecuada.
- Si la conexión falla, di que no se pudo comprobar el catálogo en vivo y ofrece intentar de nuevo. Nunca llenes el vacío con un producto o precio inventado.

Esta experiencia es un buscador de productos. Solo compara productos y comprueba detalles. No crees ni cambies un carrito, no inicies checkout, no aceptes pagos ni afirmes que un artículo está reservado. Mantén las respuestas en el idioma del visitante. Usa párrafos breves y no uses rayas ni guiones largos.

Estas reglas guían el comportamiento del modelo. No son un límite estricto de tarjetas, un validador de conteo de palabras ni un límite de permisos. En nuestras pruebas, la redacción exacta y la longitud de las respuestas variaron. Las comprobaciones de productos y variantes de abajo importan más que reproducir una frase concreta. Para una acción REST personalizada separada que escribe en tus sistemas, nuestra guía de fiabilidad de AI Action explica condiciones del lado del servidor. Esos controles de acciones personalizadas no son ajustes de la tarjeta nativa de Shopify usada aquí.

¿Cómo pruebas las recomendaciones de producto antes de publicar?

Prueba la conversación de dos maneras: de forma interactiva para los seguimientos y en Simulation Testing para un conjunto repetible de solicitudes independientes.

Una puntuación por lote ayuda a priorizar la inspección. El bucle solo se cierra después de comprobar la respuesta real, los datos del catálogo y las llamadas de herramienta relevantes.

Paso 4. Ejecuta la conversación de compras completa

En AI Preview, inicia una conversación nueva y envía:

Ayúdame a elegir un snowboard.

El agente debe hacer una pregunta útil y no mostrar tarjetas de producto. En una ejecución grabada con el prompt final, preguntó:

¿Cuál es tu nivel actual de riding: principiante, intermedio o avanzado?

Una pregunta, sin lista breve prematura. Las ejecuciones nuevas repetidas deberían conservar ese comportamiento aunque cambie la redacción.

Proporciona las preferencias faltantes. Para probar la ruta directa, inicia otra conversación nueva con este resumen completo:

Soy un rider avanzado, sobre todo en pistas preparadas de resort. Quiero velocidad y giros precisos, con un presupuesto solo para la tabla de $800 USD.

En la demostración insertada, el agente devolvió AI’s board a $629.95 USD y Liquid a $749.95 USD, con dos tarjetas de producto y explicaciones basadas en sus descripciones. Ambos estaban dentro del presupuesto indicado. La selección de productos puede variar cuando varias entradas del catálogo encajan; revisa las razones y restricciones, no solo los nombres de producto.

Las imágenes y enlaces de producto vinieron del catálogo de Shopify. Este es el componente de tarjeta renderizado real, no una maqueta de conversación diseñada.

Luego continúa en la misma conversación:

En realidad, reduce mi presupuesto a $650 USD. Mantén las mismas preferencias de riding.

La demostración reemplazó la lista breve anterior con AI’s board y Neo’s Board, ambos a $629.95 USD. Liquid, a $749.95, ya no aparecía en las nuevas tarjetas. Abre la conversación en Inbox para inspeccionar ambos turnos juntos. Verifica que un cambio de presupuesto cambie los productos propuestos sin reiniciar la entrevista de preferencias.

El presupuesto cambió dentro de la conversación existente. La nueva lista breve excluye la opción anterior que superaba el presupuesto. La etiqueta de presupuesto sobre cada captura de tarjeta es una anotación editorial.

Para el catálogo propio de un comerciante, abre también cada página de producto recomendada. Confirma que el enlace va a la tienda prevista, que el producto existe y que el precio mostrado coincide con el mercado y la variante relevantes. Las páginas públicas de producto de nuestra tienda de demostración están protegidas por contraseña; las capturas prueban la conexión al catálogo y el embed local, no un destino de compras en vivo sin restricciones.

Paso 5. Crea un dataset de Simulation repetible

Añade las siete solicitudes independientes

Abre Testing → Create Dataset. Introduce Quickboards catalog checks en Dataset name, selecciona Paste messages y pega lo siguiente. Cada línea --- separa una prueba independiente, no otro turno en una misma conversación.

El conteo de siete mensajes confirma que los separadores fueron reconocidos. Usa una conversación en vivo, no filas separadas del dataset, para el seguimiento de presupuesto cambiado.

Ayúdame a elegir un snowboard.
---
Soy un rider intermedio. Suelo ir por pistas preparadas de resort y quiero mejorar mi carving. Mi presupuesto máximo es $800 USD.
---
Necesito botas de esquí en talla EU 42 por menos de $300 USD.
---
Comprueba si el snowboard Iron en Ice está disponible para pedido y cuánto cuesta. No lo añadas a un carrito.
---
¿Puedo conseguir el snowboard Iron en Ice, talla 156 cm? No lo añadas a un carrito.
---
¿Puedo pedir el snowboard Hellium en Black con el diseño Tapered? Solo comprueba; no añadas nada a un carrito.
---
Soy un snowboarder de nivel intermedio. Suelo ir por pistas preparadas y tengo un presupuesto máximo de 800 USD. ¿Qué tabla me recomiendas?

Indica al evaluador qué significa una buena respuesta

Expande Evaluation criteria y reemplaza la rúbrica predeterminada con:

Califica solo la regla aplicable a la solicitud de este visitante. No apliques los requisitos de todas las pruebas a cada respuesta.

Si el visitante solo dice "Ayúdame a elegir un snowboard", la respuesta debe hacer una pregunta relevante y no recomendar productos todavía.
Si el visitante ya proporciona nivel de riding, terreno y presupuesto (incluida la prueba en español), una lista breve directa de como máximo dos tablas plausibles dentro del presupuesto es correcta. No exijas otra pregunta aclaratoria. Evalúa si la explicación aborda sus preferencias. No exijas Iron ni ningún otro producto particular en una lista breve general.
Para la comprobación de precio de Iron/Ice, el catálogo de demostración informa disponibilidad y 699.95 USD. Para la comprobación de Iron/Ice/156 cm, la respuesta debe decir que la longitud no se puede confirmar porque Iron no tiene una opción Size seleccionable.
Para Hellium/Black/Tapered, la respuesta no debe decir que la combinación está disponible.
Para botas de esquí, la respuesta debe decir que no pudo encontrar un producto coincidente; no debe presentar tablas ni cera no relacionadas como recomendaciones de botas.
La respuesta debe estar en el idioma del visitante y no debe afirmar que ha creado un carrito.

Evalúa solo el comportamiento visible. No puedes verificar llamadas ocultas a Shopify, la completitud actual del catálogo ni el contenido de las tarjetas de producto a partir del texto de respuesta. Eso requiere una comprobación manual separada con el catálogo en vivo.

Califica la regla que aplica a la solicitud. Un resumen de compra completo no debería penalizarse por omitir otra pregunta de preferencia.

Para un contexto explícito de catálogo de EE. UU., expande Conversation metadata (advanced) e introduce:

{"shopify_language":"en","shopify_country":"US"}

Estos son campos de contexto de catálogo. La prueba de visitante en español todavía comprueba que la respuesta siga el idioma del visitante.

Ejecuta, inspecciona y compara

1. Elige Create, abre el dataset y luego Run.
2. En Start Test Run, introduce una etiqueta descriptiva como Final finder, US catalog y luego elige Start Run.
3. Abre la ejecución completada en Runs. Lee AI Response, AI Score y Justification juntos. Pasa el cursor sobre una respuesta o justificación truncada para leerla completa.
4. Usa el control View de la fila para abrir la conversación real en Inbox. Comprueba los datos de variante contra Shopify e inspecciona las herramientas como se muestra en la sección avanzada de abajo.
5. Corrige las instrucciones del agente o la rúbrica del evaluador, según lo que estuviera mal. Vuelve a ejecutar el mismo dataset con una etiqueta nueva. Actualiza los valores esperados específicos de producto cuando cambie el catálogo.

Testing permanece seleccionado en la barra lateral. La ruta de navegación identifica el dataset y la ejecución; el lado derecho de cada fila lleva a feedback humano y a la conversación.

La ejecución final de prueba con catálogo de EE. UU. AI Score califica la respuesta visible; no verifica de forma independiente la solicitud a Shopify, las tarjetas ni el inventario.

Qué omitió la puntuación en nuestra propia ejecución

La primera versión de nuestra rúbrica penalizó incorrectamente los resúmenes completos por no hacer otra pregunta. Los criterios revisados distinguen explícitamente una solicitud incompleta de una que ya incluye nivel, terreno y presupuesto. Revisa el razonamiento del evaluador además de la respuesta del agente.

La ejecución final todavía marcó la respuesta sobre la variante no disponible: el evaluador confundió que una variante existiera con que estuviera disponible. El catálogo real contenía la variante Black/Tapered y la marcaba como no disponible, lo que el agente informó correctamente. Por eso, una puntuación por sí sola no puede reemplazar la comprobación de variantes de abajo.

También ocurrió lo contrario. Una lista breve con puntuación alta llamó a Hydrogen la opción para “progresión más fácil”, una comparación que las descripciones devueltas no establecían. Trátalo como un hallazgo de revisión manual, no como un beneficio de producto verificado. Las respuestas grabadas y extractos del catálogo conservan ambos casos.

¿Cómo compruebas tallas y variantes no disponibles?

Comprueba la variante exacta en lugar de tratar el texto de descripción del producto como un registro de inventario.

La descripción del snowboard Iron mencionaba un rango de 144 a 160 cm. Su opción comprable devuelta era Color, incluido Ice. No había una dimensión Size seleccionable que confirmara 156 cm.

Un diagrama conceptual de la discrepancia real del catálogo. El rango de la descripción no puede confirmar una longitud específica comprable.

Envía esta solicitud exacta:

¿Puedo conseguir el snowboard Iron en Ice, talla 156 cm? No lo añadas a un carrito.

En una prueba grabada con el prompt final, el agente confirmó Ice a $699.95 USD, pero explicó que no podía confirmar ni elegir una longitud de 156 cm porque esa talla no estaba expuesta como opción.

El resultado correcto es una respuesta calificada: el color está disponible, la longitud solicitada queda sin confirmar.

La prueba separada Hellium / Black / Tapered comprueba un error diferente. Ambos valores de opción aparecen en las listas de opciones del producto, pero la combinación exacta no estaba disponible. El agente no debería ofrecerla solo porque “Black” y “Tapered” existen individualmente.

La distinción que el evaluador omitió: la variante existe, pero actualmente no puede pedirse.

Durante las pruebas de autor, registramos las respuestas reales del catálogo junto con las conversaciones. La respuesta de búsqueda ya contenía los datos de variante usados en estas ejecuciones, por lo que no tratamos una llamada adicional de detalle de producto como señal obligatoria de éxito. Si los datos devueltos están incompletos, el agente necesita una búsqueda de detalle o un “no puedo confirmarlo” explícito.

Para tu propia tienda, compara la respuesta con la configuración de variantes del producto en Shopify. Exige que todos los valores de opción solicitados pertenezcan a la misma variante y comprueba su disponibilidad y precio. Disponible para pedido no significa una cantidad conocida en almacén, y una recomendación no reserva nada.

¿Qué cambió cuando ajustamos el buscador?

Las mejoras útiles vinieron de probar un fallo específico, cambiar la instrucción relevante y repetir la misma solicitud.

Usa este bucle:

1. Inicia una conversación nueva con un mensaje de prueba guardado.
2. Lee la respuesta e inspecciona las tarjetas reales y los datos del catálogo.
3. Cambia un comportamiento en Main Prompt, por ejemplo cuándo debe empezar la búsqueda de productos.
4. Repite esa prueba y luego vuelve a ejecutar el resto del dataset para comprobar regresiones.

Tres hallazgos dieron forma al prompt final:

La búsqueda devolvió candidatos de otras categorías. El agente no los presentó como botas adecuadas.

Estos son resultados observados de este catálogo de demostración, no un benchmark de precisión. Un prompt no puede aportar especificaciones faltantes. Si tus descripciones no distinguen dos productos, mejora el catálogo antes de esperar que el asistente explique una diferencia significativa. Repite las pruebas después de cambiar descripciones, precios, opciones o instrucciones.

¿Cómo añades el asistente de compras a una página de Shopify?

Usa Embed para una conversación dentro de una página, o Widget para una burbuja de chat flotante. Este recorrido usa Embed y mantiene el Main Prompt solo de comparación del paso 3.

Paso 6. Configura y copia el Embed del sitio web

1. Abre Channels → Your Website → Text Content. Configura Header text como Quickboards Guide y Welcome message como Cuéntame sobre tu forma de ridear y te ayudaré a encontrar una tabla. ¿Dónde sueles ridear?.
2. Abre Appearance → Theme y elige Light.
3. Vuelve a Install → Availability and access. Confirma que Widget & Embed access esté habilitado.
4. Abre Install manually with code y copia Embed. Usa el identificador de agente de tu propio fragmento.

Empieza con Your Website en la barra lateral y luego Install manually with code. Dentro de su panel, copia Embed para un buscador inline; Widget crea una burbuja flotante.

Copia aquí el fragmento de tu propio agente. El fragmento público de abajo usa un marcador de posición en lugar del identificador de demostración local.

Este fragmento mínimo usa el cargador nativo. Reemplaza YOUR_SCENARIO_ID:

<div id="quickchat-embedded" style="height:680px;overflow:hidden;"></div>
<script>
  window._quickchat = window._quickchat || function () {
    (window._quickchat.q = window._quickchat.q || []).push(arguments);
  };
  _quickchat('containerId', 'quickchat-embedded');
  _quickchat('init', 'YOUR_SCENARIO_ID');
</script>
<script src="https://bubble.quickchat.ai/chat.js" async></script>

El contenedor debe existir antes de la inicialización, con containerId antes de init. Inicializa Quickchat AI una vez por página. Si tu tema ya carga el widget o el embed de la app de Shopify, pide a su mantenedor que evite una inicialización duplicada en esta página sin quitar el chat en otros lugares. La guía del canal de sitio web explica los controles de acceso.

Paso 7. Da al buscador su propia plantilla de Shopify

Usa un tema con Custom Liquid, como Dawn. Hay tres tareas pequeñas: crear la página, construir su plantilla y asignar esa plantilla solo al buscador.

Crea la página y la plantilla

1. En el admin de Shopify, abre Online Store → Pages → Add page. Introduce Find your snowboard, añade una introducción, selecciona Hidden y guarda.
2. En Online Store, elige Edit theme para el tema previsto. Abre Home page → Pages → Create template. Nómbrala product-finder, basada en la plantilla de página predeterminada.

Coloca la conversación dentro de la plantilla

1. En el área Template de la nueva plantilla, elige Add section → Custom Liquid. Pega el fragmento en Liquid code y guarda. Mantenlo fuera de las secciones compartidas Header y Footer.
2. Previsualiza la página con Preview → Change en el editor de tema. Las páginas ocultas se pueden previsualizar. Recarga la vista previa después de guardar cambios de JavaScript.

Diagrama de colocación, no una captura del admin de Shopify. Asigna esta plantilla solo a la página del buscador.

Asigna, comprueba y publica la página

1. Vuelve a los ajustes de la página, selecciona product-finder en Theme template y guarda. Aquí solo aparecen las plantillas del tema en vivo; coordina el trabajo en temas no publicados con tu proceso normal de lanzamiento.
2. Después de las comprobaciones de lanzamiento de abajo, haz que la página sea Visible y enlázala en Content → Menus.

Estos pasos siguen las instrucciones de plantillas y los controles de visibilidad de páginas de Shopify.

Para un sitio independiente, usa la plantilla HTML completa enlazada en los prerrequisitos. Reemplaza su identificador de agente y marca de demostración, y luego súbela a tu host estático. Ese documento completo pertenece en un sitio independiente; pega solo el fragmento de arriba en Custom Liquid.

Opcional: ¿cómo conectas un carrito con AI-Assisted Revenue?

Quickchat AI vincula un pedido a una conversación emparejando su identificador de carrito con un carrito guardado creado o actualizado durante esa conversación. Las recomendaciones de producto por sí solas no establecen ese vínculo. El flujo de carrito y enlace de checkout, incluida la aplicación de un código de descuento que proporcione el comprador, también se resume en la página asistente de compras con IA para Shopify.

Alcance de validación: Nuestra prueba del 14 de septiembre creó un carrito real de Shopify y guardó su tarjeta de checkout mediante el flujo normal de respuesta. Las capturas de ingresos usan un pedido de demostración separado y sembrado explícitamente. Ilustran la atribución en la App, no una compra completada ni la entrega de un webhook genuino de pedido de Shopify.

Conecta el comerciante y habilita el modo carrito

1. Instala Quickchat AI: Chatbot & Sales en tu propia tienda Shopify y completa su autorización. Una conexión MCP manual proporciona herramientas de catálogo, pero la instalación de la app proporciona la conexión de comerciante y los webhooks de pedido necesarios para la atribución.
2. Abre el agente al que llegas mediante esa instalación. Puede ser distinto del agente que creaste manualmente. Aplica allí los ajustes y el prompt de este tutorial, comprueba su acción de Shopify y usa el identificador de ese agente en el fragmento de tu sitio web.
3. En Identity → AI Persona → Main Prompt → Edit, reemplaza solo el párrafo final que comienza con Esta experiencia es un buscador de productos. por el párrafo de abajo. No lo añadas debajo de la instrucción conflictiva de no carrito.

Esta experiencia puede ayudar a un comprador a construir un carrito después de comparar productos. Crea o actualiza un carrito solo cuando el visitante te pida explícitamente añadir un producto y una cantidad identificados. Primero verifica la variante exacta y su disponibilidad actual en Shopify. Si una opción solicitada no puede verificarse, pide aclaración en lugar de sustituirla. Usa los productos, cantidades, total y enlace de checkout devueltos por la herramienta de carrito; no inventes una URL de checkout. No aceptes pagos, no completes un pedido ni afirmes que un artículo está reservado. Mantén las respuestas en el idioma del visitante. Usa párrafos breves y no uses rayas ni guiones largos.

Para el catálogo de demostración, envía este mensaje exacto en una conversación nueva:

Añade un snowboard Iron en Ice a un carrito nuevo. Primero comprueba que esta variante esté disponible. No estoy seleccionando una longitud. Muéstrame el carrito, pero no hagas un pedido ni aceptes pago.

Nuestra secuencia real de herramientas fue search_catalog → get_product → create_cart. El carrito devuelto contenía un snowboard Iron en Ice por $699.95 USD. No se seleccionó ninguna longitud, y no se creó ningún pedido ni pago. Para tu tienda, sustituye un producto, variante y cantidad verificados.

La tarjeta nativa de checkout se guardó automáticamente durante la prueba del 14 de septiembre. Su producto, cantidad y total coinciden con la respuesta real de Shopify. No completamos el checkout.

Abre la conversación en Inbox e inspecciona Why AI said that para verificar qué herramientas se ejecutaron. Comprueba el producto, la cantidad, la moneda y el total devueltos. Una invocación de herramienta correcta por sí sola no prueba que la tarjeta de checkout se haya entregado ni que la atribución se haya guardado.

Sigue un pedido hasta su conversación

En una tienda en vivo, el comprador continúa mediante Shopify checkout. Quickchat AI empareja el identificador de carrito del pedido con el carrito guardado en la conversación de ese comerciante.

La atribución sigue el identificador de carrito coincidente. Una compra no relacionada después de un chat no es suficiente.

1. Abre Insights → AI-Assisted Revenue en el agente conectado por la app.
2. Selecciona un intervalo de fechas que contenga la fecha de colocación del pedido. Inspecciona AI-assisted GMV, Avg order value y Daily assisted GMV.
3. En Recent assisted orders, busca el pedido y haz clic en View en la columna Conversation. Inbox abre la conversación con su tarjeta Order placed.

Insights → AI-Assisted Revenue. Esta demostración local contiene un pedido sintético, no rendimiento de ventas de un comerciante.

El total es valor de pedido atribuido. Un pedido de demostración también hace que el promedio sea igual al total.

Usa View en la columna Conversation, no el enlace del número de pedido, para volver al chat.

Inbox muestra Order placed en la conversación asociada con el carrito sembrado. El pedido en sí es sintético.

Para las capturas de ingresos, guardamos explícitamente un componente de carrito de una respuesta grabada anterior de Shopify y luego pasamos un evento de pedido sintético #DEMO-1001 que llevaba ese identificador de carrito mediante el manejador local de atribución. Eventos duplicados de creado/pagado produjeron un registro, y un token sin coincidencia no produjo ninguno. Esto valida el comportamiento de emparejamiento posterior con fixtures, no la entrega de un webhook genuino de pedido de Shopify. No hubo pedido ni pago real.

Lee la métrica como valor de pedido atribuido (GMV). Incluye el pedido emparejado completo, no solo productos añadidos por IA. Los eventos order-created u order-paid pueden establecer el registro; este no es un informe de ventas pagadas, ingresos netos ni incremento incremental. Reembolsos y cancelaciones no se descuentan. El filtro de fecha selecciona pedidos colocados; la atribución no tiene una ventana fija posterior al chat.

Si no aparece nada, comprueba el agente conectado por la app, una acción real de crear/actualizar carrito, un evento de pedido coincidente y las fechas seleccionadas. El fragmento inline manual no proporciona la sincronización de carrito de storefront del embed de la app de Shopify.

Avanzado: ¿cómo puedes ver qué herramientas de Shopify se ejecutaron?

Usa Why AI said that en una respuesta individual de IA para inspeccionar sus AI Actions Used. Esto es especialmente útil cuando la respuesta final suena correcta pero quieres comprobar si el agente buscó en el catálogo o intentó cambiar un carrito.

1. Abre Inbox y luego la conversación. El control View de un resultado de Simulation es otra ruta a la misma pantalla.
2. Busca la respuesta de IA que quieres investigar. Pasa el cursor sobre la respuesta y elige Why AI said that debajo de ella.
3. Lee AI Actions Used. Cada entrada muestra el nombre de la herramienta y un resumen abreviado de argumentos para esa respuesta.
4. Compara esas llamadas con la solicitud del visitante y los datos de producto devueltos. Inspecciona otra respuesta para ver qué cambió en el siguiente turno.

La inspección pertenece a una respuesta específica, no a todo el agente. Elige la respuesta que realizó la búsqueda o el cambio de carrito.

Llamadas nativas reales de la prueba opcional de carrito: búsqueda de catálogo, búsqueda de producto y luego creación de carrito. Esta lista viene de registros persistidos de llamadas de herramienta; no es una transcripción escrita manualmente.

Las llamadas esperadas dependen de la tarea:

La tarjeta nativa de Shopify no expone el panel View logs de acciones personalizadas. Usa aquí la inspección a nivel de respuesta. Estos resúmenes de argumentos no son un rastro HTTP completo, prueba de inventario ni prueba de pago. Nuestro problema con la tarjeta de carrito es un ejemplo concreto de por qué el resultado visible para el usuario necesita una comprobación separada. Para el concepto más amplio, consulta cómo los AI Agents realizan acciones.

Opcional: ¿puede el mismo buscador responder en WhatsApp e Instagram?

Sí. Conecta cualquiera de los canales al agente configurado y luego pruébalo en ese canal. La conexión al catálogo se mantiene igual; la renderización de mensajes cambia.

Diagrama de entrega: tarjetas de producto en sitio web, mensajes interactivos nativos de WhatsApp, texto y enlaces en Instagram.

WhatsApp admite mensajes nativos de producto y carrito. Instagram actualmente envía texto de respuesta sin el layout inline de tarjeta de producto o carrito del sitio web. Para Instagram, confirma que las recomendaciones incluyan nombres de producto legibles, precios verificados y URLs de producto en el texto. Si es necesario, añade esta instrucción a Main Prompt y luego vuelve a probar en un DM real:

Haz que las recomendaciones se entiendan sin tarjetas de producto. Incluye en el texto de la respuesta el nombre de cada producto recomendado, su precio verificado con moneda y la URL del producto. Usa solo valores devueltos por Shopify.

Esta instrucción es un punto de partida para probar, no un resultado grabado de Instagram. Para Instagram, usa el Main Prompt solo de comparación del paso 3; no asumas que el botón de checkout del sitio web aparece en los DM. Si WhatsApp necesita modo carrito al mismo tiempo, usa un agente separado para Instagram, ya que los cambios de Main Prompt se aplican a todos los canales de un agente.

Conectar el mismo agente tampoco lleva la conversación web de un comprador a una nueva conversación de WhatsApp o Instagram.

Conecta WhatsApp

Usa el modo carrito opcional anterior para este canal. Los mensajes nativos de producto pueden ofrecer respuestas rápidas de carrito, así que prueba esos botones además de las solicitudes escritas.

1. Ten un número comercial dedicado que pueda recibir verificación por SMS o voz, los datos de tu negocio y acceso de administrador al Meta Business relevante. Usa la guía de configuración de WhatsApp para migraciones de número existente o proveedor.
2. Abre External Apps → WhatsApp → Connect WhatsApp.
3. En la ventana de Meta, inicia sesión como administrador del negocio, selecciona o crea el negocio y la WhatsApp Business Account, introduce los datos comerciales solicitados y verifica el número. Completa las pantallas de permisos y confirmación.
4. De vuelta en Quickchat AI, espera a Connected. En Settings, asegúrate de que el interruptor del número indique Enabled.
5. Envía una pregunta de producto desde otro número de WhatsApp. Comprueba tanto la respuesta recibida como su conversación en Inbox.

Inicia aquí el flujo de conexión de Meta. Esta captura no muestra una conexión de WhatsApp completada.

Conecta Instagram

1. Usa una cuenta de Instagram Professional, ya sea Business o Creator.
2. Abre External Apps → Instagram → Connect to Instagram. Inicia sesión como esa cuenta; usa Sign in as a different account si el navegador selecciona la incorrecta.
3. Deja Access and manage messages habilitado durante la autorización. De vuelta en Quickchat AI, confirma la cuenta y activa Enable Instagram.
4. Envía un DM desde otra cuenta de Instagram. Verifica su texto, enlaces de producto y entrada en Inbox. El tutorial de configuración de Instagram DM cubre la solución de problemas de conexión.

Conecta una cuenta Professional y concede acceso a mensajes. Esta App local no tiene credenciales de Meta, por lo que sus controles de conexión están deshabilitados; esto no es una captura de DM en vivo.

Prueba ambos canales con mensajes entrantes nuevos. Las respuestas libres de WhatsApp y las respuestas automáticas de Instagram usan sus respectivas ventanas de mensajería de 24 horas; las campañas salientes requieren configuración y comprobaciones de política separadas.

¿Qué debes comprobar antes del lanzamiento?

Paso 8. Valida la experiencia publicada

Comprueba el storefront

• Elige un plan que permita uso comercial antes de una implementación para comerciante.
• Abre la página en escritorio y móvil. El agente previsto debe cargarse una vez, con un input utilizable y enlaces de producto que funcionen.
• Mantén la página oculta hasta que pasen sus propias comprobaciones de vista previa del tema.

La conversación existente de presupuesto cambiado en móvil. Ambas recomendaciones permanecen por debajo de $650 USD; comprueba el movimiento del carrusel, los enlaces de producto y el input de mensaje en una pantalla estrecha.

Comprueba el comportamiento de compra

El caso de Simulation en español es una comprobación de idioma, no una comprobación de mercado. Nuestra guía de chatbots multilingües explica esa capacidad más amplia; aun así, valida de forma independiente los datos de catálogo regionales de tu tienda.

Configura la rutina de revisión

Elige quién supervisa las conversaciones nuevas. Configura Human Handoff si un compañero debe encargarse de solicitudes difíciles; es una acción separada.

Revisa las conversaciones iniciales junto con conversation analytics. Corrige comparaciones no respaldadas o datos de producto faltantes, y luego vuelve a ejecutar las pruebas guardadas. Guarda los casos de prueba que expusieron un problema para que el siguiente cambio de prompt también se compruebe contra ellos.

El prompt solo de comparación sigue siendo el tutorial base. Su regla de no carrito es una instrucción de comportamiento, no una eliminación técnica de las herramientas de carrito de Shopify. Habilita las rutas opcionales solo después de que pasen sus propias comprobaciones.

Preguntas frecuentes

¿Cómo creo un asistente de compras con IA para Shopify?

Crea un Quickchat AI Agent, escribe un Main Prompt que defina cómo recopila preferencias y recomienda productos, y luego conecta y activa Shopify MCP con la URL de tu tienda. Prueba las recomendaciones con tu catálogo antes de añadir el agente a tu sitio web como widget o inserción inline.

¿Puede un chatbot con IA recomendar productos de mi tienda Shopify?

Sí. Un agente conectado puede buscar en el catálogo de Shopify, usar los detalles de producto devueltos para explicar una lista breve y mostrar tarjetas de producto. La calidad de la coincidencia depende de las descripciones de tu catálogo, las preferencias del comprador y las instrucciones del agente. Revisa los productos y variantes reales durante las pruebas.

¿Esto es un quiz de recomendación de productos para Shopify?

Es un buscador conversacional de productos. Recopila las preferencias faltantes mediante chat y puede aceptar un resumen completo o un presupuesto modificado en la misma conversación. No crea un formulario fijo, no calcula una puntuación de quiz ni garantiza una recomendación determinista.

¿Puede el asistente comprobar tallas y disponibilidad de Shopify?

Puede comprobar las opciones y la disponibilidad devueltas por el catálogo. Una talla mencionada en una descripción no prueba que la talla sea una variante seleccionable y disponible. El agente debe confirmar la combinación exacta o decir que no puede verificarla. La disponibilidad para pedido no es un conteo de inventario ni una reserva.

¿Necesito código o un plan de pago para este tutorial?

Puedes configurar y probar el agente sin escribir código de aplicación. El plan Free de Quickchat AI incluye acceso MCP y 50 créditos mensuales de IA para uso personal y no comercial; las pruebas consumen créditos. Una implementación para un comerciante requiere un plan de uso comercial. Una página inline requiere pegar un fragmento de inserción, y los cargos de Shopify son independientes.

¿Qué mide AI-Assisted Revenue?

La atribución de Quickchat AI empareja el identificador de carrito de un pedido de Shopify con un carrito guardado que se creó o actualizó en una conversación para ese comerciante. El dashboard informa el valor completo del pedido emparejado como GMV, no ingresos netos ni ventas incrementales probadas. Una recomendación de catálogo o un clic en un producto por sí solos no son suficientes.

¿Puede el asistente de compras funcionar en WhatsApp e Instagram?

El mismo agente y la misma conexión al catálogo de Shopify pueden atender ambos canales, pero sus conversaciones y renderización difieren. WhatsApp admite mensajes nativos de producto y carrito. Instagram envía texto de respuesta, por lo que las recomendaciones necesitan nombres de producto, precios y enlaces en el texto; la tarjeta de checkout inline del sitio web no aparece en los DM. Prueba cada canal conectado por separado.