Cómo crear un formulario de WordPress con un selector de fecha

¿Necesitas que la gente elija una fecha cuando rellena un formulario en tu sitio web?

Tal vez quieras saber una buena hora para llamarlos, o tal vez quieras recoger información como la fecha de nacimiento, etc. Ahí es donde un campo selector de fecha puede ayudar.

En este artículo, te mostraremos cómo crear un formulario de WordPress con un selector de fecha

Añadir un selector de fecha a un formulario de WordPress

Crear un formulario de WordPress con un selector de fecha

Para este tutorial, vamos a utilizar el WPForms. Es uno de los mejores plugins de formularios de contacto que existen, y puedes utilizarlo para todo tipo de formularios diferentes.

Tendrás que instalar y activar el WPForms en tu sitio. Si no estás seguro de cómo hacerlo, echa un vistazo a nuestra guía paso a paso sobre cómo instalar un plugin de WordPress.

Una vez que hayas activado el plugin, ve a WPForms " Añadir nuevo en tu panel de control de WordPress.

Crear un nuevo formulario con WPForms

Aparecerá el constructor de WPForms. Primero, escribe un nombre para tu formulario. Luego, pasa el cursor del ratón por encima de una plantilla y haz clic en el botón para seleccionarla. Vamos a utilizar la plantilla Formulario de contacto simple.

Seleccionando la plantilla del Formulario de Contacto Simple para empezar a construir tu formulario

WPForms creará automáticamente un formulario para ti utilizando esa plantilla. Este es el formulario de contacto simple por defecto.

El formulario de contacto por defecto creado por WPForms

Ahora puedes editar el formulario como quieras

Vamos a añadir el campo selector de fecha.

En el constructor de formularios, verás todos los campos que puedes añadir a tu formulario en la columna de la derecha. Desplázate hacia abajo hasta la sección Campos de Fantasía, y verás el campo Fecha / Hora.

El campo Fecha / Hora en la sección Campos de Fantasía

Arrastra y suelta el campo donde lo quieras en tu formulario. Lo hemos colocado justo debajo del campo Correo electrónico en nuestro formulario.

El campo Fecha/Hora añadido al formulario

A continuación, haz clic en el campo para editarlo. Esto hará que aparezca la pestaña "Opciones de campo" en la parte izquierda de tu pantalla

Puedes cambiar la etiqueta del campo, que por defecto es "Fecha / Hora". Vamos a utilizar "Hora preferida para la llamada telefónica" para nuestro campo.

También puedes cambiar el formato del campo utilizando el desplegable Formato. Por ejemplo, es posible que quieras utilizar sólo una fecha y ninguna hora, como en el caso de un campo de fecha de nacimiento.

También puedes marcar la casilla Obligatorio si quieres que sea un campo obligatorio. Esto significa que el usuario tendrá que seleccionar una fecha y una hora antes de poder enviar el formulario.

Editar el campo fecha/hora para cambiar las opciones

También puedes añadir cualquier otro campo nuevo que quieras utilizar. Sólo tienes que hacer clic en la pestaña "Añadir campos" y luego arrastrar y soltar el campo en tu campo. Para editar un campo, simplemente haz clic en él.

Configurar las opciones avanzadas de tu selector de fecha

Por defecto, el selector de fecha de tu formulario será un calendario con un desplegable de hora al lado. El usuario simplemente hace clic en un día para seleccionar esa fecha.

El selector de fecha por defecto (estilo calendario)

El desplegable de la hora tiene por defecto un reloj de 12 horas con intervalos de 30 minutos, así:

El selector de hora por defecto (lista desplegable a intervalos de 30 minutos)

Puede que quieras cambiar el funcionamiento del selector de fechas. Eso es fácil de hacer en WPForms. En la pestaña Opciones de campo, desplázate hasta Opciones avanzadas

A continuación, haz clic en la flecha para abrir esa sección

Ver y cambiar las opciones avanzadas del campo Fecha/Hora

