[{"@context":"http:\/\/schema.org\/","@type":"BlogPosting","@id":"https:\/\/ayudaleyprotecciondatos.es\/2018\/11\/22\/configurar-formularios-wordpress\/#BlogPosting","mainEntityOfPage":"https:\/\/ayudaleyprotecciondatos.es\/2018\/11\/22\/configurar-formularios-wordpress\/","headline":"C\u00f3mo configurar formularios de contacto en WordPress","name":"C\u00f3mo configurar formularios de contacto en WordPress","description":"Te ense\u00f1aremos todos los pasos para crear y configurar formularios de contacto en WordPress y c\u00f3mo funciona el plugin Contact Form 7. \u00a1Entra ahora!","datePublished":"2018-11-22","dateModified":"2020-04-29","author":{"@type":"Person","@id":"https:\/\/ayudaleyprotecciondatos.es\/author\/agonzar34\/#Person","name":"Ana Gonz\u00e1lez","url":"https:\/\/ayudaleyprotecciondatos.es\/author\/agonzar34\/","image":{"@type":"ImageObject","@id":"https:\/\/secure.gravatar.com\/avatar\/9d20ce04c893956aaa747aa424b64675?s=96&d=blank&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/9d20ce04c893956aaa747aa424b64675?s=96&d=blank&r=g","height":96,"width":96}},"publisher":{"@type":"Organization","name":"AyudaLeyProteccionDatos","logo":{"@type":"ImageObject","@id":"https:\/\/ayudaleyprotecciondatos.es\/wp-content\/uploads\/2016\/01\/ayuda-ley-proteccion-datos.png","url":"https:\/\/ayudaleyprotecciondatos.es\/wp-content\/uploads\/2016\/01\/ayuda-ley-proteccion-datos.png","width":600,"height":60}},"image":{"@type":"ImageObject","@id":"https:\/\/ayudaleyprotecciondatos.es\/wp-content\/uploads\/2016\/01\/ayuda-ley-proteccion-datos.png","url":"https:\/\/ayudaleyprotecciondatos.es\/wp-content\/uploads\/2016\/01\/ayuda-ley-proteccion-datos.png","width":100,"height":100},"url":"https:\/\/ayudaleyprotecciondatos.es\/2018\/11\/22\/configurar-formularios-wordpress\/","about":["INTERNET","LSSI"],"wordCount":1554,"articleBody":" if (typeof BingeIframeRan === \"undefined\") { window.addEventListener(\"message\", receiveMessage, false); function receiveMessage(event) { try { var parsed = JSON.parse(event.data) if (parsed.context === \"iframe.resize\") { var iframes = document.getElementsByClassName(\"binge-iframe\"); for (let i = 0; i < iframes.length; ++i) { if (iframes[i].src == parsed.src || iframes[i].contentWindow === event.source) { iframes[i].height = parsed.height; } iframes[i].style.opacity = 1; } } } catch (error) { } } var BingeIframeRan = true; } Los formularios de contacto son una pieza esencial de la mayor\u00eda de los sitios web, ya que es la principal forma que tienen los visitantes de comunicarse con el propietario de la web.En WordPress puedes crear tus propios formularios con relativa facilidad usando los plugins adecuados.Incluso con ellos puedes crear una gran variedad de p\u00e1ginas: desde simples formularios de contacto, hasta calendarios de citas y reservas para tu propio negocio.Y en este post te explico c\u00f3mo.\u00bfPor qu\u00e9 los formularios son importantes?\u00bfC\u00f3mo crear formularios en WordPress?Plugin Contact Form 7\u00bfC\u00f3mo funciona?Crear un formularioConfigurar las opcionesIntegraci\u00f3n con reCAPTCHAInsertar el formularioOtros plugins para Contact Form 7\u00bfPor qu\u00e9 los formularios son importantes?Los formularios son, tarde o temprano, necesarios en todo sitio web. Es la \u00fanica forma posible de enviar informaci\u00f3n estructurada y almacenarla correctamente en una p\u00e1gina web.Tener algo tan sencillo como un formulario de contacto es necesario,\u00a0seas una peque\u00f1a empresa o una tienda online.\u00a0 As\u00ed podr\u00e1s recibir mensajes y comunicaciones de tus visitantes.Tambi\u00e9n podr\u00edas publicar tu direcci\u00f3n de correo y prescindir de formularios, pero eso s\u00f3lo originar\u00eda que recibieras una gran cantidad de spam en tu bandeja de entrada.La ventaja principal de los formularios web es que te ofrecen la posibilidad de procesar toda la informaci\u00f3n introducida en ellos, y usarla de una u otra forma dependiendo de tus necesidades.Por ejemplo, puede ser interesante almacenar todas las direcciones de correo de tus solicitudes de contacto en una base de datos. De esa forma sabr\u00e1s qui\u00e9nes te han estado contactando y enviarles alguna oferta.\u00bfC\u00f3mo crear formularios en WordPress?Al instalar WordPress te dar\u00e1s cuenta de que ya viene con algunos formularios espec\u00edficos.Por ejemplo, el buscador nativo que puedes incluir usando el widget correspondiente, y con el que puedes realizar b\u00fasquedas avanzadas del contenido de tu web.Pero si quieres crear formularios personalizados y usarlos para una actividad en particular, necesitar\u00e1s utilizar alg\u00fan plugin para ello.Hay gran cantidad de plugins que puedes utilizar para crear formularios de contacto y realizar una gran cantidad de tareas diferentes. Pero te recomiendo elegir uno de los m\u00e1s populares que existen: Contact Form 7.Plugin Contact Form 7Es un plugin gratuito, con una enorme cantidad de descargas y un uso muy activo.Es muy sencillo de usar si est\u00e1s empezando y te permite probar nuevas formas de recoger datos desde tu p\u00e1gina web. Adem\u00e1s, en su web oficial puedes acceder a una documentaci\u00f3n (en ingl\u00e9s) bastante completa.Con este plugin puedes crear formularios sencillos, mediante los cuales puedes recibir la informaci\u00f3n que tus visitantes puedan introducir.Este plugin no sirve solo para crear formularios de contacto, sino que adem\u00e1s puedes emplearlo para otros usos:Formularios de registroConsultas de citasSolicitudes de presupuestoBotones \u00abLl\u00e1mame\u00bbAdem\u00e1s, podr\u00e1s encontrar algunos plugins adicionales que complementan la funcionalidad de Contact Form 7 en el repositorio oficial de WordPress.\u00bfC\u00f3mo funciona?La manera de trabajar con Contact Form 7 es bastante sencilla.Una vez instalado el plugin, ver\u00e1s que aparece una nueva secci\u00f3n en tu panel de administraci\u00f3n denominada Contacto. En esta secci\u00f3n puedes generar todos los formularios que desees, cada uno con sus correspondientes campos y textos de respuesta.Una vez creados los formularios, podr\u00e1s insertarlos con un shortcode que el plugin te ofrece, bas\u00e1ndose en una ID \u00fanica para cada uno.Al igual que el resto, este shortcode puedes a\u00f1adirlo en cualquier lugar de tu sitio WordPress:al contenido de tus p\u00e1ginas,como un widget de texto, oen alg\u00fan area especial si el tema WordPress que utilizas lo permite.Siempre que un usuario rellene tu formulario, sus datos se enviar\u00e1n en un email a la direcci\u00f3n que indiques, y con el formato que quieras. Y as\u00ed te enviar\u00e1n notificaciones cada vez que alguien quiera contactar contigo.Crear un formularioMediante Contact Form 7 puedes usar una extensa caja de texto para crear el formulario a mano.Con esto, el plugin es muy flexible ya que se convierte en un lienzo en blanco. Pero,\u00a0si no tienes conocimientos de HTML o alg\u00fan lenguaje parecido, puede ser un poco complejo de usar.A la derecha de la caja de texto tiene un generador de campos que te facilitar\u00e1 mucho las cosas.Los formularios en Contact form 7 se generan combinando una serie de etiquetas propias del plugin, que sirven para incluir los distintos campos del formulario y establecer los valores que deben tener.La construcci\u00f3n de estas etiquetas ser\u00eda la siguiente:[text* campo-nombre 30\/50 \u201cIntroduce Tu Nombre\u201d]Ese c\u00f3digo establecer\u00e1 un campo de texto con los siguientes valores:text: Se\u00f1ala que se trata de un campo de texto.Asterisco (*): Se refiere a que el campo es obligatorio y no puede estar vac\u00edo.campo-nombre: Alude al nombre de referencia del campo, y tiene que ser \u00fanico.30\/50: Muestra el tama\u00f1o del campo (30), y el n\u00famero de caracteres m\u00e1ximo (50).\u201cIntroduce Tu Nombre\u201d: Alude al texto que va a mostrarse cuando el campo est\u00e1 vac\u00edo.Esta sintaxis para generar los campos puede resultar algo complicada, pero tiene muchas opciones para abarcar todos los casos de uso posibles.Puede utilizarse un campo m\u00e1s simplificado ya que la mayor\u00eda de esos atributos es opcional. Ser\u00eda:[text* campo-nombre]A que ahora no es tan complicado?Con este plugin no s\u00f3lo puedes crear campos de texto, tambi\u00e9n tienes opci\u00f3n de insertar todo tipo de elementos a tu formulario:listas desplegables,casillas,subida de archivos,campos de fecha, y muchos m\u00e1s.Muchos de estos campos tienen su forma particular de ser configurados debido a su naturaleza.Configurar las opcionesCuando ya tienes creado tu formulario, puedes configurar los mensajes de aviso\/error y el email que Contact Form 7 te enviar\u00e1.En el cuerpo del correo tienes que poner cada uno de los campos que has incluido en el propio formulario.Con esto podr\u00e1s organizar el correo como quieras, y tambi\u00e9n enviarlo a tantos destinatarios como desees.Integraci\u00f3n con reCAPTCHAUn componente de seguridad que es importante a\u00f1adir a nuestro formulario es el Captcha. Consiste en un c\u00f3digo de letras y n\u00fameros para evitar que los robots spammers llenen tu bandeja de entrada de correos basura.El mejor para nosotros, es ReCaptcha, de Google. Con este m\u00e9todo, nos aparece un campo para pinchar si somos humanos.Para incorporarlo con Contact Form 7 tenemos que registrarnos en la web del servicio reCAPTCHA y damos de alta un nuevo sitio y dominio.Obtendremos dos datos,Clave del Sitio yClave Secreta.Introducimos estas claves en \u201cContacto \/ Integraci\u00f3n\u201d dentro del men\u00fa del panel de administraci\u00f3n de WordPress.Una vez hecho esto, ya puedes incluir tu reCAPTCHA desde los campos de formulario.Insertar el formularioUna vez creado tu formulario, ahora s\u00f3lo te queda a\u00f1adirlo a tu sitio web. Tanto en la lista de formularios como en la pantalla de edici\u00f3n, ver\u00e1s que Contact Form 7 te facilita en todo momento un shortcode para insertarlo, con el siguiente aspecto:[contact-form-7 404 \"Not Found\"]Normalmente, ser\u00e1 suficiente copiar y pegar este c\u00f3digo en cualquiera de tus p\u00e1ginas o entradas. Podr\u00e1s ver c\u00f3mo aparece el formulario en mitad de tu contenido al cargarla.Otros plugins para Contact Form 7Finalmente, es importante tambi\u00e9n mencionar que adem\u00e1s de todas las opciones que el propio Contact Form 7 tiene por defecto, es posible ampliarlas utilizando diferentes extensiones.Aqu\u00ed tienes las m\u00e1s interesantes:CF7 Customizer: para personalizar aun m\u00e1s el aspecto de nuestro formularioSuccess Page Redirects: Una vez enviado el formulario, remitir\u00e1 a nuestro usuario a una p\u00e1gina externa.WooCommerce Orders: Tu formulario podr\u00e1 generar pedidos en WooCommerceMailchimp Extension: Se enviar\u00e1n los emails al servicio de de Mailchimp.\u00bfY t\u00fa? \u00bfC\u00f3mo creas tus formularios de contacto para tu sitio WordPress? Espero tus comentarios."},{"@context":"http:\/\/schema.org\/","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"item":{"@id":"https:\/\/ayudaleyprotecciondatos.es\/#breadcrumbitem","name":"Ayuda Ley Protecci\u00f3n Datos"}},{"@type":"ListItem","position":2,"item":{"@id":"https:\/\/ayudaleyprotecciondatos.es\/2018\/11\/22\/configurar-formularios-wordpress\/#breadcrumbitem","name":"C\u00f3mo configurar formularios de contacto en WordPress"}}]}]