Soporte prioritario
Help Center > Themes > Tema Hello Biz > Formulario Lite

Formulario Lite

ƚltima actualizaciĆ³n: septiembre 3, 2025

Esta publicaciĆ³n ha sido traducida mediante traducciĆ³n automĆ”tica, por lo que puede haber ligeras inexactitudes o diferencias en la redacciĆ³n en comparaciĆ³n con el original. Pedimos disculpas por cualquier inconveniente que esto pueda causar. Por favor, contĆ”ctenos si necesita que aclaremos algo para usted.

AƱadir el widget

Para acceder y usar un widget:

  1. En el editor de Elementor, haga clic en +.
    Se muestran todos los widgets disponibles.

  2. Haga clic o arrastre el widget al lienzo. Para obtener mĆ”s informaciĆ³n, consulte AƱadir elementos a una pĆ”gina.

ĀæQuĆ© es el widget Formulario Lite?

Recopilar informaciĆ³n de los visitantes puede ser una de las cosas mĆ”s importantes que su sitio web puede hacer por usted.

El widget Formulario Lite le permite crear de forma rĆ”pida y eficiente un formulario que permite a los visitantes enviar informaciĆ³n que se le envĆ­a por correo electrĆ³nico y se almacena en su Ć”rea de administraciĆ³n de WP.

Vea todas las opciones disponibles con el widget Formulario Lite.

Caso de uso comĆŗn

Alex quiere aceptar reservas por correo electrĆ³nico para su bar deportivo. Ponen una llamada a la acciĆ³n en su pĆ”gina de inicio que estĆ” vinculada a un formulario de reservas. Cuando los usuarios completan el formulario con una solicitud de reserva, se envĆ­a a la direcciĆ³n de correo electrĆ³nico del bar para que Alex pueda reservar una mesa.

Casos de uso adicionales

  • Haga que los visitantes rellenen un formulario para suscribirse a su boletĆ­n.
  • Recopile solicitudes de empleo utilizando un formulario en su sitio.
  • Los visitantes de su sitio pueden enviar un formulario para que uno de sus representantes pueda ponerse en contacto con ellos.

AƱadir un widget de formulario lite: paso a paso

En el siguiente ejemplo, crearemos un formulario de reservas. Los clientes que deseen reservar una mesa rellenan el formulario y, cuando lo envĆ­an, el propietario del bar, Alex, recibirĆ” un correo electrĆ³nico. La informaciĆ³n tambiĆ©n estarĆ” disponible en el Ć”rea de administraciĆ³n de WP.

AƱadir un formulario

Para aƱadir un widget Formulario Lite:

  1. AƱada un widget Formulario Lite al lienzo.
  2. Seleccione uno de los diseƱos de formulario preestablecidos.
  3. Abra el campo Texto.
  4. En el panel, en el cuadro de texto Encabezado, introduzca Ā”Reserve ahora!

  5. En el cuadro de texto DescripciĆ³n, introduzca Garantice su lugar enviĆ”ndonos una solicitud de reserva.
    El widget Formulario Lite tiene campos para Nombre, Correo electrĆ³nico y Mensaje de forma predeterminada. Sin embargo, tambiĆ©n nos gustarĆ­a llamar a la gente para confirmar su reserva, asĆ­ que aƱadiremos un campo de TelĆ©fono.
  6. En el panel, abra la secciĆ³n Campos del formulario.
  7. Haga clic en AƱadir elemento.
  8. Utilice el menĆŗ desplegable Tipo, seleccione Tel.
  9. En el campo de texto Etiqueta, introduzca TelƩfono.
  10. Active la opciĆ³n de requerido a SĆ­.
  11. Arrastre el nuevo campo para que estĆ© debajo del campo Correo electrĆ³nico.
    Ahora nos aseguraremos de que los envĆ­os del formulario vayan al lugar correcto.
  12. Cierre la secciĆ³n Campos del formulario.
  13. Abra el campo Acciones despuƩs del envƭo.
  14. En el campo Para, introduzca su direcciĆ³n de correo electrĆ³nico.
  15. En la lĆ­nea de Asunto, introduzca Solicitud de reserva.

    Cuando los usuarios envĆ­an su formulario haciendo clic en el botĆ³n Enviar, se envĆ­a un correo electrĆ³nico a la direcciĆ³n que introdujo. El envĆ­o tambiĆ©n se almacena en su administraciĆ³n de WP. Para obtener mĆ”s informaciĆ³n, consulte Gestionar los envĆ­os de formularios.

