Formularios de Elementor: cómo crear un formulario de contacto de Elementor

Publicado: 2022-06-07

Elementor es uno de los creadores de páginas más populares con altas funcionalidades y amplias funciones. Pero podría sorprenderle que no tengan un generador de formularios multifuncional en su tablero. Lo que ofrece Elementor Form es muy simple y directo. Si desea utilizar opciones más avanzadas, como aceptar pagos o realizar encuestas, aún necesita un complemento de creación de formularios dedicado. Además, para administrar los envíos de formularios, debe instalar un complemento adicional para administrar sus entradas con Elementor. En este artículo, aprenderemos cómo crear el mejor formulario de contacto de Elementor y administrar datos con el mismo complemento.

Fluent Forms es el creador de formularios más amigable para principiantes. ¡Descárguelo ahora y comience a crear hermosas formas GRATIS!

Cómo crear un formulario de Elementor

Le mostraremos dos métodos para crear un formulario de contacto de Elementor para ayudarlo a elegir según sus necesidades.

Crear un formulario de contacto con Elementor Pro
La mejor manera de crear un formulario de contacto de Elementor (gratis)

Crear un formulario de contacto con Elementor Pro

Si desea crear un formulario con Elementor, deberá comprar Elementor pro. Con la licencia profesional, puede acceder al widget de formulario y diseñar su formulario dentro del generador de páginas de Elementor. También tendrá acceso a una gran cantidad de plantillas de formulario. Además, tendrá una serie de funciones interesantes que pueden transformar su sitio web.

Pasos para crear un formulario de contacto con Elementor –

1. Agregar formulario de Elementor a su página

Para agregar un formulario a la página, debe abrir una página o agregar una nueva, luego haga clic en editar con Elementor. Ahora busque Formularios en la barra de widgets en el lado izquierdo. Si no tiene la licencia profesional, no puede aprovechar esta función.

Ahora arrastre y suelte el widget en la página en la que desea crear su formulario de Elementor. Verá que aparece un formulario de contacto básico en su página.

2. Agregar diferentes campos a su formulario de Elementor

Puede ver que el formulario de Elementor tiene un montón de características en su manga. Solo necesita explorar y crear los formularios deseados en minutos. Ahora, ¿qué pasa si necesita diferentes campos y opciones en lugar de los precargados? Puede agregar más de 18 campos a sus formularios de Elementor y estos son:

Texto
Correo electrónico
Área de texto
URL
Teléfono
Radio
Seleccione
Caja
Aceptación
Número
Fecha
Tiempo
Subir archivo
Clave
HTML
Oculto
reCAPTCHA
Tarro de miel

Esa es una buena cantidad de tipos de campo para jugar. Puede crear diferentes formularios con este generador de formularios. Ahora necesita personalizar la configuración y diseñar su formulario para que sea llamativo.

3. Configuración del envío del formulario

Después del envío del formulario, puede configurar el directorio de correo electrónico y los datos que desea obtener del envío del formulario. Esto no es ciencia espacial. Puede configurar todas las opciones como:

A
Tema
Mensaje
Desde el e-mail
De Nombre
Responder a
CC
CCO

Todas las opciones para enviar un correo electrónico.

4. Diseña tu Formulario Elementor

Hay un puñado de opciones para diseñar su formulario. Desde cambiar el ancho de las columnas hasta cambiar el color de fondo de tu formulario, desde configurar el marcador de posición hasta cambiar la tipografía, puedes hacer lo que quieras con tu formulario.

Vaya a la opción Estilo para darle un aspecto único a su formulario.

Por qué el formulario de Elementor no es suficiente para ti

En primer lugar, no puede aprovechar todas las opciones de un complemento de creación de formularios normal en los formularios de Elementor. Sin embargo, solo ofrece lo básico. Si intenta crear diferentes formularios y analizar los datos, necesitará otro generador de formularios en su pila de tecnología de WordPress.

En segundo lugar, no hay funciones integradas para administrar envíos. Tienes que instalar otro complemento para hacerlo. Lo cual no es un paso óptimo para su sitio web. Debe elegir un complemento de creación de formularios que ofrezca varios campos, funcionalidades e integraciones, así como un servicio de administración de datos para analizar sus clientes potenciales.

En tercer lugar, Elementor viene con un widget de código abreviado que ayuda a integrar cualquier complemento de WordPress que tenga una opción de código abreviado. Aunque puede usar el widget de código abreviado de Elementor para agregar sus formularios, no puede personalizar su formulario usando Elementor. Es por eso que debe elegir un generador de formularios que se pueda editar en el diseño de Elementor, ya que ofrecen complementos esenciales para hacerlo.

La mejor manera de crear un formulario de contacto de Elementor (gratis)

Los formularios son uno de los componentes clave de cualquier sitio web. Desde capturar clientes potenciales hasta realizar encuestas, desde aceptar pagos hasta realizar cuestionarios, un creador de formularios moderno debe tener estas opciones en su paquete.

Además, debería poder personalizar el formulario en el diseño de Elementor para darle un aspecto vibrante y atractivo. Muchos creadores de formularios tienen la función de código abreviado, pero no puede editarlos sin el paquete Elementor.

