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: #

Este widget es un complemento para el Formulario de contacto 7.

Por lo tanto es necesario tener Complemento del formulario de contacto 7 instalado en su sitio de WordPress.

Paso 1: cree un formulario con el Formulario de contacto 7 #

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.

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.

Arrastra y suelta el widget #

Después de eso, arrastre y suelte ElementsKit. Formulario de contacto 7 widget en el editor de 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.

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.

5. Altura del área de texto: Para el campo de área de texto largo, puede cambiar su altura.
6. Relleno del área de texto: También puedes cambiar el relleno del área de texto.

7. Tipo de fondo: Elija un tipo de color de fondo (color clásico o degradado).
8. Color: Elija un color de fondo para el campo de entrada.
9. Radio de frontera: Establezca el radio del borde para el campo de entrada.
10. Tipo de borde: Seleccione el tipo de borde del campo de entrada.
11. 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.

12. Tipografía: Establezca la tipografía para el texto de entrada.
13. Color de texto: Elija un color para el texto de entrada.
14. Tamaño de fuente del marcador de posición: Ajuste el tamaño de fuente del marcador de posición.
15. Color del marcador de posición: Elija un color para el texto del marcador de posición.