Ajustes para el widget de formulario lite

Puede personalizar sus widgets utilizando contenido, estilo y otros parƔmetros avanzados, lo que le ofrece una gran flexibilidad para adaptarlos a sus necesidades. Haga clic en las pestaƱas de abajo para ver todos los ajustes disponibles para el widget Formulario.

PestaƱa Contenido

AƱada, elimine y edite campos de formulario, pasos, botones y controles. Determine lo que sucede despuƩs de que los visitantes envƭen sus respuestas.

Seleccione una de las plantillas de formulario para empezar con su diseƱo.

  • Encabezado: Introduzca un encabezado para su formulario en el cuadro de texto. El encabezado debe ser lo mĆ”s corto posible, con menos de cinco palabras.
  • Etiqueta HTML del encabezado: La etiqueta HTML indica a los motores de bĆŗsqueda y al software de accesibilidad la importancia del elemento. Recomendamos dejar la configuraciĆ³n predeterminada, pero puede utilizar el menĆŗ desplegable para cambiar la etiqueta HTML.
  • DescripciĆ³n: Introduzca cualquier detalle que desee dar sobre su formulario.

Asigne un nombre a su formulario.

Edite y cree campos para su formulario. Cada campo representa los datos que recopila de sus visitantes, como Nombre y Correo electrĆ³nico.

Hay dos iconos que aparecen a la derecha del nombre del campo:

– Duplicar este elemento del menĆŗ. El uso de la copia ayuda a mantener la coherencia en su menĆŗ.

– Eliminar este elemento del menĆŗ.

Cuando hace clic en el nombre de un campo, aparecen opciones adicionales en dos pestaƱas: Contenido y Avanzado.

En la pestaƱa Contenido, estƔn disponibles las siguientes opciones:

  • Tipo: Establezca el tipo de campo para ayudar a filtrar los datos irrelevantes. Por ejemplo, establecer el tipo en correo electrĆ³nico, significa que los visitantes deben enviar direcciones de correo electrĆ³nico vĆ”lidas. Consulte Tipos de campo para obtener mĆ”s detalles.
  • Etiqueta: Cree un nombre para el campo, como Nombre, para indicar a los usuarios quĆ© informaciĆ³n deben introducir.
  • Marcador de posiciĆ³n: TambiĆ©n conocido como texto fantasma, es un texto que aparece en el campo para dar informaciĆ³n mĆ”s detallada sobre el campo, por ejemplo, en un campo llamado PelĆ­culas favoritas, el texto fantasma podrĆ­a ser, Ā«Enumere sus tres mejores opcionesĀ».
  • Obligatorio: Utilice el conmutador para determinar si los usuarios deben rellenar este campo para enviar el formulario.
  • Ancho de la columna: Establezca la cantidad de espacio que ocuparĆ” el campo. Esto se puede utilizar para campos en los que espera respuestas cortas o si desea que varios campos aparezcan en una lĆ­nea. Por ejemplo, si desea que dos campos aparezcan en una lĆ­nea, asĆ­gneles a cada uno un ancho del 50%.

Cree un campo en blanco para su formulario.

Utilice el conmutador para Mostrar u Ocultar el nombre del campo.

Utilice el conmutador para Mostrar u Ocultar si el campo es obligatorio o no. La prƔctica estƔndar es marcar estos campos para que los visitantes sepan que deben rellenarlos.

Ancho de la columna: Establezca el tamaƱo del Ć”rea asignada para el botĆ³n. Esto afectarĆ” a la colocaciĆ³n del botĆ³n.

Por ejemplo, si el tamaƱo de su columna es del 100% y alinea el botĆ³n a la derecha, el botĆ³n estarĆ” a la derecha. Sin embargo, si establece un ancho de columna del 50% y alinea el botĆ³n a la derecha, aparecerĆ” en el centro del formulario.

El botĆ³n Enviar envĆ­a la informaciĆ³n del formulario al propietario del sitio web. Se aƱade a la Ćŗltima pĆ”gina del formulario.

Si no desea etiquetar el botĆ³n como Enviar, utilice el cuadro de texto para introducir una etiqueta diferente.

Puede aƱadir una pequeƱa imagen al botĆ³n:

  • Para no tener ningĆŗn icono, haga clic en .
  • Para subir su propia imagen .svg para usarla como icono, haga clic en
  • Para seleccionar un icono de la biblioteca, haga clic en el sĆ­mbolo del icono.

