Opciones de inserción
Inserte una calculadora de hipoteca en su sitio web a su manera
Su constructor de sitios web no debería decidir si puede captar los números de un prestatario.
Plan gratuito, sin tarjeta. Los planes pagos incluyen 14 días de prueba.
<div data-prequal="mortgage"
data-key="YOUR_EMBED_KEY"
data-mode="inline"></div>
<script src="https://app.prequalfunnel.com/embed.js" async></script>Para insertar una calculadora de hipoteca en su sitio con PrequalFunnel, pegue un div y un script donde quiera que aparezca. Elija el modo: en línea (estilos aislados, sin iframe), en línea dentro de un marco, botón con ventana emergente, botón flotante, su propio botón o enlace, enlace directo o iframe clásico. Funciona en HighLevel, WordPress, Wix, Squarespace y Webflow.
Puntos clave
- Una línea de código: un div y un script.
- El modo en línea aísla los estilos: el CSS de su sitio no rompe la calculadora.
- Ventana emergente, flotante, su propio botón, enlace directo e iframe clásico para lo demás.
- Funciona en cualquier constructor que acepte HTML personalizado, incluidos los embudos de HighLevel.
01
¿Cómo funciona el código de inserción?
La inserción es un solo elemento que indica la calculadora más un pequeño script de carga. El script encuentra el elemento, trae su configuración guardada (tema, colores, textos) y monta la calculadora en ese lugar. Como la configuración se carga en cada visita, los cambios que haga en el panel aparecen en su sitio sin editar el código otra vez.
En el modo en línea, el predeterminado, no hay iframe. La calculadora se muestra dentro de un contenedor aislado en su página, así que el CSS de su tema no cambia sus fuentes ni espacios, y sus estilos no se filtran a su página. Si el montaje en línea no se completa, pasa automáticamente a una versión dentro de un marco, y el prestatario sigue viendo una calculadora que funciona.
El modo en línea también puede llevar contenido legible por buscadores dentro del elemento: un título, una breve introducción, las definiciones y el aviso legal, con datos estructurados opcionales. Así los buscadores encuentran algo que leer en la página donde está la calculadora. No promete posiciones en Google; solo evita un recuadro vacío donde va la calculadora.
Todos los modos usan el mismo formulario, así que los leads llegan a su CRM integrado con los mismos datos, resultados y fuente de tráfico, sin importar el modo que elija.
¿Cómo se ve el código de inserción?
Esta es la forma del código que le da el panel. Su clave real y la calculadora se completan al copiarlo. Cambie data-mode para cambiar de modo.
<!-- Calculadora FHA, en línea (predeterminado), en español -->
<div data-prequal="fha-loan" data-key="ak_…" data-mode="inline" data-lang="es"></div>
<script src="https://app.prequalfunnel.com/embed.js" async></script>
<!-- La misma calculadora como botón flotante, abajo a la izquierda -->
<div data-prequal="fha-loan" data-key="ak_…" data-mode="floating"
data-label="Calcule su pago FHA" data-color="#0f5c4a" data-position="bl"></div>
<!-- Ábrala desde su propio botón -->
<button class="open-calculator">Ver mis números</button>
<div data-prequal="fha-loan" data-key="ak_…" data-mode="trigger" data-trigger=".open-calculator"></div>¿Qué modo de inserción le conviene?
Empiece con el modo en línea. Use los demás cuando el diseño de la página o el constructor lo pidan.
| Modo | Cómo aparece | Ideal para |
|---|---|---|
| En línea (predeterminado) | Dentro de la página, con estilos aislados, sin iframe | Páginas de calculadoras y de programas de préstamo |
| En línea dentro de un marco | Dentro de la página en un marco que ajusta su altura | Constructores que limitan scripts en la página |
| Botón con ventana emergente | Un botón que abre la calculadora en una ventana | Portadas y bloques destacados |
| Botón flotante | Un botón en una esquina de cada página (arriba o abajo, izquierda o derecha) | Cobertura en todo el sitio |
| Su propio botón o enlace | Cualquier elemento que coincida con un selector CSS la abre | Botones, menús o imágenes que ya tiene |
| Enlace directo | Una URL con la calculadora a página completa | Correo, SMS, redes sociales, códigos QR |
| Iframe clásico | Un iframe estándar | Plataformas antiguas que solo aceptan iframes |
En línea o iframe: ¿cuál es la diferencia práctica?
Ambos funcionan. El modo en línea es la mejor opción predeterminada para la mayoría de los sitios de loan officers.
En línea (sin iframe)
- Se ajusta a la página; sin barras de desplazamiento dobles
- Estilos aislados en ambas direcciones
- Puede incluir título, definiciones y aviso legibles por buscadores
- Conserva la primera y la última fuente de tráfico entre páginas de su sitio
- Pasa a un marco automáticamente si hace falta
Iframe clásico
- Lo acepta casi cualquier plataforma
- Recuadro fijo, salvo en el modo de marco con ajuste automático
- El contenido vive en otra página, invisible para su página
- Conoce la página que lo aloja, pero no el historial de campañas salvo que se pase la URL
- Sirve como respaldo para constructores restrictivos
¿Qué debe haber en la página alrededor de la calculadora?
La calculadora incluye su propio aviso legal, pero la página donde está es su publicidad. Mantenga visibles su número NMLS, la declaración de Igualdad de Oportunidades en la Vivienda y su información de licencias estatales, y asegúrese de que el texto de consentimiento del formulario coincida con lo que su equipo de cumplimiento aprobó para llamadas y mensajes de texto. Vea consentimiento TCPA como referencia y consulte a su equipo de cumplimiento o a su abogado para su caso.
Siga leyendo
Preguntas frecuentes · 10 preguntas
Preguntas de los oficiales de préstamos
¿Cómo inserto una calculadora de hipoteca en WordPress?
Agregue un bloque de HTML personalizado donde debe aparecer la calculadora y pegue el código de su panel. El script puede ir en el mismo bloque. Si un plugin de seguridad elimina scripts, permita este script o use el modo dentro de un marco o el iframe clásico.
¿Funciona en embudos y sitios de HighLevel?
Sí. Pegue el código en un elemento de código personalizado de la página del embudo o del sitio. Para enviar los leads a un workflow, vea la integración con HighLevel, que usa un webhook en Producer o Brokerage.
¿Funciona en Wix, Squarespace y Webflow?
Sí. Use el elemento de código o de inserción de cada constructor. Si el constructor aísla las inserciones en su propio marco, la calculadora igual funciona; los modos con marco existen para constructores que bloquean scripts por completo.
¿Los estilos de mi sitio pueden romper la calculadora?
No en el modo en línea. La calculadora se muestra en un contenedor aislado: las fuentes, márgenes y botones de su tema no la afectan, y sus estilos no afectan su página.
¿Puedo abrir la calculadora desde un botón que ya tengo?
Sí. Use el modo trigger y dé a su botón o enlace una clase o selector CSS. Cualquier elemento que coincida abrirá la calculadora en una ventana emergente, sin cambiar su diseño.
¿Puedo poner la calculadora en español de forma predeterminada?
Sí. Agregue data-lang="es" al elemento. El visitante igual puede cambiar de idioma dentro de la calculadora. Vea las calculadoras multilingües para más detalles.
¿Tengo que cambiar el código si cambio el estilo de la calculadora?
No. El tema, los colores y los textos se cargan desde su configuración guardada cada vez que se monta la calculadora, así que los cambios del panel aparecen sin código nuevo.
¿Puedo poner varias calculadoras en una sola inserción?
Sí, con un widget. Un widget agrupa calculadoras en un botón flotante, pestañas, botones o tarjetas con el mismo código de una línea.
¿El código de inserción puede usar mi propio dominio?
Sí, en Producer y Brokerage. Cuando un dominio propio está activo, los códigos de inserción y las calculadoras se sirven desde ese dominio en lugar de app.prequalfunnel.com.
¿Sirve el enlace directo por sí solo?
Sí. El enlace directo abre la calculadora a página completa con su marca, ideal para correos, mensajes de texto, redes sociales y códigos QR en volantes, donde no se puede insertar código.
PrequalFunnel
Su próximo prestatario ya está en su sitio web.
Dele los números que vino a buscar y reciba el lead con esos números incluidos.
Gratis para siempre con Originator. Cambie de plan cuando quiera webhooks y su propia marca. 14 días de prueba gratis en los planes mensual y anual. Si cancela antes de que termine, no paga nada.