Ir al contenido

Encuentra tu vía de instalación

Instalar Dialog implica dos preocupaciones distintas, que no siempre viven en el mismo sitio:

  • Ingestión de data — subir tu catálogo de productos (y opcionalmente blog / pages) para que el asistente responda con precisión.
  • Integración frontend — embedder el widget asistente en tu storefront para que los visitantes puedan usarlo.

Algunas vías cubren ambas a la vez (app Shopify, módulo Prestashop). Otros stacks requieren combinar (ej. Shopify headless: la app gestiona la ingestión, tú embeds el frontend).

Encuentra tu stack abajo. Cada tarjeta enlaza con las dos páginas que vas a seguir: una para la ingestión de data y otra para el embed frontend.

Respuestas a las preguntas de enrutamiento más frecuentes

Sección titulada «Respuestas a las preguntas de enrutamiento más frecuentes»

«¿App Shopify, GTM o SDK — cuál elegir?» Si tu tienda corre en Shopify, siempre es la app Shopify — nunca GTM, nunca el SDK a secas (salvo headless, abajo). En Prestashop, siempre el módulo. GTM solo existe para tiendas que no están en ninguna de las dos plataformas y sin developer frontend — una vía beta, de último recurso, con trade-offs reales.

«Estamos en Shopify headless (Hydrogen, Next.js…). ¿Qué va dónde?» Separa las dos preocupaciones: instala la app Shopify para la sincronización del catálogo, y embed el widget con @askdialog/dialog-react, @askdialog/dialog-vue o el SDK. El app block no puede renderizarse fuera del renderer de Online Store. Detalles en Instalar en Shopify → Headless.

«Solo necesito el catálogo.» Ve a Integración del catálogo. Shopify y Prestashop sincronizan automáticamente; todo lo demás se sube vía la API siguiendo el esquema del catálogo.

«El widget ya está en línea — solo me falta el tracking.» Ve a la vista general del tracking. Indica, por vía de instalación, qué eventos son automáticos y qué dos eventos site-level tiene que conectar tu equipo.

«API, SDK, paquete React, paquete Vue — ¿para qué sirve cada uno?» La API REST es server-side, solo para subir el catálogo y el contenido. El SDK y los paquetes React / Vue son frontend, para embedder el widget. Tabla de enrutamiento completa en la visión general para developers.

«¿Qué puedo configurar yo mismo, y qué necesita un developer?» Todo lo que está en el dashboard de Dialog es self-serve: documentos de entrenamiento, directrices, identidad del asistente, personalización visual, Personal Shopper. El código solo hace falta para los embeds en storefront custom, el cableado GTM, el pegamento de refresh del carrito y las subidas de catálogo custom. El mapa completo de responsabilidades está en Antes de contactar con soporte.

Lo que tu equipo tiene que hacer depende de la vía:

  • Merchant Shopify o Prestashop → instalas la app o el módulo tú mismo desde el back office. Sin necesidad de developer para un setup estándar; unos minutos de clicks. Tu catálogo se sincroniza automáticamente.
  • Theme Shopify legacy (< 2.0) → misma instalación, pero un developer (tuyo o de tu agencia) tiene que pegar unos snippets en tu theme — normalmente menos de una hora.
  • Shopify headless, o cualquier storefront custom con developers frontend → tus developers integran Dialog en el código de tu storefront. Tienen control total sobre cómo el asistente se conecta a tu carrito y a tus páginas de producto, así que encaja limpiamente en tu checkout actual. Cuenta unas horas o un día de trabajo frontend.
  • No Shopify / no Prestashop, sin developers frontend disponibles → usa Google Tag Manager (Beta). Lo configuras desde tu cuenta GTM, sin tocar código. Trade-off: el widget se carga después del resto de la página, así que los visitantes tienen un retraso y un layout shift, y no encaja del todo con el look de tu sitio. Vía de último recurso — úsala solo cuando una instalación SDK no es posible.

Opciones de integración frontend para stacks custom o headless

Sección titulada «Opciones de integración frontend para stacks custom o headless»

Si tu ingestión de data está gestionada pero queda embedder el asistente en un frontend custom, comparte esto con tus developers:

  • React@askdialog/dialog-reactDialogProductBlock y DialogInput drop-in.
  • Vue 3@askdialog/dialog-vue — mismos componentes, sabor Vue.
  • Otros frameworks JS (Svelte, SolidJS, Lit, vanilla, templating server-side tipo Twig / Blade / ERB) → @askdialog/dialog-sdk — SDK vanilla, el equipo construye el UI shell alrededor.

Lo único que toda install necesita verificar

Sección titulada «Lo único que toda install necesita verificar»

El refresh de la UI del carrito (icono, burbuja, mini-cart, drawer) es el problema más común, en todas las plataformas. Después de instalar Dialog, abre el asistente en una página de producto, añade un producto y verifica que tu UI de carrito se actualiza sin recargar la página. Si no, ver Problemas al añadir al carrito — la solución depende de la vía de instalación.