Jetpack bloque Formulario
Crea y comparte formularios para recopilar contactos, comentarios, pagos y mucho más con la potencia de Jetpack Forms.
Jetpack Blocks require the Block Editor (also referred to as the Gutenberg editor). If you’ve installed the Classic Editor plugin, you have a few options:
- Deactivate the Classic Editor: Go to Plugins → Installed Plugins in your WP Admin and deactivate the Classic Editor plugin.
- Enable both editors: If you prefer flexibility, navigate to Settings → Writing in your WP Admin (not the menu under Jetpack settings). Set Allow users to switch editors to Yes. You will only see these options if you have the Classic Editor plugin installed and active.
Some custom themes or plugins may prevent you from using the Block Editor. In that case, please contact the support team for the plugin or theme for further assistance.
For more details, see Using Blocks and the Classic Editor.
La función Formulario de Jetpack está activada de forma predeterminada. Si alguna vez lo necesitas, puedes desactivar Jetpack Forms siguiendo estos pasos.
Si utilizas el Editor clásico, consulta Formulario de contacto (Editor clásico).
Añadir un formulario de Jetpack
El bloque Formulario está disponible en todos los sitios conectados a Jetpack y es gratuito. Para añadir un formulario a cualquier entrada o página, sigue estos pasos:
- Escribe
/formen el editor o selecciona el Formulario en el insertador de bloques. - Elige un patrón de formulario prediseñado para empezar rápidamente (consulta la información siguiente) o empieza con un formulario en blanco.
- Personaliza los campos del formulario para adaptarlos a tus necesidades: elimina, añade o reordena los campos mediante la barra de herramientas de cada campo.
- Haz que los campos sean obligatorios u opcionales activando o desactivando el ajuste *.
- Para personalizar el botón Enviar, haz clic en él y sustituye el texto directamente.
Uso del editor de formularios de Jetpack
También puedes crear y gestionar formularios mediante el Jetpack editor de formularios, una interfaz independiente del editor de bloques. Te permite crear, organizar y publicar formularios directamente desde el panel de administración de WordPress en Jetpack → Formularios.
Guía de bienvenida del editor de formularios
La primera vez que abras el editor de formularios, una guía de cinco pasos te mostrará el proceso de creación de formularios: añadir campos, editar la etiqueta y los ajustes de un campo, elegir qué ocurre después de que alguien envíe el formulario, y publicar y compartir el formulario terminado.
Para volver a ver la guía en cualquier momento, haz clic en el icono de opciones (⋮), situado en la esquina superior derecha del editor de formularios, y selecciona Guía de bienvenida.
La guía se abre la primera vez que visitas el editor de formularios. No se abre si ya has utilizado antes el editor de bloques y ya tienes un formulario propio. Tampoco se abre cuando accedes a un formulario haciendo clic en Editar formulario desde un formulario de una entrada o página, sino únicamente cuando abres el editor de formularios directamente desde Jetpack → Forms.
Usa patrones de formulario para empezar rápidamente
Jetpack Forms incluye varios patrones de formulario prediseñados, es decir, diseños listos para insertar y personalizar. Usar un patrón es la forma más rápida de crear un formulario funcional sin tener que crearlo desde cero.
Patrones de formulario disponibles
Los siguientes patrones de formulario están incluidos en Jetpack:
- Formulario de contacto: un formulario de contacto de uso general para que los visitantes puedan ponerse en contacto contigo.
- Formulario de confirmación de asistencia: recopila respuestas y datos de asistencia a eventos.
- Formulario de registro: recopila información de registro de nuevos usuarios o asistentes.
- Formulario de cita: permite a los visitantes solicitar o programar citas.
- Formulario de comentarios: recopila opiniones, reseñas o sugerencias.
- Formulario de varios pasos: divide un formulario largo en varios pasos que los visitantes completan en pantallas separadas, con una barra de progreso y botones Siguiente y Anterior. El patrón comienza con tres pasos que puedes editar, ampliar o eliminar.
- Formulario de captación de contactos: recopila información de posibles clientes para realizar un seguimiento.
Cómo insertar un patrón de formulario
Puedes acceder a los patrones de formulario de dos maneras:
- Desde el insertador de bloques: escribe
/formen el editor. Aparecerá una lista de patrones de formulario disponibles; después, selecciona el que mejor se adapte a tus necesidades. - Desde la pantalla de configuración del formulario: cuando añadas un bloque Formulario nuevo, Jetpack mostrará un selector de patrones con todos los diseños disponibles. Haz clic en cualquier patrón para insertarlo al instante.
Una vez insertado, cada parte del patrón se puede editar por completo: puedes añadir, eliminar o reorganizar campos, cambiar las etiquetas y ajustar la configuración para adaptarlos a tu caso de uso.
Campos de formulario disponibles dentro del bloque Formulario de Jetpack
El bloque Formulario incluye varios bloques que añaden campos al formulario. Entre los campos de formulario disponibles se incluyen:
- Campo HTML personalizado: Permite a los propietarios del sitio insertar HTML personalizado en el formulario. Puede utilizarse para añadir formato personalizado, contenido incrustado u otros elementos de formulario que no están disponibles de forma nativa.
- Selector de fecha: permite a los usuarios elegir una fecha en un calendario, lo que resulta útil para programar citas. El formato de fecha esperado aparece debajo del campo de entrada.
- Campo desplegable: muestra una lista de opciones en un menú desplegable, útil para recopilar respuestas estructuradas con varias opciones.
- Campo de correo electrónico: recopila el correo electrónico del usuario. Requiere que los usuarios introduzcan una dirección de correo electrónico válida, por lo que resulta útil para responder a consultas.
- Bloque de carga de archivos: permite a los usuarios cargar archivos junto con sus respuestas al formulario.
- Campo oculto: almacena información adicional que se envía con el envío, pero que no es visible para el usuario. Puede ayudar a hacer un seguimiento del origen de los envíos o a pasar datos para integraciones y automatizaciones.
- Campo de texto multilínea: proporciona un área de texto de varias líneas para mensajes o descripciones más largos.
- Opción múltiple (casillas de verificación): permite a los usuarios seleccionar una o varias opciones.
- Campo de nombre: recopila el nombre del visitante y aparece como un campo de texto de una sola línea.
- Campo de entrada numérica: proporciona un campo de una sola línea para valores numéricos.
- Campo de número de teléfono: recopila números de teléfono para la comunicación directa. Los campos de teléfono de las respuestas de los formularios son interactivos e incluyen un selector de código de país. En los dispositivos compatibles, esto permite iniciar una llamada o abrir directamente la aplicación de teléfono predeterminada.
- Campo de valoración (estrellas o corazones): permite a los clientes dejar valoraciones como parte de los envíos del formulario, por ejemplo, al reseñar productos o servicios.
- Opción única (botones de radio): permite a los usuarios seleccionar una opción de una lista predefinida. También puedes incluir una opción opcional «Otra» con un campo de texto, para que los usuarios proporcionen una respuesta personalizada si ninguna de las opciones predefinidas se aplica. Para activarla, selecciona el campo Opción única (botones de radio) en el editor, abre los ajustes del bloque en la barra lateral derecha y activa el ajuste Incluir la opción «Otra».
- Campo deslizante: admite una amplia variedad de usos, como especificar un presupuesto en solicitudes de presupuesto, establecer intervalos de distancia o porcentajes, u ofrecer formas alternativas de valorar elementos más allá del campo de valoración estándar.
- Aceptación de los términos: ayuda a garantizar el cumplimiento al exigir que los usuarios acepten los términos antes de enviar el formulario.
- Campo de entrada de texto: proporciona un campo de una sola línea para respuestas de texto breves.
- Campo de entrada de hora: proporciona un campo de una sola línea para indicar una hora del día, útil en formularios de reserva y programación.
- Campo de sitio web: Proporciona un campo de una sola línea para el sitio web URL, útil para recopilar enlaces de empresas o blogs.
En este vídeo puedes ver cómo añadir un campo desplegable a tu formulario:
Limitaciones de las etiquetas HTML
Por motivos de seguridad, no se permiten todas las etiquetas HTML en el bloque Formulario. Estas son algunas de las etiquetas que no se permiten:
headerembedframeiframeforminputobjecttextareascriptstylelink
Aprovecha Jetpack AI para crear tu propio formulario
La funcionalidad de los bloques Formulario basada en Jetpack AI forma parte de la suite de Jetpack AI Assistant.
Jetpack AI offers you 20 free requests to get started. For more information about upgrading, please refer to our detailed Usage limitations and upgrades guide.
Cómo usar Jetpack AI para crear un formulario
- En el bloque Formulario, busca el campo que dice
Pide a Jetpack AI que cree tu formulario.(Haz clic en el icono de Destellos ✨ si no lo ves en la barra de herramientas del bloque). - Escribe una breve descripción de la información que quieres recopilar.
- Haz clic en Generar.
El bloque Formulario se rellenará ahora con los campos pertinentes.
Estos son algunos ejemplos de instrucciones que puedes usar para crear tu formulario:
- Añade un formulario de registro que recopile el nombre, el correo electrónico y el número de teléfono.
- Crea un formulario con el nombre y el correo electrónico y pide también la talla de camiseta, de la S a la XXL.
También puedes usar Jetpack AI para editar un formulario existente, tanto si se creó inicialmente con IA como a partir de un patrón. Por ejemplo:
- Añade un bloque para recopilar opiniones con opciones de mala a excelente.
- Mueve el campo del número de teléfono antes que el del correo electrónico.
- Haz que todos los campos sean obligatorios.
En este vídeo puedes ver en acción la integración de formularios de Jetpack AI:
Previsualizar y probar un formulario
Puedes previsualizar cualquier formulario y enviar respuestas de prueba para comprobar que todo funciona correctamente de principio a fin antes de que los visitantes interactúen con él. Las respuestas de prueba se registran por separado de los envíos reales, por lo que no se mezclarán con tus datos.
Para obtener instrucciones paso a paso, consulta Previsualiza y prueba un formulario en la guía del editor de formularios.
Ajustar la configuración del bloque
Después de añadir un Formulario bloque, puedes especificar qué ocurre cuando alguien rellena el formulario:
Elige dónde recibir notificaciones
Notificaciones por correo electrónico
La dirección de correo electrónico predeterminada que utiliza un formulario de Jetpack es la del administrador del sitio (las respuestas del formulario se envían al destinatario que elijas. Si no eliges ninguno, el destinatario se determina automáticamente según dónde esté ubicado el formulario en tu sitio.
Para establecer un destinatario:
- Selecciona el bloque Formulario y abre Notificaciones del formulario en la barra lateral de ajustes del bloque.
- Escribe una dirección en Enviar notificaciones por correo electrónico a.
- Para notificar a varias personas, separa cada dirección con una coma.
El campo aparece inicialmente vacío, con una dirección atenuada como marcador de posición. Esa dirección es el destino de las respuestas si dejas el campo vacío. Es una vista previa del destinatario automático, no un valor guardado.
El texto de ayuda situado debajo del campo indica la regla que se está utilizando:
- En una entrada o página, las respuestas se envían al autor de la entrada.
- En un widget, una plantilla de bloques o una parte de plantilla, las respuestas se envían a la dirección del administrador del sitio, establecida en Ajustes → Generales → Dirección de correo electrónico de administración.
- En el editor de formularios independiente, las respuestas se envían al autor de la página en la que aparece el formulario.
En una entrada o página, las respuestas se envían al autor de la entrada solo mientras este conserve una dirección de correo electrónico, siga siendo miembro de tu sitio y pueda seguir editando la entrada. Si alguna de estas condiciones deja de cumplirse, las respuestas se enviarán a la dirección del administrador del sitio.
Escribir una dirección la guarda en el formulario. Si borras el contenido del campo, el formulario vuelve a utilizar el destinatario automático.
Puedes escribir la misma dirección que muestra el marcador de posición. Al guardarla, las respuestas quedan vinculadas a esa dirección, por lo que seguirán llegando allí aunque el autor de la entrada cambie más adelante. Un campo vacío sigue al autor de la entrada que haya en cada momento.
Si antes este campo mostraba una dirección y ahora aparece vacío, no ha cambiado nada en tu formulario. Esa dirección nunca se guardó en el formulario; siempre se determinó automáticamente y así sigue siendo. Las respuestas se envían exactamente al mismo lugar que antes.
Notificaciones push
Puedes recibir notificaciones push sobre las respuestas del formulario seleccionando Activar las notificaciones de las respuestas. Puedes especificar qué usuarios conectados a Jetpack recibirán las notificaciones.
Puedes encontrar más información sobre la configuración de las notificaciones push en Jetpack, incluida la posibilidad de recibirlas en la aplicación de Jetpack o en el navegador.
Almacenamiento de respuestas
Puedes elegir no guardar los envíos de formularios en el panel de administración de WordPress. Para ello, accede a los ajustes de almacenamiento de respuestas en el panel del bloque Formulario y desactiva la opción, que está activada de forma predeterminada.
Ajustes de envío
El ajuste Acción después del envío controla lo que ve el usuario después de enviar el formulario. Las opciones son:
- Mostrar un resumen de los campos enviados, con un encabezado de mensaje personalizable.
- Mostrar un mensaje de texto personalizado.
- Redirigir a otra página web.
El resumen muestra el encabezado que has establecido, cada campo enviado con su respuesta y un botón para volver a la página en la que se encuentra el formulario. Las respuestas se muestran según el tipo de campo: las valoraciones muestran estrellas, las direcciones de sitios web se convierten en enlaces en los que puedes hacer clic, los números de teléfono se convierten en enlaces que inician una llamada, las cargas de archivos muestran el nombre y el tamaño del archivo, y los campos de selección de imágenes muestran miniaturas.
Ajustes individuales de los campos del formulario
También puedes personalizar los ajustes de cada campo del formulario. Para hacerlo, haz clic en el campo. Verás opciones para:
- Marcar el campo como obligatorio
- Modificar el ancho del campo del formulario (los valores disponibles son 25 %, 50 %, 75 % y 100 %)
- Cambiar el color de fondo (sólido o degradado) y el color del texto
Añadir texto de ayuda a un campo
El texto de ayuda es una breve indicación que aparece debajo de la entrada de un campo en el formulario publicado. Úsalo para explicar qué se debe introducir; por ejemplo, por qué pides un número de teléfono o qué significan los extremos de un control deslizante.
Los lectores de pantalla anuncian el texto de ayuda después de la etiqueta del campo, por lo que añadirlo no cambia cómo se llama el campo.
Para añadir texto de ayuda a un campo:
- Selecciona el campo en el editor.
- Escribe en el marcador de posición «Añadir texto…» que aparece debajo del campo de entrada, o abre la barra lateral de ajustes del bloque y escribe el texto en el cuadro Texto de ayuda, dentro de Ajustes del campo.
- Haz clic en Guardar o Publicar para conservar los cambios.
Ambos lugares escriben el mismo texto, así que usa el que prefieras. Para eliminar el texto de ayuda, borra el contenido del cuadro.
El texto de ayuda es texto sin formato. No puede contener enlaces, formato en negrita o cursiva ni saltos de línea.
Estos campos admiten texto de ayuda:
- Entrada de texto
- Nombre
- Correo electrónico
- Sitio web
- Número de teléfono
- Texto multilínea
- Número
- Selector de fecha
- Entrada de hora
- Desplegable
- Control deslizante
Estos campos no admiten texto de ayuda:
- Valoración
- Opción múltiple (casilla de verificación)
- Opción única (botón de radio)
- Consentimiento de los términos
- Subida de archivos
- Oculto
- Personalizado HTML
Dónde aparece el formato de fecha
El campo Selector de fecha muestra el formato esperado, como AAAA-MM-DD, debajo del campo de entrada en lugar de dentro de la etiqueta del campo. En versiones anteriores de Jetpack, el formato se añadía al final de la etiqueta, por lo que un campo llamado «Cumpleaños» aparecía como «Cumpleaños (AAAA-MM-DD)». Ahora la etiqueta solo contiene el nombre que le diste al campo.
La indicación sigue el ajuste Formato de fecha del campo, por lo que al cambiar el formato también cambia el texto que aparece debajo del campo de entrada.
Si añades texto de ayuda a un campo Selector de fecha, el texto de ayuda aparece primero y el formato va después en la misma línea.
Personaliza el botón de envío
Puedes cambiar los siguientes ajustes del botón de envío:
- Texto del botón
- Color del botón (sólido o degradado)
- Color del texto
- Radio del borde
- Ancho del botón (25 %, 50 %, 75 %, 100 % o un valor personalizado en píxeles)
- Alineación del botón (alineación a la izquierda, a la derecha o centrada)
Personaliza el campo de asunto de los correos electrónicos de notificación
Jetpack ofrece una opción para cambiar el asunto del correo electrónico que se te envía después de cada envío del formulario. Puedes añadir tokens al campo de asunto, como {city} y Jetpack sustituirá el token por el valor del campo «Ciudad» del formulario (sin distinguir entre mayúsculas y minúsculas; solo tienes que asegurarte de que las palabras coincidan).
Gestión de formularios e integraciones
Después de publicar tu formulario de Jetpack, podrás revisar y gestionar los envíos directamente desde el panel de administración. Solo tienes que ir a Jetpack → Formularios → Respuestas en el menú de la izquierda.
Cuando tengas una respuesta abierta, los atajos de teclado te permiten pasar de una respuesta a otra y marcarlas como spam o papelera sin usar el ratón.
Consulta Gestión de respuestas e integraciones del formulario para ver la lista completa y más funciones para ver, gestionar y exportar las respuestas de tu formulario.
Bloque Formularios en varios pasos
Puedes usar Formularios en varios pasos para dividir un formulario largo en secciones más pequeñas y fáciles de gestionar, y guiar a los visitantes por cada paso uno a uno en lugar de mostrar todos los campos a la vez. Para empezar un formulario nuevo en varios pasos, inserta el patrón Formulario en varios pasos. También puedes convertir un formulario existente en un formulario en varios pasos.
Puedes ir a su página de soporte específica para obtener más información sobre cómo configurarlo y personalizarlo.
Still need help?
Please contact support. We’re happy to advise.
Información de privacidad
El bloque Formulario está activado de forma predeterminada. Se puede desactivar/reactivar en cualquier momento siguiendo la guía para controlar las funciones de Jetpack en una sola página.
| Datos utilizados | |
|---|---|
| Propietarios/usuarios del sitio Para el seguimiento de la actividad (detallado más abajo): dirección IP, ID de usuario de WordPress.com, nombre de usuario de WordPress.com, ID del sitio conectado a WordPress.com y URL, versión de Jetpack, agente de usuario, URL visitada, URL de referencia, fecha y hora del evento, idioma del navegador, código del país. | Visitantes del sitio Si Akismet está activado en el sitio, los datos del envío del formulario de contacto (dirección IP, agente de usuario, dirección de correo electrónico, URL del sitio y comentario) se envían al servicio de Akismet (también propiedad de Automattic) para comprobar si hay spam. Los datos reales del envío se almacenan en la base de datos del sitio en el que se realizó y se envían directamente por correo electrónico al propietario del formulario (es decir, al autor del sitio que publicó la página en la que se encuentra el formulario de contacto). Este correo electrónico incluirá la dirección IP, la fecha y hora, el nombre, la dirección de correo electrónico, el sitio web y el mensaje de quien realizó el envío. La dirección IP se incluye como medida de prevención contra el abuso. Además, en los sitios que usan Akismet, es necesario proporcionar una protección adecuada contra el spam. |
| Actividad registrada | |
| Propietarios/usuarios del sitio Registramos cuándo y qué usuario activa y desactiva la función, así como cuándo se exportan archivos CSV o Hojas de cálculo de Google desde la página de formularios de Feedback. | Visitantes del sitio Ninguno. |
| Datos sincronizados (Más información) | |
| Propietarios/usuarios del sitio Sincronizamos una única opción que identifica si la función está activada. | Visitantes del sitio Sincronizamos los datos de la entrada y los metadatos de la entrada asociados al envío de un formulario de contacto por parte de un usuario. Si Akismet está activado en el sitio, también se sincronizan la dirección IP y el agente de usuario enviados originalmente con el comentario, ya que se almacenan en los metadatos de la entrada. |
In this section
- Add File Uploads to your Contact forms Add the File Upload Field block to your contact forms, so visitors can attach documents, images, and other…
- Contact Form (Classic Editor) These instructions are for the Classic Editor. If you are using the Gutenberg editor, please refer to the…
- Enhance User Experience with Multistep Forms Use the Multistep Forms to break a long form into multiple smaller sections, guiding your users through a…
- Jetpack Form Editor Learn how to create, manage, and organize forms using the Jetpack Form Editor, including how to build new…
- Managing Contact Form Responses and Integrations Learn how to find, manage, and troubleshoot Jetpack Form responses, plus explore integration options for email and third-party…
- Style your Jetpack Form Customize your Jetpack Forms using block controls to reflect your site's unique design. Once you've added a Jetpack…