Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
Copa WPB
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Cómo generar más clientes potenciales con calculadoras online gratuitas (consejos profesionales)

Generar más clientes potenciales en su sitio web puede ser todo un reto. Una forma eficaz de captar información de los visitantes es a través de calculadoras en línea. Estas herramientas pueden incitar a los usuarios a compartir sus datos de contacto a cambio de resultados personalizados, lo que las convierte en una potente estrategia de generación de clientes potenciales.

Sin embargo, no basta con añadir una calculadora. Debe diseñar su calculadora no solo para atraer visitantes, sino también para animarles a proporcionar su información.

Según nuestra experiencia, el uso de los mejores maquetadores de formularios, como WPForms o Formidable Forms, facilita la creación de calculadoras personalizables que se adapten a sus necesidades. Estas soluciones ofrecen interfaces fáciles de usar y una variedad de características para impulsar la participación y la recopilación de datos.

En este artículo, le guiaremos a través de los pasos para crear una calculadora en línea que le ayude a generar más clientes potenciales para su sitio de WordPress.

generate-more-leads-with-free-online-calculator-og

¿Por qué las calculadoras en línea son tan buenas herramientas de generación de clientes potenciales?

Las calculadoras en línea son herramientas útiles que pueden ayudar a los visitantes a resolver problemas o responder preguntas. Y lo que es mejor, puede pedir la dirección de correo electrónico del visitante antes de mostrarle los resultados, lo que las convierte en una excelente forma de generar clientes potenciales.

Puede utilizar calculadoras en línea en muchos sectores y nichos diferentes. Por ejemplo, en el sector de la salud y el bienestar, puedes añadir una calculadora de IMC y animar a los visitantes a comprar un plan de alimentación.

online calculator example

Si vende a un público internacional, una calculadora que convierta las unidades métricas en imperiales puede aumentar las ventas al ayudar a los clientes a comprobar si un producto tiene la talla o el peso adecuados.

También puedes añadir una calculadora de hipotecas a tu sitio web inmobiliario o una calculadora de pagos de coche al sitio de tu concesionario de vehículos.

Car payment calculator example

Las posibilidades son infinitas, así que es fácil ver por qué las calculadoras en línea se están convirtiendo rápidamente en una de las formas más populares de hacer crecer su lista de correo electrónico.

Con esto en mente, le mostraremos cómo crear una calculadora en línea y generar clientes potenciales. Vamos a cubrir 2 métodos, y no dude en utilizar nuestros enlaces para saltar al método de su elección:

¿Preparados? ¡Vamos allá!

Método 1: Crear calculadoras en línea usando WPForms (Recomendado)

La mejor y más fácil manera de crear una calculadora en línea para su sitio de WordPress sin escribir una sola línea de código es utilizar el plugin WPForms.

WPForms' homepage

WPForms es el mejor plugin de calculadora y maquetador de formularios de contacto, con más de 6 millones de instalaciones. Permite crear todo tipo de formularios, incluidos formularios conversacionales, formularios de registro de usuarios y mucho más.

Además, tendrá acceso a una amplia gama de plantillas de formularios de calculadoras listas para usar, para que pueda empezar a generar confianza y clientes potenciales para su negocio.

Nota: Dado que vamos a utilizar la extensión de cálculos y la extensión de formularios de clientes potenciales para este tutorial, necesitará la versión WPForms Pro. Este plugin premium te da acceso a características avanzadas como informes de formularios y lógica condicional. Dicho esto, si desea crear formularios básicos, hay una versión gratuita que puede probar.

Paso 1: Instalar y activar el plugin WPForms

Una vez que haya comprado WPForms Pro, instale y active el plugin en su escritorio de WordPress. Para más detalles, marque / compruebe nuestro tutorial paso a paso sobre cómo instalar un plugin de WordPress.

Una vez activado, deberá dirigirse a WPForms ” Extensiones. Luego haga clic en el botón “Instalar extensión”.

install wpforms calculator addon

Dado que vamos a recoger clientes potenciales, también tendrá que encontrar la extensión Lead Forms.

Por lo tanto, vamos a hacer clic en “Instalar extensión” en el cuadro de Lead Forms Addon.