Asigne un ID a su botĆ³n para que pueda identificarlo mĆ”s tarde. Esto a menudo ayuda en el procesamiento de la informaciĆ³n que recopila.

Active SĆ­ si desea mostrar a los visitantes una pĆ”gina diferente despuĆ©s de que envĆ­en un formulario. La pĆ”gina podrĆ­a contener un simple agradecimiento o podrĆ­a incluir informaciĆ³n adicional como: Ā«Nos pondremos en contacto con usted en 48 horas.Ā»

Si activa Sƭ, tendrƔ que aƱadir la URL de la pƔgina.

Cuando un visitante envĆ­a un formulario, puede recibir los envĆ­os como un correo electrĆ³nico. Utilice esta secciĆ³n para definir estos correos electrĆ³nicos.

  • Para: La direcciĆ³n de correo electrĆ³nico donde se recibirĆ”n los envĆ­os.
  • Asunto: La lĆ­nea de asunto del correo electrĆ³nico que se enviarĆ” a la direcciĆ³n de correo electrĆ³nico en la configuraciĆ³n Para.
  • Mensaje: Cualquier texto e informaciĆ³n del formulario que se enviarĆ” en el correo electrĆ³nico. La configuraciĆ³n predeterminada es [all-fields], incluye toda la informaciĆ³n del formulario en el correo electrĆ³nico.
  • Correo electrĆ³nico del remitente: AƱada el correo electrĆ³nico desde el que se enviarĆ” el correo electrĆ³nico.
  • Nombre del remitente: Determine bajo quĆ© nombre se enviarĆ” el correo electrĆ³nico. Esto puede ayudarle a filtrar estos correos electrĆ³nicos mĆ”s tarde.
  • Responder a: Edite esta direcciĆ³n de correo electrĆ³nico si desea responder a estos correos electrĆ³nicos y que estas respuestas se envĆ­en a una direcciĆ³n diferente.
  • Cc: EnvĆ­e una copia de estos correos electrĆ³nicos a otra direcciĆ³n.
  • Cco: EnvĆ­e una copia oculta de estos correos electrĆ³nicos a otra direcciĆ³n.
  • Metadatos: De forma predeterminada, los correos electrĆ³nicos enviados por el formulario incluyen metadatos como la hora, la fecha, la URL de la pĆ”gina, el agente de usuario (informaciĆ³n del navegador), la IP remota (direcciĆ³n IP de la persona que envĆ­a el formulario), el crĆ©dito (el software que creĆ³ el formulario).
  • Enviar como: Utilice el menĆŗ desplegable para determinar si el correo electrĆ³nico enviado por el formulario estĆ” en formato HTML o plano.

Solo para usuarios de Elementor Pro.

Active Activado para activar la funciĆ³n de envĆ­os de formularios. Esta funciĆ³n le permite acceder al envĆ­o de formularios desde WP Admin>Elementor>EnvĆ­os.

El cĆ³digo personalizado a veces puede requerir que le dĆ© a su formulario un ID.

AsegĆŗrese de que su ID de formulario sea Ćŗnico.

En general, los navegadores ya tienen mensajes integrados para los envĆ­os de formularios que indican Ć©xito o errores del formulario.

Activar Mensajes personalizados a SĆ­ le permite crear sus propios mensajes que se mostrarĆ”n en caso de que el navegador del visitante no proporcione estos mensajes o los mensajes no se muestren por alguna razĆ³n.

PestaƱa Estilo

Determina el aspecto de los elementos y controles del menĆŗ.

Determine si el encabezado y la descripciĆ³n aparecerĆ”n a la derecha, a la izquierda o en el centro del formulario.

Controle el aspecto del Encabezado.

Controle el aspecto del Encabezado.

Controle el diseƱo de su formulario.

  • Espacio entre columnas: Si su formulario tiene mĆ”s de una columna, utilice el control deslizante para establecer el espacio entre las columnas. Esto ocurre cuando hay mĆ”s de un campo en una fila.
  • Espacio entre filas: Utilice el control deslizante para subir y bajar el espacio entre los campos.

Controle el aspecto de las etiquetas del formulario.

  • Espaciado: Establezca la distancia entre la etiqueta y el campo.
  • Color del texto: Determine el color del nombre del campo. Para obtener mĆ”s detalles, consulte Elija un color o Utilice fuentes y colores globales.
  • TipografĆ­a: Determine la fuente y el tamaƱo del nombre del campo.

    Para obtener mƔs detalles, consulte Tipografƭa.

