Shopify

En esta guía, te mostraremos cómo agregar el Widget de Quickchat AI a tu tienda de Shopify.

Lo que necesitarás

• Una tienda de Shopify
• La aplicación Shopping Agent by Quickchat AI instalada desde el Shopify App Marketplace (si no quieres instalarla y prefieres conectarla manualmente, desplázate hacia abajo a la segunda parte del tutorial)
• Permisos de usuario para editar temas

Tiempo para completar: ~2 minutos

---

Paso 1: Abre tu Editor de Temas

Hay dos formas de hacerlo:

Opción A (recomendada): desde la App de Quickchat AI

Ve a Quickchat AI App → Tu sitio web → pestaña Install → haz clic en Embed in your Shopify Store.

Esto abre el Editor de Temas de tu tienda directamente en la página donde se puede habilitar la integración de la app.

Opción B: desde el Admin de Shopify

Ve a Shopify Admin → Online Store → Themes → en tu tema actual haz clic en Customize.

---

Paso 2: Habilitar la integración de la app

Dentro del Editor de Temas, abre la barra lateral izquierda y ve a App embeds.

Encuentra Quickchat AI Widget y actívalo.

Luego haz clic en Save (arriba a la derecha).

---

Paso 3: Confirma en tu escaparate

Abre tu escaparate (vista previa o sitio en vivo) y busca la burbuja de chat de Quickchat AI en la esquina inferior derecha de la página.

¡Eso es todo!

El Agente de Quickchat AI está en vivo en la Tienda de Shopify 🎉

---

Cómo agregar manualmente un script de widget

Si no quieres instalar nuestra App de Shopify porque ya tienes un Agente de IA construido en la App de Quickchat AI, puedes agregar un script simple que lo muestre en tu Tienda de Shopify.

¿Ya has conectado tu IA a los datos de Shopify?

Para conectar tu Agente de IA a los datos de tu tienda de Shopify como el catálogo de productos y el carrito, por favor haz lo siguiente:

1. Pega el enlace de tu tienda en esta página: quickchat.ai/shopify
2. Reclámalo, personalízalo y intégralo en tu sitio

1. Abre el editor de código del tema

1. Ve a tu Panel de Administración de Shopify.
2. En el menú izquierdo, haz clic en Online Store → Themes.

3. En la sección “Current theme”, haz clic en los tres puntos (⋯) junto al botón Customize.
4. Selecciona Edit code del menú desplegable.

2. Encuentra theme.liquid

1. En el editor de código, expande la carpeta layout a la izquierda.
2. Haz clic en theme.liquid para abrir el archivo de diseño principal de tu tema.

3. Pega el script

1. En la App de Quickchat, navega a Your Website → Install.
2. Copia el script generado.
3. Pégalo justo encima de la etiqueta </body> al final del archivo theme.liquid.

<script>
  window.__quickchat = {
    host: "app.quickchat.ai",
    init: "YOUR_AI_ID_HERE",
  };
</script>