install wpforms lead forms addon

A continuación, veremos cómo crear una calculadora en línea que los usuarios puedan utilizar para realizar cálculos y obtener estimaciones precisas.

Paso 2: Crear su formulario de calculadora en línea

Comencemos navegando a WPForms Añadir Nuevo. Esto abrirá el maquetador de formularios en línea de arrastrar y soltar, donde puede crear y personalizar su formulario de calculadora.

add new forms in wpforms

A continuación, sólo tienes que dar un nombre a tu nuevo formulario escribiéndolo en la casilla.

Esto es para que puedas hacer referencia a tu formulario de calculadora más tarde cuando quieras hacer cambios o incrustarlo en una página o entrada.

name your form wpforms

A continuación, puede seleccionar la plantilla que más le convenga. En el panel izquierdo, puede navegar por las distintas categorías bajo la opción “Calculadora”.

Por ejemplo, si tiene un sitio web de gimnasios, puede elegir la categoría “fitness”.

Por otro lado, si tiene un concesionario o es agente inmobiliario, podría seleccionar la categoría “finanzas” para asegurarse de que sus clientes potenciales reúnen los requisitos para sus productos o servicios.

Con una enorme lista de plantillas, encontrará casi cualquier tipo de calculadora en línea que esté buscando.

Pero para este tutorial, utilizaremos el ‘Formulario generador de clientes potenciales de hipotecas’. Simplemente pase el cursor sobre la plantilla que desea utilizar y seleccione “Usar plantilla”.

use mortgage lead generator form template

Desde aquí, accederás a la pestaña “Campos”, donde verás el maquetador de formularios de arrastrar y soltar. Todos los campos disponibles están en el panel izquierdo.

Si quieres añadir un campo, arrástralo de la izquierda a la derecha. A la derecha está el editor que te permite ver el aspecto del formulario.

Con la extensión Formularios de clientes potenciales, verá automáticamente los saltos de página. Antes de cada salto de página, hay un botón “Siguiente” para que los usuarios puedan pasar a la página siguiente cuando hayan completado los campos obligatorios / requeridos / necesarios.

También verán una barra de progreso debajo que divide el formulario en secciones digeribles y mejora la experiencia del usuario.

Consejo profesional: Puede agrupar los campos relacionados en cada página e incluso incluir un encabezado de texto grande y en negrita que indique de qué trata cada página.

lead generator form in visual editor

El formulario de la calculadora de hipotecas incluye los siguientes campos:

  • Valor de la vivienda
  • Anticipo
  • Tasa / tarifa de interés
  • Periodo hipotecario
  • Pago mensual de la hipoteca
  • Importe del pago anual
  • Total de intereses pagados
  • Cuota hipotecaria total

Si usted es un prestamista hipotecario, esta plantilla contendrá la mayoría de los campos que probablemente esté buscando. Dicho esto, siempre puede añadir o borrar los campos que necesite.

Por ejemplo, puede ser conveniente añadir campos de opción múltiple que pregunten por la “Finalidad de la hipoteca o préstamo” y el “Tipo de propiedad” que busca el usuario. De este modo, podrá satisfacer mejor sus necesidades.

Cuando añada el campo, puede ir a la pestaña “General” en “Opciones de campo” y editar los detalles según sea necesario.

field options general tab wpforms

Paso 3: Modificación de los cálculos (opcional)

Una vez que haya establecido todos los campos, puede añadir o editar los cálculos de esta plantilla. En este formulario, el cálculo está controlado por el campo “Pago hipotecario total”.

Si hace clic en el campo y va a la pestaña “Avanzado”, podrá ver que la opción “Activar cálculo” ya debería estar activada. Si desea mantener la fórmula de cálculo original que viene con la plantilla, puede dejar este ajuste.

enable calculation wpforms

Sin embargo, si desea editar la fórmula, puede cambiar los valores en el cuadro de texto “Fórmula”.

Cuando los usuarios introduzcan los datos, el formulario calculará automáticamente los resultados en función de la información que hayan facilitado.

En la parte superior del cuadro “Fórmula”, puedes añadir funciones aritméticas como:

  • Suma (+)
  • Resta (-)
  • Multiplicación (*)
  • División (/)

