Integrar el simulador en tu sitio
El simulador se embebe como un Web Component nativo. Sin iframes, sin dependencias, con un solo script.
Instalacion
Pega este snippet donde quieras que aparezca el simulador. Puede estar en el <body> o dentro de cualquier contenedor.
<script src="https://simuladorhipotecario.glassprop.com/embed.js" defer></script>
<gp-simulador-hipotecario></gp-simulador-hipotecario>El script se descarga una vez y queda cacheado. No necesitas instalar nada via npm ni modificar tu build.
Atributos
El componente acepta los siguientes atributos HTML para personalizar su comportamiento.
| Atributo | Valor(es) | Default | Descripcion |
|---|---|---|---|
theme | "light" o "dark" | "light" | Esquema de color del componente. |
accent-color | #RRGGBB | sin override | Color primario para botones y estados de foco. Acepta hex. |
lead-capture | "on" o "off" | "on" | Muestra u oculta el formulario de lead al final de la simulacion. |
source | string arbitrario | embed:<hostname> | Identificador para tracking. Lo vas a ver en los leads generados desde tu sitio. |
Ejemplos
Tema oscuro
<script src="https://simuladorhipotecario.glassprop.com/embed.js" defer></script>
<gp-simulador-hipotecario
theme="dark"
></gp-simulador-hipotecario>Sin formulario de lead
Util si solo queres mostrar el simulador sin capturar datos de contacto.
<script src="https://simuladorhipotecario.glassprop.com/embed.js" defer></script>
<gp-simulador-hipotecario
lead-capture="off"
></gp-simulador-hipotecario>Color personalizado + tracking
Combina todos los atributos para una integracion completa con tu marca.
<script src="https://simuladorhipotecario.glassprop.com/embed.js" defer></script>
<gp-simulador-hipotecario
theme="light"
accent-color="#e6007a"
lead-capture="on"
source="mi-inmobiliaria"
></gp-simulador-hipotecario>Preview
Antes de integrar, podes ver como se ve el componente con distintas configuraciones.
Ver preview del componente →Preguntas frecuentes
¿Afecta los estilos de mi sitio?
No. El Web Component usa Shadow DOM. Los estilos de tu host no entran al componente, y los estilos del componente no salen a tu sitio. Es completamente aislado.
¿Cuanto pesa?
~400 kB gzip. Se descarga una sola vez y queda cacheado en el browser por 1 hora (y hasta 7 dias en CDN). Las visitas siguientes no descargan nada.
¿Que datos envia?
Si el usuario completa el formulario de lead, se envian a nuestro backend: email, telefono (opcional), suscripciones elegidas, datos del simulacro y tu dominio via el atributo source. No hay tracking adicional ni cookies de terceros.
¿Como reporto un bug?
Abri un issue en github.com/jgornati/glassprop-tools/issues. Incluí la URL de tu sitio, el navegador y una descripcion del problema.