Formulario de contacto 7

ElementsKit viene con el widget Contact Form 7 que se suma a las funcionalidades del complemento del creador de formularios. Puede personalizar los estilos del formulario de contacto 7 con Elementor utilizando al máximo la funcionalidad del creador de páginas.

Lea esta documentación para aprender cómo crear y personalizar el formulario usando Contact Form 7 con Elementor.

Requisito previo:

You need to have Complemento del formulario de contacto 7 instalado en su sitio de WordPress.

Create a form with Contact Form 7 #

Follow the below steps and create your desired form easily.

Step 1: Add New Contact Form #

  1. Ir a Contacto > Agregar nuevo.
  2. Introduzca un nombre de formulario.
  3. Configure los ajustes y atributos del formulario.
  4. Clickea en el Ahorrar botón.
Agregar nuevo formulario de contacto 7 en WordPress

Paso 2: obtenga el formulario de contacto 7 en Elementor #

Para obtener el Formulario de contacto 7 en Elementor, primero habilite el widget Formulario de contacto 7 de ElementsKit, luego abra el editor de Elementor y arrastre y suelte el widget en el área de diseño.

Habilitar el widget Formulario de contacto 7 #

Para habilitar el widget Content Ticker:

  1. Navegar a ElementosKit > Widgets desde el panel de WordPress.
  2. Encuentra el Formulario de contacto 7 widget de la lista y habilitar el widget.
  3. Clickea en el GUARDAR CAMBIOS.
Habilitar el widget del formulario de contacto 7 de ElementsKit

Arrastra y suelta el widget #

Después de eso, arrastre y suelte ElementsKit. Formulario de contacto 7 widget en el editor de Elementor.

Agregar el widget del formulario de contacto 7 en Elementor

Paso 3: seleccione un formulario para editar con Elementor #

En este paso, puede seleccionar qué formulario desea editar. Para eso, puede seleccionar el formulario de la lista desplegable.

En Contenido > Formulario de contacto 7 > Estilo encontrará una lista de formularios creados con Contact Form 7. Seleccione un formulario y continúe con el siguiente paso.

Paso 4: personaliza el formulario de contacto 7 con Elementor #

Ahora puedes personalizar los estilos de las etiquetas, el campo de entrada y el botón de Contact Form 7 con Elementor.

Etiqueta #

  1. Tipografía: Establezca la tipografía para el texto de la etiqueta.
  2. Color: Elija un texto de color para el texto de la etiqueta.
  3. Margen: Ajuste el Margen para la etiqueta del campo del formulario.
  4. Pista: También puedes cambiar la tipografía y el color del marcador de posición.
Personalice los estilos de etiquetas de formulario en ElementsKit Contact Form 7

Aporte #

  1. Relleno: Ajuste el relleno del campo de entrada.
  2. Ancho: Puede ajustar el ancho del campo de entrada.
  3. Altura: Puede cambiar la altura del campo de entrada.
  4. Margen inferior: Cambie el margen en la parte inferior del campo de entrada.
Ajustar el ancho de la altura del campo de entrada
  1. Altura del área de texto: Para el campo de área de texto largo, puede cambiar su altura.
  2. Relleno del área de texto: También puedes cambiar el relleno del área de texto.
Personalizar el campo de entrada del formulario
  1. Tipo de fondo: Elija un tipo de color de fondo (color clásico o degradado).
  2. Color: Elija un color de fondo para el campo de entrada.
  3. Radio de frontera: Establezca el radio del borde para el campo de entrada.
  4. Tipo de borde: Seleccione el tipo de borde del campo de entrada.
  5. Sombra de la caja: Puede configurar la sombra del cuadro para el campo de entrada.

Puede configurar estos atributos individualmente para Normal, Flotar, y Modos de enfoque.

personalizar los colores del campo de entrada del formulario
  1. Tipografía: Establezca la tipografía para el texto de entrada.
  2. Color de texto: Elija un color para el texto de entrada.
  3. Tamaño de fuente del marcador de posición: Ajuste el tamaño de fuente del marcador de posición.
  4. Color del marcador de posición: Elija un color para el texto del marcador de posición.
Personalizar el color de la tipografía del texto de entrada

Comprobar el advanced features of ElementsKit 👇

Complemento ElementsKit Elementor

cuales son tus sentimientos
Updated on diciembre 30, 2024