Aquí puedes hacer muchos cambios. Por ejemplo, puede que quieras cambiar el formato de la fecha. El valor por defecto es mm/dd/aaaa.

Seleccionar el formato de fecha en el desplegable Opciones de fecha

También puedes cambiar el selector de fecha por un desplegable de fecha, si lo prefieres. En este caso, el usuario selecciona el mes, el día y el año en cuadros desplegables, así:

El campo desplegable de la fecha en acción en un formulario

También puedes cambiar el selector de hora. Por defecto es un reloj de 12 horas, pero puedes cambiarlo por uno de 24 horas si lo prefieres. También puedes cambiar los intervalos a 15 minutos o 1 hora en lugar de 30 minutos.

Cambiar los intervalos de tiempo de tu selector de fecha

Una vez que estés satisfecho con tu formulario, puedes guardarlo haciendo clic en el botón Guardar de la parte superior derecha.

También puedes configurar tu formulario para que la persona que lo rellene obtenga una copia de los datos que ha enviado.

Esto puede ser útil, por ejemplo, si programan una llamada contigo. Tendrán un registro por correo electrónico de la hora de la llamada que reservaron.

Puedes hacerlo siguiendo las instrucciones de nuestro tutorial sobre la creación de un formulario de contacto con múltiples destinatarios.

Añadir el formulario a tu sitio web

Puedes añadir tu formulario a una página (o entrada) existente en tu sitio, o puedes crear una nueva. Para crear una nueva página, ve a Páginas " Añadir nueva en tu panel de control de WordPress.

A continuación, tendrás que añadir un nuevo bloque a tu página. Haz clic en el (+) para añadir el bloque y luego selecciona el bloque WPForms. Puedes encontrarlo en la sección de Widgets o puedes buscarlo utilizando la barra de búsqueda.

Añadir el bloque WPForms a tu página o entrada

A continuación, tendrás que seleccionar tu formulario en el desplegable de WPForms, así:

Seleccionar el formulario correcto en el desplegable de WPForms

Eso es todo lo que necesitas hacer. Ahora puedes publicar tu página y tu formulario estará activo en tu sitio web. Debería tener un aspecto similar al siguiente:

El formulario de selección de fecha terminado en el sitio web

Nota: El estilo del formulario dependerá del tema de WordPress que estés utilizando

Todos los formularios creados con WPForms son compatibles con los móviles desde el principio y funcionan en cualquier dispositivo móvil. La herramienta de selección de fecha de WPForms también es compatible con los móviles y funciona en todos los tamaños de pantalla

Vista previa móvil del selector de fecha en un formulario de WordPress

Siempre es una buena idea probar tu formulario para asegurarte de que funciona como esperabas. Si no recibes correos electrónicos pero estás seguro de que la configuración de las notificaciones es correcta, nuestro artículo sobre cómo solucionar el problema de que WordPress no envíe correos electrónicos debería ayudarte.

Puedes hacer cambios en tu formulario yendo a WPForms " Todos los formularios. A continuación, sólo tienes que hacer clic en el título de tu formulario o en el enlace Editar que hay debajo del título para editarlo.

Editar un formulario ya creado en WPForms

Una vez que guardes tu formulario, se actualizará en tu sitio web automáticamente.

Esperamos que este artículo te haya ayudado a aprender a crear un formulario de WordPress con un datepicker. Quizás también quieras echar un vistazo a nuestros artículos sobre cómo bloquear el spam de los formularios de contacto en WordPress y cómo rastrear y reducir el abandono de formularios en WordPress.

Si te ha gustado este artículo, suscríbete a nuestro Canal de YouTube para los videotutoriales de WordPress. También puedes encontrarnos en Twitter y Facebook

Si quieres conocer otros artículos parecidos a Cómo crear un formulario de WordPress con un selector de fecha puedes visitar la categoría Plugins.

¡Más Contenido!

Deja un comentario

Tu dirección de correo electrónico no será publicada.

Go up