Cada vez que inserte una fórmula, ésta debe quedar dentro de los paréntesis, que se pueden añadir en la parte superior del cuadro de fórmulas.

Simplemente haga clic en “Insertar campo” y verá la lista de códigos asociados a cada campo.

add formula in wpforms

Hay otras reglas que puedes poner en práctica, como la regla y si, si no.

Por ejemplo, si utiliza una fórmula del tipo “Gastos de vivienda/ingresos brutos mensuales”, puede exceder el riesgo del solicitante. Utilizar la regla “si/no” le ayudaría a rechazar o aceptar automáticamente a los solicitantes en función del riesgo.

Consejo de experto: Para obtener más información sobre el uso de las características de cálculo para su caso de uso específico, es posible que desee marcar / comprobar la documentación de Cálculos Addon de WPForms.

También puede hacer clic en “Hoja de trucos”, al lado del cuadro “Fórmula”, para ver todas las reglas y funciones disponibles que puede añadir.

Cuando hayas terminado de añadir la fórmula, no olvides hacer clic en “Validar fórmula” para asegurarte de que los cálculos y la sintaxis son correctos.

validate formula wpforms

Paso 4: Establecer las opciones de contacto

En el formulario de captación de clientes potenciales de su calculadora en línea, también es buena idea preguntar a los clientes cómo quieren que nos pongamos en contacto con ellos. De este modo, podrá hacer un seguimiento de los clientes potenciales que hayan mostrado interés en lo que usted ofrece.

Este es también un buen lugar para añadir iconos. Sólo tienes que hacer clic en el campo de opción múltiple, y entonces, deberías ver opciones para configurar las opciones de opción múltiple. Si conmutas el botón “Usar iconos”, los iconos se añadirán a tu formulario.

use icon choices wpforms

Ahora aparecerán recuadros con sonrisas.

Basta con hacer clic en el recuadro de la sonrisa facial del panel izquierdo para añadir una a su formulario.

add icon to wpforms

A continuación, aparecerá una pantalla emergente de “Selección de iconos”. Aquí puedes elegir entre más de 2.000 iconos.

Sólo tiene que utilizar la barra de búsqueda y escribir el icono que busca.

WPForms icon picker

También puede cambiar el ajuste “Color del icono” en el panel izquierdo.

Una vez que lo hayas completado y hayas elegido todos tus iconos en el campo de opción múltiple, esto es lo que debería parecer:

multiple choice icons in wpforms

Otro toque personal que puede añadir a su formulario es un logotipo o una imagen de cabecera en la parte superior del formulario de la calculadora.

Basta con hacer clic en el campo “Contenido” y arrastrarlo a la parte derecha del editor de formularios.

content field in wpforms

A continuación, puede seleccionar el campo “Contenido” para abrir las opciones de personalización.

En la pestaña “General”, puede hacer clic en el botón “Añadir medios” para subir el logotipo de su empresa.

add media in wpforms

Paso 5: Estilizar el formulario de la calculadora

Ahora, es el momento de personalizar el estilo de su formulario de clientes potenciales para adaptarlo mejor a su marca y hacerlo más atractivo.

Para ello, deberá dirigirse a Ajustes ” Formularios de clientes potenciales.

lead forms wpforms

Si activas los “Ajustes de estilo avanzados”, podrás añadir un contenedor alrededor de los campos y el formulario, dándole efectos de estilo para que resalte más.

También puede personalizar el color de los bordes de los campos, el fondo del contenedor y el texto.

customize color in wpforms

Añadir iconos y personalizar la apariencia de su formulario es una buena manera de mantener su aspecto elegante y profesional.

Paso 6: Editar el mensaje de confirmación

Lo último que tendrá que hacer es reseña / valoración y editar el mensaje de confirmación. WPForms enviará automáticamente un mensaje de confirmación que resume los campos que el usuario ha completado y los resultados de los cálculos.

Para ello, vamos a Ajustes ” Confirmaciones.

Desde aquí, puedes elegir enviar el mensaje directamente en la página o redirigir al usuario a otra página. A continuación, edita el mensaje en el cuadro de texto.