Fluent Forms le brinda total flexibilidad para editar y personalizar sus formularios dentro del generador de páginas de Elementor. El widget de Formularios para Elementor incluye múltiples opciones para modificar el color y la tipografía de cada campo de su formulario. Puede diseñar el contenido de texto general del formulario según su elección.

Puede elegir el color de la fuente, el tamaño, el tipo y muchas más opciones para el formulario de su sitio web que se adapte perfectamente al aspecto de su sitio web.
Puede tener acceso a las opciones de tipografía para cada contenido de texto del formulario.
Las opciones de color para todos los campos de formulario también están disponibles.
Además, opciones particulares de color y tipografía para etiquetas de formulario, mensajes de error y mensajes de éxito.

También puede acceder a todas estas funciones principales de Fluent Forms:

Más de 50 campos de entrada y más de 70 plantillas prediseñadas para jugar
Autocompletado de direcciones y autocompletado de arrastrar y soltar
Protección antispam multicapa
Visualización y análisis de datos según necesidad
Carga de archivos y gestión de datos.
Formas conversacionales
Módulo de prueba
Lógica Condicional
Función de página de destino

Ahora que conoce los beneficios de usar Fluent Forms, hagamos los formularios de contacto de Elementor en un santiamén.

Cómo agregar un formulario de contacto de Elementor

La forma más sencilla de configurar un formulario de contacto de Elementor es con Fluent Forms. No necesita instalar diferentes complementos por separado como otros creadores de formularios ni personalizar el formulario fuera de Elementor.

Estos son los pasos para crear formularios de contacto de Elementor con Fluent Forms

Instalar y activar Fluent Forms Pro

Instalar Fluent Form es similar a instalar cualquier otro complemento de WordPress. Puede instalarlo y activarlo desde su panel de WordPress o descargarlo de WordPress.org si lo desea.

Para instalar desde el panel de control de WordPress, vaya al Panel de administración de WordPress y haga clic en Complementos → Agregar nuevo. Ahora, busque Fluent Forms, haga clic en Instalar y luego en Activar el complemento.

Para descargar desde WordPress.org, haga clic en este enlace de Fluent Forms y descárguelo. Ahora vaya a su Panel de administración de WordPress y haga clic en la opción Agregar nuevo desde complementos. Ahora cargue el archivo .zip y busque Fluent Forms en la lista de sus complementos instalados, haga clic en Activar.

Aunque Fluent Forms tiene una gran cantidad de campos y funcionalidades en la versión gratuita, debe actualizar a la versión pro para acceder a todas las funciones de Fluent Forms. Vea las características de Fluent Forms Pro vs. Free aquí.

Actualizar a la versión Pro es bastante sencillo, haga clic en el enlace para aprender cómo actualizar a Fluent Forms Pro.

Hacer un formulario de contacto de Elementor

Con Fluent Forms, crea formas hermosas y creativas en minutos. Para crear un formulario de contacto de Elementot, vaya a su panel de WordPress y desplace el cursor sobre Fluent Forms desde el lado izquierdo. Haga clic en la opción Nuevo formulario.

Aparecerá una nueva página, haga clic en Nuevo formulario en blanco y será redirigido a la interfaz del editor de formularios.

Agregue campos según su elección para crear un formulario de contacto para su sitio web. Hemos agregado la opción Nombre, Correo electrónico, Asunto y Su mensaje para nuestro sencillo Formulario de contacto de Elementor.

La personalización como permanecer y posicionar la etiqueta es muy sencilla en Fluent Forms. También puede configurar la lógica condicional en sus campos para crear un formulario más avanzado. Pero como lo mantenemos simple, no necesitamos ningún otro campo para rellenar el formulario. Los formularios largos pueden ser abrumadores para los usuarios, puede usar el formulario de varios pasos o el formulario conversacional para evitar el abandono del formulario.

Ahora guarde el formulario y copie el código abreviado. Puede usar la función de código abreviado de Fluent Forms que funciona con todos los creadores de páginas disponibles, incluidos Elementor, Oxygen, Divi, Visual Composer, etc. Y esta función le brinda compatibilidad directa con el widget de Elementor en su formulario, para usar un complemento menos.

Personaliza los formularios a tu gusto y podrás acceder a numerosas opciones de Elemetor. Desde alinear el texto de entrada hasta cambiar el tamaño y remodelar los campos de entrada, desde agregar colores de fondo clásicos y degradados hasta cambiar la tipografía. Puedes hacer lo que quieras con tus formularios de Elementor.

Pensamientos finales

No importa si usa formularios por diversión o por negocios, un formulario agradable y bien pulido siempre atrae a la gente. El generador de páginas de Elementor viene con todo menos un generador de formularios nativo multifuncional. Con Fluent Forms, puede tenerlo todo y puede diseñar el contacto de Elementor que desee.

Además, puedes publicar tu formulario en una página diferente o dentro de un blog, donde quieras. Pruebe algunos diseños y diseños diferentes, pruebe diferentes opciones de campo y haga sus formularios de Elementor según su elección. Esperamos que este artículo le indique cómo crear un formulario de contacto de Elementor para su sitio de WordPress.

Obtenga Fluent Forms Pro

Si tiene alguna consulta, comente a continuación. Háganos saber cómo podemos mejorar nuestro complemento y síganos en nuestras plataformas de redes sociales.