¿Quieres atraer clientes con tu Página Web?

Yo te enseño como puedes lograrlo usando Wordpress y Marketing Digital ¿Te unes?

ben-ramirez

Tutorial Contact Form 7 – Agregar un formulario de contacto en wordpress

Si estás diseñando tu página web con wordpress es muy importante que coloques una página de contacto con un formulario.

El formulario de contacto es la manera en que las personas se pueden poner en contacto contigo para solicitar algunos de tus servicios, o simplemente para hacerte alguna consulta relacionada con tu negocio.

Muchas plantillas ya tienen incluyen una página de contacto con formulario, pero si tu template wordpress no tiene una página de contacto con formulario, necesitas instalarlo tu mismo.

Es muy sencillo, pero si eres novato puede ser complicado, por eso en este artículo te diré cómo agregar un formulario de contacto (o varios) en tu página wordpress pasito a pasito. 😉

 Por qué debes usar el plugin contact form 7

El plugin Contact Form 7 es muy sencillo de instalar y se adapta bien a la mayoría de plantillas wordpress.

Este plugin lo usan muchos sitios reconocidos y les funciona perfecto.

A mí me gusta usar y recomendar plugins sencillos de configurar y que cumplan su tarea.

Así, sin más rollos. 😉

Cómo instalar el plugin Contact Form 7

1 Primero te diriges a la sección de Plugins que está en el menú izquierdo en la administración de tu página wordpress.

2 Entra en la sección de Añadir Nuevo.

3 Coloca el nombre del plugin “Contact Form 7” en la caja de búsquedas de plugins, da click en Instalar Ahora y después en Activar.

Con esto ya tendrás instalado el plugin y es hora de crear un nuevo formulario para después agregarlo donde lo necesites.

Cómo agregar tu primer formulario con el plugin Contact Form 7

1 Primero entra en la sección Contact que está del lado izquierdo del menú de la administración de tu wordpress.

2 Da click en Add New.

3 Coloca un nombre para este formulario.

4 Da click en Save.

5 Para agregar el formulario en tu página de contacto debes copiar el código que te muestra wordpress después de guarda tu formulario.

6 Ve a tu página de contacto y pega este código en el lugar donde quieres que aparezca el formulario.

7 Ahora ve a tu página de contacto para ver el formulario que acabas de crear.

Ahora ya tienes tu formulario instalado pero hace falta algo más, debes personalizar los campos de este formulario.

Cómo personalizar los campos de un formulario Contact Form 7

Para comenzar a personalizar tu formulario vuelve a la administración de wordpress y selecciona el formulario que quieres modificar.

Te recuerdo que puedes crear varios formularios con diferentes campos y colocarlos en tu página web donde los necesites.

Una vez seleccionado, en la pestaña de Form podrás ver el código del formulario.

Puedes cambiar los textos para que digan lo que tu quieras.

Da click en guardar o Save y listo, al refrescar tu página de contacto los cambios se verán reflejados.

Cómo poner campos obligatorios

Para poner un campo como obligatorio debes agregar un asterisco enfrente del campo que quieres marcar como obligatorio.

Esto es en el campo que está dentro de las llaves.

Cómo poner textos “placeholder” en formulario Contact Form 7

Una personalización que me gusta hacer es el placeholder.

Esto es quitar los textos del formulario y que solo aparezcan las cajas del formulario.

Si quieres hacer esto solo debes agregar la palabra “placeholder” como indica la imagen.

Si quieres dejar solamente las cajas de tu formulario borra los texto y las etiquetas que dicen “label”.

Guarda y refresca tu página de contacto para ver el resultado.

Ahora debes configurar el envío del mensaje

Ahora ya tienes tu formulario personalizado, lo único que hace falta es configurar el envió del mensaje.

Para esto debes entrar en la pestaña Mail en el formulario que quieras configurar.

Ahí vas a ver algunos campos que están entre llaves [así…].

Esos son campos dinámicos, es decir que van a cambiar de acuerdo a la información que las personas coloquen en el formulario.

