Cómo poner un formulario en mi web o WordPress
[frame]
[/frame]
Poner un formulario en mi web o WordPress puede ser una tarea muy sencilla, o muy complicada dependiendo de nuestras necesidades y el método que utilicemos.
Los formularios sirven para recoger información de los usuarios que nos visitan. Su utilidad es muy diversa, abarcando desde un simple formulario de contacto, hasta encuestas o incluso una petición de presupuesto. En realidad su uso es tan amplio como seamos capaces de imaginar.
Si necesitamos dar una respuesta inmediata, basada en los datos que nos aporta el formulario, como por ejemplo cuando buscamos el horario de un determinado tren, o cuando pedimos cita en el médico, entonces estamos hablando de una aplicación. Estos son los casos más complicados debido a que necesitamos enlazar con una base de datos en el servidor, lo cual supone necesariamente una programación a medida.
No obstante lo más habitual es que necesitemos simplemente recibir los datos en una dirección de correo eletrónico. Este es el caso más sencillo y para ayudarnos existen diversos plugins en WordPress que nos lo ponen realmente fácil:
Si utilizas la popular suite de plugins JetPack ya lo tienes resuelto. Este plugin coloca un botón de “Añadir formulario de contacto” directamente sobre el editor de texto de WordPress. Diseñar y colocar el formulario es tan fácil como rellenar unos pocos datos y listo. La siguiente imagen te dará una idea de se sencillez:
[frame]
[/frame]
Si necesitas algo más personalizable y sabes algo de HTML, el plugin Contact Form 7 es probablemente la mejor elección.Te permite confeccionar formularios de diverso tipo con campos personalizados que después insertas mediante un sencillo shortcode en tu post o página.
[message type=”info”]
Pero, ¿qué sucede si no utilizo WordPress o si necesito procesar los datos que recibo desde los formularios?.
[/message]
En este caso mi solución favorita pasa por utilizar los formularios de Google Drive. Si conoces Google Apps (ahora integradas en Google Drive), sabrás que esta suite ofimática basada en la nube te permite crear documentos de texto, hojas de cálculo, presentaciones… pero probablemente no sabrás que también sirve para diseñar formularios que puedes posteriormente incluir en tu propia página web, ya sea ésta WordPress o no.
Para utilizarlos necesitarás tener una cuenta de Google y acceder a Google Drive. Si no sabes de qué se trata, es un disco virtual en la nube donde puedes almacenar todo tipo de archivos, pero con la particularidad de que muchos de ellos puedes editarlos directamente en el navegador web, como una especie de Office pero online.
Una vez dentro, utiliza el botón “Crear” y después “Formulario“.
[frame]
[/frame]
Inmediatamente te pedirá que selecciones uno de los temas o diseños disponibles, siendo el predeterminado la mejor elección en la mayoría de los casos. Acto seguido se presentará ante ti un formulario donde poder empezar a introducir las preguntas que conformarán tu formulario. Cada pregunta que añadas tendrás la opción de elegir entre diversos tipos de respuesta (texto en una línea, texto en un párrafo, elegir valores de una lista, una fecha…). Incluso puedes dividir el formulario en secciones y páginas. Incluyendo imágenes y hasta vídeos donde estimes oportuno. Muy útil en caso de tener que recoger mucha información o de tener que dar explicaciones extensas sobre cómo cumplimentar adecuadamente la información. De este modo irás configurando tu formulario hasta tenerlo completado.
[frame]
[/frame]
Finalmente tenemos un serie de opciones entre las que elegir una vez que el usuario ha rellenado el formulario. La primera y obligada es un mensaje de confirmación. Las demás son opcionales y permiten rellenar de nuevo el formulario, editar la información o bien ver las respuestas enviadas por otros usuarios (estadísticas).
[frame]
[/frame]
Cuando hayamos terminado pulsamos en “Enviar Formulario” y se nos facilitará automáticamente un enlace para compartirlo. Es en este momento cuando, si nos fijamos, en un botón a la derecha aparece la opción “Incrustar“. Es ahí donde el obtendremos el código HTML para copiar en nuestra web. Si utilizas WordPress no ovides hacerlo desde la pestaña “Texto” del editor.
Pero, ¿dónde van a parar los datos que se generan al rellenar el formulario que hemos creado?. Esto es lo mejor de todo; Google los recoge en una hoja de cálculo que guarda en Google Drive. Así podemos posteriormente tratar los datos, exportarlos a Excel o incluso a una base de datos. Podemos además recibir un email con cada nuevo formulario enviado, de modo que estemos permanentemente informados de si se ha enviado nueva información.
¿Quieres ver un formulario de Google en funcionamiento?. Echa un vistazo a nuestro formulario para pedir presupuesto y podrás hacerte una idea de lo que finalmente obtendrás.
Y tu, ¿conoces algún otro sistema interesante para incluir formularios en un sitio web?. Si es así o si quieres comentarnos cuialquier cosa al respecto, te invitamos como siempre a utilizar el hilo de comentarios. Muchas gracias.
Ana Belén Leíño
Super útil, como todos tus post!
Luis Hernández
Super amable, como todos tus comentarios 😉
Miguel Ángel Lucas (@miguelangelddl)
Perfecto, otra herramienta que vendrá de perlas para potenciar nuestro blog y prepararlo para darle mucha vidilla.
Muchas gracias.
Luis Hernández
¡Eso es Miguel Ángel!, todas las herramientas son pocas para conseguir más y mejor cada día. Gracias a ti por tu comentario.
Antonio Villa
Como siempre, estupendo y super claro. Es un placer enorme teneros de vuelta. ¡Cómo se os echaba de menos! 😀
Luis Hernández
¡Gracias Antonio!.Nosotros también estábamos deseando volver a estar en familia.
Rocio Lopez Perez (@RocioLopezPerez)
Muy muy práctico. Muchas gracias.
Luis Hernández
¡Gracias Rocio!, eso es lo que más me motiva. Bienvenida al blog de SinLios. 🙂
Daniel Bastida
Yo recomiendo Gravity Forms. Contact 7 lo he usado durante mucho tiempo. Pero tiene muchas limitaciones. GF no exige tanto uso de código.
Un saludo!
José Xavier
¡Hola, Luis!
Tengo una duda, a ver si me puedes ayudar.
Me gustaría poner en mi blog una actividad para mis alumnos que tenga la opción de respuestas al lado y al mismo tiempo que tenga un botón donde puedan comprobar sus respuestas. ¿Crees que es posible? Yo lo vi ya en otros blogs pero no sé como se hace.
Si conoces algún plugin para eso te lo agradezco.
Un saludo.
José
Luis Hernández
Hola José. Existen muchas soluciones para realizar test y exámenes en WordPress, la mayoría mediante plugins.
Personalmente uno de los que más me gusta es WP Pro Quiz, es muy versátil y puedes configurarlo para realizar casi cualquier tipo de sistema de preguntas y respuestas:
http://wordpress.org/plugins/wp-pro-quiz/
AdminA
Gracias!….me sirvió mucho!.
María José Rodríguez Bustamante
Luis, muy útil este post. Lo he utilizado para crear un formulario de contacto con Google Drive y queda fenomenal y es muy sencillo. Eso si hay una duda que me ha surgido ¿Cómo puedo además recibir un e-mail con cada nuevo formulario enviado?. He creado una hoja de calculo para ir guardando todas las respuestas del formulario, pero no consigo ver donde marcar para que me avise a mi correo cuando recibo una formulario.
Si me puedes echar un cable te lo agradecería
Un saludo
María José
Luis Hernández
Hola María José, me alegro de que te haya resultado útil.
Efectivamente la notificación por email está un poco escondida. Desde la hoja de cálculo que recoge los datos de tu formulario, debes ir al menú Herramientas -> Reglas de notificación. Ahí será donde puedas definir cuando quieres ser notificada por correo electrónico.
Un abrazo y no olvides suscribirte al blog 😉
María José Rodríguez Bustamante
Muchas gracias por tu rápida respuesta. Ya lo he probado y va perfecto… 🙂 Por supuesto que seguiré el blog.
Un saludo
María José
andresrivassantos
Muy buen post. Estaba buscando posibles soluciones para publicar tests de preevaluación en una página educativa y me parece que la opción de Google Drive va a ser ideal. ¡Muchas gracias!
Luis Hernández
Gracias a ti Andrés por el comentario.
Me alegro mucho de que te sea útil.
estherruizwebsoc
Y como se pueden derivar los formularios a un gestor de correo electrónico?
Jesse
Buenas hay una opción o posibilidad de quitar la publicidad de Google y/o quitar la marca que dice: ” Este formulario se ha creado en “nombre empresa o grupo” y con la tecnología de google” Gracias.!!
Luis Hernández
Hola Jesse, me temo que no.
Lo único que s epuede intentar es reducir el tamaño del IFRAME que hace de contenedor del formulario de Google, editandolo en el código que nos facilitan para embeberlo.
Pero la marca de Google es el pequeño precio a pagar por hacer uso de este servicio gratuitamente.
Un saludo!
Hector
Hola, Luis! Como estás?
A parte del Contact Form 7, estoy usando Typeform. Lo pueden ver en el footer de mi página http://pixdisegni.com/ Hay un botón que dice “Mira esto! Necesitas una web?”; denle un vistazo ahí y podrán ver un ejemplo.
Pueden crear formularios, encuestas, concursos, landig pages, etc. Es muy fácil y atractivo. Espero que les sirva.
Saludos a todos!
Luis Hernández
Genial Héctor!!
Muchas gracias por tu aportación 🙂
boomerangz
Excelentes tus articulos, te pregunto, este blog lo tenes con WP?, que theme usas? que me gusta mucho!
Luis Hernández
Muchas gracias :-), si que está realizado en WordPress.
Para saber que tema se está utilizando en este y otros sitios web te recomiendo esta herramienta online:
http://whatwpthemeisthat.com/
En nuestro caso, es un versión personalizada del tema Flare
Un saludo!
Ricardo Cuauro
Muchísimas gracias amigo! Solo tengo una pregunta, existe alguna manera de quitar los créditos de Google? Los que aparecen en el footer del formulario.
Luis Hernández
Hola Ricardo.
Esta pregunta está respondida un poco más arriba en el hilo de comentarios.
La respuesta corta: No.
Saludos!
Patty
Hola, encontre tu Blog y me resulto de mucha interesante, Ahora me atreveria ha hacerte otra consulta. He creado unas formas personalizadas en MS Word y necesito pasarlas a mi website pero estas formas tienen unos formatos que necesito manter. Me podrias recomedar la manera de hacerlo o un programa que me facilite esta tarea? Mil Gracias, Patty
Luis Hernández
Hola Patty, me temo que no entiendo muy bien tu pregunta. La forma más sencilla de trsladar cualquier elemento gráfico es bien exportarlo a formato JPG o realizar una captura de pantalla y guardarlo en ese mismo formato o cualquier otro compatible con web.
Espero haberte sido de ayuda.
Un saludo!!
jorgemlozano
Está bien, pero considera que, si utilizas la versión gratuita de Google Drive, no tienes garantizada la confidencialidad de los datos (está en la letra pequeña) y si, como es habitual, solicitas datos personales, incumplirás la LOPD
Colectivo Cambalache
Gracias por el tutorial me ha servido de mucho
Luis Hernández
Me alegro 🙂
Gracias por el comentario!
Qué cosa es vivir?
hola luis, si me pudieses ayudar pues tengo una duda:
como procesar mis propios formularios del plugins?
Luis Hernández
Hola!. Tu pregunta es un poco confusa. Necesitaría saber exáctamente a que te refieres con “procesar”. Saludos!
Carol
Hola Luís, gracias por tu post, espero que me puedas ayudar. Puedo poner un formulario creado por mi en Excel con macros en WordPress, lo que necesito es crear el formulario, que según se rellene pasen los datos a la propia macro creada y que pueda imprimir. Hay algún plugins que permita hacer esto o lo tengo que programar. Espero haberme explicado. Muchas gracias
Luis Hernández
Hola Carol, gracias a ti por pasarte por aquí.
Me temo que lo que quieres no es posible. En un servidor web las cosas funcionan de manera muy diferente y las aplicaciones se programan en lenguajes específicos como PHP, Ruby, NodeJS… Entre los servicios que ofrecemos aquí en SinLios, se encuentra precisamente el de adaptar aplicaciones de escritorio como la que mencionas al entorno online.
Si necesitas nuestro apoyo profesional, no tienes más que utilizar el formulario de contacto y enseguida nos pondremos en contacto contigo.
Un saludo!
Carol
Gracias Luis