Cómo añadir un formulario de contacto de WordPress (Contant Form by WPForms)

En este artículo aprenderás cuál es uno de los mejores plugins para añadir formulario de contacto en WordPress en cuanto al manejo, considerando que es muy sencillo construirlo adaptado a tus preferencias, para luego subirlo a la web. Además, se trata de un plugin gratuito.

Paso a paso te iré mostrando cómo instalar, configurar y utilizar este plugin para crear formularios de contacto en tu web.

Instalar el plugin Contact Form

Lo primero que debes hacer es iniciar sesión en la web donde tengas todos los plugins, y te diriges a la barra lateral izquierda, despliegas la lista de plugins, y luego a Añadir nuevo.

Añadir formulario de contacto de WordPress

Dentro colocaremos en el buscador la palabra clave contact form, de inmediato aparecerá la opción que debes instalar, para luego activar para comenzar a usarlo. Luego de la instalación, selecciona Activar.

Notarás que en la barra lateral aparecerá una nueva pestaña, WP Forms.

Añadir formulario de contacto de WordPress

Todos los formularios

Debes dirigirte a la barra lateral izquierda para desplegar la lista de la nueva pestaña WPForms. Dentro de todas las opciones que verás, seleccionarás la primera Todos los formularios

Añadir un formulario de contacto

Con los pasos que hemos realizado hasta ahora, ya podemos añadir nuestro formulario de contacto. Al seleccionar Añadir nuevo podemos comenzar a crearlo gracias al plugins que hemos instalado.

Lo primero que haremos es colocar un nombre, considerando que por defecto ya tienes diversas plantillas maquetadas a escoger. Aunque si lo prefieres, puedes partir de una plantilla en blanco.

Añadir formulario de contacto de WordPress

Formulario en blanco

Podrás crear un formulario desde cero, a partir del cual podrás personalizar como desees. Notarás que también tienes opciones Premium, aunque las opciones básicas son las que nos interesan.

Añadir formulario de contacto de WordPress

Empieza introduciendo el primer bloque

Para hacer uso de ellas, simplemente las arrastraremos de un sitio a otro para introducirlas. Lo primero será introducir Texto de una sola línea, el cual hará referencia al nombre. Solo tendrás que pulsar encima para cambiar la etiqueta.

Añadir formulario de contacto de WordPress

Si la etiqueta es, por ejemplo, Tu nombre, te quedará debajo el espacio en blanco para colocarlo. Aunque para ello será necesario que marques de bajo Obligatorio, en caso de que desees que se llene ese apartado de manera obligatoria dentro del formulario.

Sección Avanzado (Aplica en casi todos los campos)

En casi todos los bloques que quieras añadir, está la sección general, y también la sección avanzado. Con esta sección podrás cambiar también cambiar otro tipo de detalles; Como el tamaño del campo, entre otras tantas cosas, según lo que desees.

Añadir campo de texto

Podemos añadir un segundo campo de texto de una sola línea, el cual podría perfectamente bien hacer referencia a los apellidos. El procedimiento es el mismo. Sin embargo, esta vez podrías colocar en la descripción alguna especificación mayor, como “Primer y segundo apellido”, y así dejas constancia a modo de nota.

Campo de “solo números”

Tienes diversas opciones para agregar tantos campos como quieras, otro de ellos son los Números. En este caso obligarías a la persona a que solo debe colocar números. Suele hacerse si quieres que por ejemplo introduzca un teléfono de contacto.

Si no marcas Obligatorio, quedaría como opcional. Tú eliges.

Añadir formulario de contacto de WordPress

Correo electrónico

Para la mayoría de los formularios también suele ser importante colocar una casilla de correo electrónico. Como son datos muy usuales e importantes de solicitar, es habitual escoger que también sea obligatorio.

Añadir formulario de contacto de WordPress

La diferencia es que esta, como es común, pide también que actives la confirmación. Aunque es decisión personal colocarla o no, es lo que se sugiere hacer, especialmente para evitar que se confundan.