Esta secciĆ³n determina el aspecto de los campos del formulario. Esto incluye el texto del marcador de posiciĆ³n, el borde del campo y mĆ”s.

  • Color del texto: Establezca el color del texto del marcador de posiciĆ³n. Para obtener mĆ”s detalles, consulte Elija un color o Utilice fuentes y colores globales.
  • TipografĆ­a: Establezca el tamaƱo y el tipo de fuente del texto del marcador de posiciĆ³n. Para obtener mĆ”s detalles, consulte TipografĆ­a.
  • Color de fondo: Establezca el color del cuadro de campo.
  • o mĆ”s detalles, consulte Elija un color o Utilice fuentes y colores globales.
  • Borde: Active SĆ­ si desea un borde alrededor del campo.
  • Color del borde: Establezca un color para el borde del campo. Fpara obtener mĆ”s detalles, consulte Elija un color o Utilice fuentes y colores globales.
  • Ancho del borde: Delimite el campo con un borde.
  • Forma: Seleccione una forma de borde en el menĆŗ desplegable:
    • Redondo: Los botones aparecen con esquinas suaves.
    • Redondeado: Los botones aparecen con bordes uniformemente curvados.
    • Afilado: Botones rectangulares.

Utilice el menĆŗ desplegable para seleccionar:

  • BotĆ³n: AparecerĆ” como un botĆ³n estĆ”ndar.
  • Enlace: AparecerĆ” como texto.

Establezca el tamaƱo y el tipo de fuente para todos los botones del formulario.

Puede hacer que el botĆ³n cambie cuando los usuarios mueven el ratĆ³n:

  • Normal: CĆ³mo aparece de forma predeterminada.
  • Hover: CĆ³mo aparece el botĆ³n cuando los visitantes pasan el ratĆ³n por encima de ellos. El modo Hover le permite establecer una duraciĆ³n de transiciĆ³n. Esta es la cantidad de tiempo que tarda el botĆ³n en cambiar su apariencia.

A continuaciĆ³n, se muestran las caracterĆ­sticas que pueden cambiar:

AƱada un borde a su botĆ³n. Si aƱade un borde, tambiĆ©n puede establecer:

Elija una de las siguientes opciones:

  • Redondo: Los botones aparecen con esquinas suaves.
  • Redondeado: Los botones aparecen con bordes uniformemente curvados.
  • Afilado: Botones rectangulares.

Determine el espacio entre el borde del botĆ³n y el texto. Para obtener mĆ”s informaciĆ³n, consulte Relleno y mĆ”rgenes.

La secciĆ³n Mensajes controla el estilo de los mensajes que se muestran a los visitantes despuĆ©s de enviar un formulario:

  • TipografĆ­a: Determine el tamaƱo y el tipo de fuente utilizados en el mensaje.
  • Color del mensaje de Ć©xito: Establezca el color del mensaje si el formulario del visitante se enviĆ³ al propietario del sitio web. Para obtener mĆ”s informaciĆ³n, consulte Elegir un color o Usar fuentes y colores globales.
  • Color del mensaje de error: Establezca el color del mensaje si el formulario del visitante no se enviĆ³ al propietario del sitio web. Para obtener mĆ”s informaciĆ³n, consulte Elegir un color o Usar fuentes y colores globales.
  • Color del mensaje en lĆ­nea: Esto solo es relevante si elige mostrar mensajes personalizados. Algunos mensajes personalizados aparecen dentro del propio formulario, estos se denominan mensajes en lĆ­nea y esta configuraciĆ³n determina su color.

AƱada un fondo a su formulario. Para obtener mĆ”s informaciĆ³n, consulte Crear un fondo.

Utilice el control deslizante para determinar el ancho del formulario.

Cree espacio entre el contenido del formulario y los bordes del formulario. Para obtener mĆ”s informaciĆ³n, consulte Relleno y mĆ”rgenes.

PestaƱa Avanzado

Controla la colocaciĆ³n de tu widget, inserta enlaces, aƱade cĆ³digo personalizado y mucho mĆ”s.

ObtĆ©n mĆ”s informaciĆ³n sobre los ajustes de la pestaƱa Avanzado.

En esta pƔgina

Compartir este artĆ­culo

Hosted with