El uso de etiquetas inteligentes es una excelente manera de personalizar su mensaje basándose en la información que el usuario proporcionó.

confirmation message wpforms

Cuando estés satisfecho con el aspecto de tu formulario, pulsa el botón “Guardar”.

De este modo, no perderás los cambios que hayas hecho.

save lead generator form

Paso 7: Incrustar su nuevo formulario de calculadora en línea en una página o entrada de WordPress

A continuación, querrá incrustar su calculadora en línea en una de sus páginas o entradas de WordPress.

Para ello, abra cualquier página o entrada de WordPress, haga clic en el botón “+” para añadir un nuevo bloque y elija el bloque WPForms.

add wpforms block

En el menú desplegable, puede seleccionar el formulario de calculadora en línea que acaba de crear.

El formulario debería aparecer automáticamente en la página.

add lead generator form

Si todo se ve bien ya, seguir adelante y pulse “Publicar” en la parte superior.

Ahora, has añadido correctamente tu calculadora online a tu sitio WordPress.

publish mortgage loan calculator

Asegúrate de hacer una vista previa antes de terminar.

Debería ser algo parecido a esto:

preview mortgage loan calculator

Una vez hecho esto, deberá revisar el formulario para asegurarse de que todos los campos del formulario y los cálculos funcionan correctamente.

Por ejemplo, este es el aspecto del mensaje de confirmación cuando hemos rellenado este formulario:

thank you message mortgage loan calculator

Paso 8: Ver entradas / registros de formularios

Si se dirige a WPForms ” Entradas y selecciona el nombre de su formulario, verá todas las entradas de su formulario de calculadora en línea.

Puede ver, editar o eliminar fácilmente cada entrada / registros. Si visualiza la entrada, usted o su equipo de ventas podrán encontrar toda la información sobre clientes potenciales que estén buscando.

entries in wpforms

También puede exportar esta lista y subirla a una plataforma de automatización de marketing o conectarla a un plugin de automatización de WordPress como Uncanny Automator.

Esto le permitirá ponerse en contacto con clientes potenciales después de que envíen el formulario de la calculadora en línea.

Para saber más acerca de cómo hacerlo, puede comprobar nuestra guía sobre cómo generar clientes potenciales en WordPress como un profesional.

Método 2: Añadir una calculadora con Formularios Formidables (Avanzado)

Otra forma de añadir calculadoras online a WordPress es utilizando el plugin Formidable Forms. Tiene un avanzado maquetador de formularios de arrastrar y soltar y está entre los mejores plugins de calcul adoras para WordPress del mercado.

Este plugin está especializado en ayudar a crear formularios complejos con cálculos avanzados.

Por ejemplo, Formidable Forms viene con muchas plantillas de calculadoras, incluida una calculadora de hipotecas que puede añadir a su sitio web inmobiliario IDX y una calculadora de IMC ideal para blogs de salud y sitios web de gimnasios.

Is Formidable Forms the right form builder plugin for you?

Formularios Formidables también te permite añadir cálculos condicionales. Por ejemplo, en función de las respuestas del usuario en un formulario, puedes indicar al plugin qué fórmula debe utilizar automáticamente.

Lo primero que tienes que hacer es instalar y activar tanto el plugin gratuito Formidable Forms Lite como el premium Formidable Forms. Para más detalles, consulta nuestra guía sobre cómo instalar un plugin de WordPress.

Una vez que lo hayas hecho, puedes dirigirte a Formidable ” Ajustes globales y seleccionar ‘Añadir una licencia manualmente’.

add license formidable forms

Para encontrar su clave de licencia, sólo tiene que dirigirse al sitio web de Formidable Forms.

A continuación, acceda a su cuenta y vaya a la página “Descargas”.

formidable forms pro downloads

A partir de aquí, simplemente pegue su clave de licencia en el campo de su sitio WordPress.

Asegúrese de hacer clic en el botón “Guardar licencia” y, a continuación, en el botón “Actualizar” de la parte superior.

save license formidable forms pro

A continuación, aparecerá el mensaje “Licencia activada correctamente”.

Paso 1: Elegir una plantilla de formulario de calculadora

