### [Pasar a la siguiente página automáticamente en formularios de varias páginas](https://wpforms.com/developers/how-to-move-to-the-next-page-automatically/) **Publicado:** 29 de junio de 2022 **Autor:** Umair Majeed **Extracto:** En este tutorial, te mostraremos cómo puedes pasar automáticamente a la siguiente página de tu formulario de varias páginas según la respuesta de un campo del formulario. **Contenido:** ¿Te gustaría que tus formularios de varias páginas avanzaran automáticamente cuando los usuarios hacen selecciones? Con un simple fragmento de código, puedes crear una experiencia de formulario más fluida al pasar automáticamente a la siguiente página cuando los usuarios seleccionan sus respuestas. Esta mejora reduce los clics y hace que tus formularios sean más intuitivos de completar. Esta guía te mostrará cómo avanzar automáticamente tus formularios de varias páginas basándote en las selecciones del usuario. ## Creación de la estructura de tu formulario Primero, necesitarás un formulario de varias páginas con campos y saltos de página. Para este tutorial, estamos creando un formulario de hoja de regalos, habrá tres campos de **Opción múltiple** usando **Opciones de imagen**. Cada selección incluirá un **Salto de página**. Si necesitas ayuda para crear un formulario de varias páginas, consulta nuestra guía sobre [cómo crear formularios de varias páginas](https://wpforms.com/docs/how-to-create-multi-page-forms-in-wpforms/). ## Añadir el CSS de avance automático Dado que queremos que el formulario pase a la siguiente página automáticamente basándose en **cualquier** selección, vamos a añadir CSS para ocultar los botones **Siguiente** en este formulario. Para lograr esto, copia este CSS en tu sitio. ``` form#wpforms-form-1000 button.wpforms-page-button { visibility: hidden; } ``` Recuerda reemplazar `1000` con el ID de tu formulario. Si necesitas ayuda para encontrar el ID de tu formulario, consulta nuestra guía sobre [cómo encontrar IDs de formularios y campos](https://wpforms.com/docs/how-to-use-the-forms-locator-in-wpforms/). ## Añadir el JavaScript de avance automático A continuación, añade este fragmento de código para habilitar el avance automático de página. Si necesitas ayuda para añadir fragmentos de código, consulta nuestro tutorial sobre [cómo añadir fragmentos de código PHP o JavaScript personalizados para WPForms](https://wpforms.com/developers/how-to-add-custom-php-or-javascript-for-wpforms/). **Nota:** Este código se dirige a **Opciones de imagen** usando la clase `.wpforms-image-choices`. Si tu campo utiliza **Opciones de icono**, actualiza el selector en la **línea 12** reemplazando `.wpforms-image-choices` con `.wpforms-icon-choices` para que el script funcione correctamente. El script funciona dirigiéndose a tu formulario específico usando el ID del formulario (reemplaza `1000` con tu ID), escuchando los clics en las entradas de Opciones de imagen y activando automáticamente el clic en el botón **Siguiente** cuando se realiza una selección. ## Opciones de personalización Puedes modificar esta funcionalidad para dirigirte a preguntas específicas ajustando el selector de jQuery, añadir condiciones para cuándo avanzar o redirigir a diferentes páginas según las respuestas. Aquí tienes un ejemplo que avanza solo cuando se selecciona "**Sí**": ``` function wpf_dev_conditional_next_page() { ?> **Categorías:** Extensión **Etiquetas:** Javascript, jQuery, JS, PHP ---