Cuidado con lo que cambias

Aquí debes tener cuidado, te recomiendo que no cambies mucho porque si algo no está bien configurado los mensajes de tu formulario no llegarán a tu mail.

Puedes cambiar los textos y ponerlos español como tu gustes, pero ten cuidado en estos campos dinámicos.

Guarda y manda un mensaje de prueba

Cuando termines da click en Save para guardar los cambios.

Finalmente configura la pestaña de “messages

Hay una tercera pestaña llamada Messages donde vas se indican los mensajes automáticos que mostrará tu formulario.

Por ejemplo cuando no han colocado un campo que es obligatorio o cuando han colocado un correo electrónico no válido etc.

Si te aparece en inglés como a mí, hay que cambiar estos textos

En teoría estos campos deberían estar en español pero si por alguna razón están en inglés debes colocar los textos en español.

Aquí te dejo la lista de textos en español.

Thank you for your message. It has been sent.Gracias por tu mensaje. Ha sido enviado.
There was an error trying to send your message. Please try again later.Hubo un error intentando enviar tu mensaje. Por favor inténtalo de nuevo más tarde.
One or more fields have an error. Please check and try again.Uno o más campos tienen un error. Por favor revisa e inténtalo de nuevo.
There was an error trying to send your message. Please try again later.Hubo un error intentando enviar tu mensaje. Por favor inténtalo de nuevo más tarde.
You must accept the terms and conditions before sending your message.Debes aceptar los términos y condiciones antes de enviar tu mensaje.
The field is required.El campo es obligatorio.
The field is too long.El campo es muy largo.
The field is too short.El campo es muy corto.
The date format is incorrect.La fecha es incorrecta.
The date is before the earliest one allowed.La fecha es posterior a la más tardía permitida.
The date is after the latest one allowed.La fecha es posterior a la más tardía permitida.
There was an unknown error uploading the file.Se produjo un error desconocido al cargar el archivo.
You are not allowed to upload files of this type.Hubo un error desconocido subiendo el archivo.
The file is too big.El archivo es demasiado grande.
There was an error uploading the file.Se ha producido un error subiendo la imagen
The number format is invalid.El formato de número no es válido.
The number is smaller than the minimum allowed.El número es menor que el mínimo permitido.
The number is larger than the maximum allowed.El número es mayor que el máximo permitido.
The answer to the quiz is incorrect.La respuesta al cuestionario no es correcta.
The e-mail address entered is invalid.La dirección de correo electrónico que has introducido no es válida.
The URL is invalid.La URL no es válida.
The telephone number is invalid.El número de teléfono no es válido.

¿Pudiste instalar tu primer formulario de contacto?

Cuéntame si lograste configurar tu primer formulario de contacto o si tuviste algún problema.

Si algo sale mal y tu formulario no funciona puedes borrarlo y comenzar de nuevo, al principio todo es más complicado.

Verás que en poco tiempo será más sencillo.

No olvides que puedes agregar distintos formularios de acuerdo con tus necesidades.

Ya no hay excusa para estar incomunicado con tus visitantes, solo agrega un formulario y prepárate para recibir los mensajes de tu audiencia. 😉

 

 

5 (100%) 1 vote
The following two tabs change content below.

Acerca del autor de este artículo Ben Ramírez

Soy Ben Ramírez, diseñador web. Ayudo a dueños de negocios a conseguir nuevos clientes usando Wordpress y marketing digital. Si quieres transformar tu Página Web en una poderosa herramienta para captar clientes te invito a unirte a mi comunidad y comenzar ahora mismo.
ben-ramirez-caja-min-10

¿Te vas a perder un curso GRATIS?

Únete a cientos de dueños de negocios y recibe GRATIS:

  • Acceso al curso “Cómo Atraer Más Clientes y tener Más Ventas con una Página Web”.
  • Contenidos en tu e-mail para ayudarte a crecer tu negocio usando internet.

Deja un comentario