Ya está listo para crear su primera calculadora. El primer paso es navegar a Formidable ” Formularios y hacer clic en ‘+ Añadir nuevo.’

add new forms formidable forms pro

En la pantalla siguiente, verá las diferentes plantillas de formularios entre las que puede elegir.

Desde aquí, vamos a desplazarnos hacia abajo y seleccionar la categoría ‘Calculadora’, donde verá todas las plantillas de calculadora disponibles que Formidable Forms ofrece.

Para obtener una vista previa de una plantilla, sólo tienes que pasar el cursor sobre ella y pulsar “Ver demostración”. Cuando esté listo para empezar, pase el cursor por encima y haga clic en “Usar plantilla”.

Para esta guía, utilizaremos la plantilla ‘Calculadora de interés compuesto’, pero puede utilizar cualquier plantilla de calculadora que desee.

use compound interest calculator template

Ahora verá la plantilla elegida en el editor de Formularios Formulables.

Paso 2: Diseñe su calculadora gratuita en línea

Desde aquí, puede señalar y hacer clic para personalizar cualquier campo del formulario. Por ejemplo, si desea cambiar la etiqueta del campo o el intervalo de números del “Importe inicial”, haga clic para seleccionar ese campo.

A continuación, puede realizar los ajustes en el menú de la izquierda.

customize fields in online calculator form

Para añadir más campos a la calculadora, sólo tienes que seleccionar la pestaña “Añadir campos” del menú de la izquierda. A continuación, arrastre el campo a la plantilla de la calculadora.

Por ejemplo, si desea recopilar la dirección de correo electrónico del visitante, tendrá que añadir un campo en el que los usuarios puedan introducir esta información. Para ello, arrastre y suelte el campo “Correo electrónico” en la plantilla de la calculadora.

add email field

A continuación, haz clic en el campo “Correo electrónico” y ajusta los ajustes de “Opciones de campo”.

Normalmente puede utilizar los ajustes por defecto, pero para generar tantos clientes potenciales como sea posible, es una buena idea marcar la casilla “Obligatorio”. Esto significa que los visitantes tendrán que introducir una dirección de correo electrónico para ver sus resultados.

email requirement checkbox

Si lo necesita, puede seguir personalizando su calculadora cambiando los valores de los campos e incluso añadiendo otros nuevos.

Paso 3: Ajustar los cálculos

Formularios Formidables viene con plantillas listas que ya tienen cálculos pre-construidos. Dicho esto, si quieres ajustar las fórmulas o los valores, puedes hacerlo.

Nota: Si desea mantener los cálculos por defecto en la plantilla, entonces usted querrá dejar los campos avanzados solos.

Para comprobar los cálculos, haga clic en cualquiera de los elementos de campo afectados por la fórmula. Al hacer clic en cualquier elemento de campo, debería ver también un número de identificación.

En el panel izquierdo, debe ir a Opciones de campo ” pestaña Avanzadas . En “Valor por defecto”, verá la fórmula utilizada.

En este caso, vemos que “Interés compuesto total” tiene un ID de 20.

La fórmula “[18]+[19]” establece que el “Interés compuesto sobre el principal” + el “Interés compuesto sobre los depósitos” es igual al “Interés compuesto total”.

default value in formidable forms

Si no está seguro de cuál es el número de identificación de un campo concreto o desea ver qué campos puede añadir a su fórmula, sólo tiene que hacer clic en el icono de tres puntos situado junto a “Valor por defecto”.

A continuación, puede seleccionar el campo que busca en el menú desplegable Lista de campos. Puede elegir el campo que desee y se añadirá al “Valor por defecto” para utilizarlo en la fórmula.

field list formidable forms

Algo a tener en cuenta es que utilizarás todos los símbolos matemáticos estándar, como:

  • + por adición
  • – para restar
  • * para multiplicar
  • / para la división
  • () para agrupar determinados cálculos
  • Math.pow() para añadir exponentes a una ecuación

He aquí un ejemplo.

calculation in formidable forms

Como se ha indicado anteriormente, la [] es la notación para los números de identificación.

