Volver al directorio

Embeber en Shopify

Elige el modo según dónde quieras mostrar el directorio. Ambos snippets son una sola línea para pegar en el editor HTML de Shopify.

Botón con modal

Recomendado

Muestra una tarjeta llamativa "¿Necesitas instalar tu piso?" que abre el directorio en un modal sin sacar al cliente de la ficha de producto. Ideal para reemplazar el enlace actual "Ver instaladores en tu zona".

Snippet · Modo modal
<div id="madecentro-installers"></div>
<script src="https://tu-app.lovable.app/embed.js" data-mode="modal" async></script>

Embed inline

Renderiza el directorio completo dentro de la página, ajustando su altura automáticamente. Úsalo en una página dedicada (ej. /paginas/instaladores).

Snippet · Embed inline
<div id="madecentro-installers"></div>
<script src="https://tu-app.lovable.app/embed.js" async></script>

Pasos en Shopify (reemplazar el enlace actual)

  1. 1En tu admin de Shopify ve a Productos y abre la plantilla o producto donde aparece "¿Necesitas instalar tu piso? Ver instaladores en tu zona".
  2. 2En el editor de contenido haz clic en <> Mostrar HTML y elimina el bloque del enlace actual.
  3. 3Pega el snippet "Botón con modal" en su lugar y guarda los cambios.
  4. 4Visita la ficha de producto: verás una tarjeta naranja destacada. Al hacer clic se abrirá el directorio completo en un modal.

¿Cómo funciona?

El script /embed.js detecta el atributo data-mode. En modo modal, renderiza solo el botón CTA y carga el iframe del directorio (https://tu-app.lovable.app/embed) de forma diferida la primera vez que el usuario lo abre — sin penalizar el tiempo de carga de la página de producto. Se cierra con Escape, clic fuera o el botón ✕.