Captcha (protégete de bots y spam)

El tema del Captcha es un poco diferente, porque primero tendrás que colocarlo en Ajustes de WPForms. Tienes también un tutorial paso a paso para que lo sigas, y poder activar dentro de la sección de ajustes de ese plugins (considerando que estamos en la sección de formulario) para activarlo.

Una vez que esté activado ya podrías poner el captcha.

Añadir formulario de contacto de WordPress

Casilla de verificación

Si así lo deseas, puedes agregar otra casilla, en este caso de verificación, la cual puedes modificar según quieras o necesites.

Podrás colocar alguna interrogante que sea respondida en tres opciones distintas, y además añadir que sea de manera obligatoria la respuesta de ello.

Configuración de contacto en WordPress

Incrustar

Una opción que tenemos en el borde superior derecho es Incrustar un código que tenemos la opción de colocar en cualquier página que desees. Incluso, existen códigos personalizados, aunque este es el más básico.

Configuración de contacto en WordPress

Sección de Ajustes General

En el borde lateral izquierdo tenemos varias opciones, una de ellas es la de Campos, que es la que acabamos de mirar y modificar para rellenar el formulario, pero también tenemos debajo de esta, la sección de Ajustes. En esta, tenemos una serie de opciones para modificar.

Avisos o Notificaciones

Dentro de ajustes, tenemos la sección de avisos, donde incluye la opción de configurar los avisos (y de que forma) quieres que te llegue a tu correo cuando alguien te contacta.

Configuración de contacto en WordPress

Activar confirmación de mail

Efectivamente, luego de haber rellenado el formulario y les hayan dado enviar. Les saldría, al concluir, un mensaje predeterminado de “Mensaje Recibido” o algo similar. Esto lo puedes modificar.

Configuración de contacto en WordPress

De igual manera, podrías también redirigirlo a una página en particular, como a la Home, si así lo quieres. O en caso de que haya algún premio y demás.

Toma en consideración que en el borde superior derecho hay un botón naranja que dice Guardar; es necesario realizarlo de manera eventual para ir guardando los cambios.

Acceder a los formularios e incrustar uno

Si seleccionas en el borde lateral izquierdo, justo debajo de WPForms, en Todos los formularios, ya aparecerá el primer formulario que hemos realizado. A medida que vayas realizando más, es en ese apartado donde estarán todos los que realices.

Todos los Shordcode de los formularios que tengas, estarán ahí. Con esto podrías incrustarlo en cualquier entrada. También aparecen otras opciones de configuración.

En ajustes también cuentas con otras diversas opciones, como de correo, de captcha, de cómo quieres que llegue el correo a ti o a la persona. También tienes Analíticas, para ver quiénes han rellenado los formularios.

Este plugin también te permite llevarlo a otro nivel, conectándolo con otros plugins o aplicaciones externas. Aunque para ello, normalmente, necesitarás la versión de pago.

Configuración de contacto en WordPress

Vídeotutorial de cómo usar WP Contact Forms para WordPress

Para seguir paso a paso otros detalles con mayor profundidad de cómo añadir un formulario de contacto de WordPress, sigue el video tutorial que te dejamos a continuación, donde además te daré algunos tips y consejos extra.

Te puede interesar...

7 Herramientas de Inteligencia Artificial GRATIS

Soy GabiFlorensa y este artículo, te enseñaré 7 herramientas de inteligencia artificial gratuitas que permiten usar funcionalidades muy interesantes. Generar dibujos con inteligencia artificial gratis (Craiyon.com) Es una herramienta que te permite generar dibujos usando una frase o un texto con inteligencia artificial. Para ello, en el buscador colocamos unas

Leer más »

Cómo configurar la sección de Ajustes en WordPress

La sección de ajustes de WordPress es muy importante. Con ella puedes hacer una configuración general de tú página. Por tanto, antes de pasar a configurar cualquier otra cosa en tu web, es importante que primero vayas a este apartado. Pero, la pregunta es ¿Cómo configurar la sección de ajustes

Leer más »