Una vez hecho esto, querrá obtener una vista previa del formulario para asegurarse de que los cálculos funcionan correctamente.

Cuando estés satisfecho con la forma de la calculadora, sólo tienes que hacer clic en el botón “Guardar”.

save compound interest calculator form

Debería aparecer un mensaje pidiéndole que le dé un nombre a su formulario.

Dale un nombre para que puedas referirte a él más adelante. A continuación, pulsa el botón “Guardar”.

save form

Al cabo de unos instantes, aparecerá el mensaje “actualizado correctamente”.

Paso 4: Añadir una calculadora online gratuita a WordPress

Ya puedes añadir la calculadora a cualquier página o entrada de tu sitio web WordPress. Debes dirigirte a la página o entrada en la que deseas añadir el formulario de la calculadora.

Para empezar, escribamos un título para la página de la calculadora.

Una vez hecho esto, haga clic en el icono ‘+’. A continuación, selecciona el bloque “Formularios”. Cuando aparezca el bloque adecuado, simplemente haz clic en él para añadirlo a la página.

add formidable forms block

A continuación, abra el menú desplegable “Seleccionar un formulario” y elija la calculadora que ha creado anteriormente.

WordPress cargará ahora la calculadora personalizada automáticamente.

select a form in formidable forms block

En este punto, puede seguir editando la página añadiendo texto, imágenes, una descripción de la calculadora, categorías y etiquetas, etc.

Cuando esté listo para publicar la calculadora, haga clic en el botón “Publicar” o “Actualizar” de la esquina derecha.

publish compound interest calculator form

Tu nueva página de calculadora ya está disponible en tu sitio web.

Este es el aspecto de nuestro sitio web de demostración:

compound interest calculator preview

Consejo extra: Obtenga más clientes potenciales con OptinMonster

Su siguiente tarea es conducir a la gente a la calculadora en línea gratuita para que pueda aumentar el número de suscriptores y clientes potenciales para su sitio web de pequeñas empresas.

Ahí es donde entra OptinMonster.

OptinMonster es el mejor plugin de generación de clientes potenciales para WordPress. Viene con plantillas de diseño profesional y un editor de arrastrar y soltar que puede utilizar en sus campañas.

use template in OptinMonster

También cuenta con herramientas como cajas de luz emergentes, ventanas emergentes deslizables, banners de cabecera y pie de página, temporizadores de cuenta atrás y mucho más.

Todas estas herramientas son perfectas para promocionar tu calculadora online gratuita y así conseguir más usuarios y conversiones.

car payments lead generation popup

Si tiene una tienda online, OptinMonster también dispone de una característica avanzada de “Intención de salida” que puede convertir a los visitantes que abandonan en clientes y suscriptores.

Para obtener más información, puede consultar nuestro artículo sobre cómo aumentamos nuestros suscriptores de correo electrónico en un 600% con OptinMonster.

Esperamos que este artículo te haya ayudado a aprender cómo generar más clientes potenciales con calculadoras online. Puede que también quieras ver nuestra selección de los mejores maquetadores de formularios online y nuestra guía práctica sobre cómo añadir la funcionalidad de guardar o continuar en los formularios de WordPress.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

Descargo: Nuestro contenido está apoyado por los lectores. Esto significa que si hace clic en algunos de nuestros enlaces, podemos ganar una comisión. Vea cómo se financia WPBeginner , por qué es importante, y cómo puede apoyarnos. Aquí está nuestro proceso editorial .

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

El último kit de herramientas de WordPress

Obtenga acceso GRATUITO a nuestro kit de herramientas - una colección de productos y recursos relacionados con WordPress que todo profesional debería tener!

Reader Interactions

Comentarios

  1. Felicidades, tienes la oportunidad de ser el primer comentarista de este artículo.
    ¿Tiene alguna pregunta o sugerencia? Por favor, deje un comentario para iniciar la discusión.

Deja tu comentario

Gracias por elegir dejar un comentario. Tenga en cuenta que todos los comentarios son moderados de acuerdo con nuestros política de comentarios, y su dirección de correo electrónico NO será publicada. Por favor, NO utilice palabras clave en el campo de nombre. Tengamos una conversación personal y significativa.