Cómo Añadir WPForms a una Página en WordPress [Paso a Paso]

¿Quieres aprender a añadir WPForms a una página en WordPress?

Llevo ya un tiempo trabajando con WPForms. Una de las preguntas más habituales que me hacen los usuarios nuevos es cómo pasar el formulario del generador a una página real.

¿La buena noticia? WPForms te ofrece cinco formas diferentes de hacerlo, y cada una de ellas requiere solo unos pocos clics. En esta guía, te explicaré cada uno de los métodos para que puedas elegir el que mejor se adapte a tu configuración.

¡Crea tu formulario de WordPress ahora mismo! 😉

¿Cómo añado WPForms a una página en WordPress?

WPForms te permite mostrar fácilmente tus formularios en cualquier lugar de tu sitio web.

Puedes utilizar el asistente de inserción integrado, el editor de bloques de WordPress, un código corto, un widget o un creador de páginas como Elementor o Divi.

A continuación voy a explicar los cinco métodos. Si no sabes cuál elegir, empieza por el método 1. Es el más rápido.

Método 1: Utilizar el asistente de incrustación

Esta es la forma más rápida de añadir WPForms a una página. Ni siquiera tienes que salir del generador de formularios. Una vez que hayas creado o editado tu formulario, haz clic en el botón «Insertar» situado en la parte superior derecha del generador.

Aparecerá una ventana emergente con dos opciones: crear una página nueva o seleccionar una ya existente.

Insertar en una nueva página

Si quieres crear una nueva página para tu formulario, haz clic en «Crear nueva página». Introduce un nombre para la página y haz clic en «Adelante».

Se te redirigirá directamente al editor de páginas con tu formulario ya integrado. Solo tienes que hacer clic en «Publicar».

Incrustar en una página existente

¿Ya tienes una página en la que quieres insertar el formulario? Haz clic en «Seleccionar página existente » y elige la página en el menú desplegable.

Haz clic en «Let’s Go» y serás redirigido al editor de esa página. Desde aquí, es posible que tengas que añadir el bloque de WPForms a la página (te explicaré cómo hacerlo en el siguiente método). Pulsa «Actualizar» para guardar los cambios.

Método 2: Utilizar el editor de bloques

Si ya estás editando una página y quieres insertar un formulario, puedes añadir directamente el bloque de WPForms.

Abre la página en la que quieres colocar el formulario. Haz clic en el icono del signo más (+) situado en la esquina superior izquierda para abrir la biblioteca de bloques.

Busca «WPForms» o desplázate hasta la sección «Widgets ». Haz clic en el bloque de WPForms para añadirlo a tu página.

Ahora selecciona el formulario que deseas mostrar en el menú desplegable «Seleccionar un formulario ».

El formulario aparecerá directamente en el editor. Haz clic en «Publicar» o «Actualizar » cuando estés listo.

Configurar los ajustes del bloque de WPForms

Una vez que hayas añadido el formulario, verás opciones de configuración adicionales en el panel lateral derecho.

Esto es lo que puedes ajustar:

• Mostrar título y descripción: activa estas opciones para mostrar el nombre y la descripción del formulario encima de los campos del mismo.
• Personalización de formularios: WPForms te permite personalizar tus formularios directamente en el editor de bloques sin necesidad de escribir código CSS. Puedes modificar visualmente el tamaño de los campos, los colores y el estilo de los botones.
• Avanzado: Añade clases CSS personalizadas si necesitas un mayor control sobre el aspecto del formulario.

Método 3: Utilizar un código corto

WPForms genera un código corto único para cada formulario que crees. Esto resulta útil si trabajas con el Editor clásico, con un tema que no sea totalmente compatible con bloques o en cualquier otra área que admita códigos cortos.

Para encontrar el código abreviado de tu formulario, ve a WPForms » Todos los formularios en tu panel de control de WordPress. Verás el código abreviado junto a cada formulario. Tiene un aspecto similar a este:

Copia el código corto y, a continuación, abre la página o la entrada en la que quieras añadir el formulario. Añade un bloque de código corto (o pégalo directamente si estás en el Editor clásico), introduce el código corto y haz clic en «Publicar» o «Actualizar».

Método 4: Utilizar un widget (barra lateral o pie de página)

¿Quieres mostrar un formulario en la barra lateral o en el pie de página? Puedes añadirlo como un widget. Es ideal para suscripciones a boletines informativos, formularios de contacto rápido o formularios de captación de clientes potenciales que deban aparecer en todo tu sitio web.

Ve a «Apariencia» » «Widgets» en tu panel de control de WordPress.

Busca el área de widgets donde quieras colocar el formulario (barra lateral, pie de página, etc.) y haz clic en ella para desplegarla.

Haz clic en el botón «+» situado en la esquina superior izquierda del editor y busca el bloque «WPForms», tal y como lo harías en una página normal.

Selecciona el formulario en el menú desplegable.

Haz clic en el botón «Actualizar» situado en la esquina superior derecha para guardar la configuración del widget.

Así es como se ve un formulario en un widget de pie de página en un sitio web activo:

Si quieres una explicación más detallada, consulta nuestra guía sobre cómo añadir un formulario de contacto en un widget de la barra lateral de WordPress.

Método 5: Utilizar un creador de páginas

Si creas tus páginas con Elementor o Divi, WPForms cuenta con integraciones nativas para ambos. No necesitas códigos cortos ni soluciones alternativas.

Añadir WPForms a una página de Elementor

Abre tu página en el constructor Elementor. En la barra lateral izquierda, busca el widget de WPForms en la sección «Básico ». Arrástralo a la página, al lugar donde quieras que aparezca el formulario.

Selecciona tu formulario en el menú desplegable de la configuración del widget. Elementor mostrará una vista previa en tiempo real de tu formulario directamente en la página.

Si necesitas realizar cambios en el propio formulario, haz clic en el enlace «Editar el formulario seleccionado » para abrir el generador de formularios en una ventana emergente.

Cuando todo esté bien, haz clic en «Publicar» o «Actualizar» en la parte inferior del editor de Elementor.

WPForms también permite personalizar completamente el diseño de los formularios dentro de Elementor, incluyendo los colores de los campos, los estilos de los botones y los fondos de los contenedores.

Para ver el tutorial completo, consulta nuestra guía sobre cómo añadir WPForms a una página de Elementor.

Añadir WPForms a una página de Divi

Abre tu página y haz clic en «Usar Divi Builder» para abrir el editor visual. Elige tu diseño y añade una nueva fila a tu página.

Cuando Divi te pida que insertes un módulo, busca WPForms y selecciónalo.

En la configuración del módulo, selecciona tu formulario en el menú desplegable «Seleccionar formulario ». También puedes activar el título y la descripción del formulario si deseas que se muestren.

Haz clic en la marca de verificación verde para guardar el módulo y, a continuación, publica la página. Para obtener más información sobre el diseño y las opciones avanzadas, consulta nuestra guía sobre cómo añadir WPForms a una página de Divi.

Extra: Controla dónde están incrustados tus formularios

Una vez que hayas añadido formularios por toda tu página web, puede resultar complicado recordar dónde se encuentra cada uno. WPForms cuenta con una función integrada que te muestra exactamente dónde está incrustado cada formulario.

Ve a WPForms » Todos los formularios. A continuación, abre «Opciones de pantalla » en la parte superior de la página y marca la casilla «Ubicaciones ».

Esto añadirá una columna a la tabla con todos tus formularios que muestra el número de lugares donde has añadido cada formulario. Haz clic en ella para mostrar todas las ubicaciones de un formulario específico.

De esta forma, siempre podrás ver en qué página se encuentra tu formulario de contacto sin tener que buscar por toda la web.

Preguntas frecuentes sobre cómo añadir WPForms a WordPress

Añadir formularios a tu sitio web de WordPress es muy sencillo, pero hay algunas dudas que surgen con frecuencia. Estas son las más habituales.

¿Por qué no aparece mi formulario de WPForms en la página?

Hay algunas cosas que debes comprobar. En primer lugar, asegúrate de que has publicado o actualizado la página después de añadir el formulario. Si has utilizado un código corto, comprueba que el ID del formulario sea correcto.

Si hay un error tipográfico en el código corto, no se mostrará nada. Algunos plugins de almacenamiento en caché también pueden mostrar una versión antigua de la página, así que prueba a borrar la caché de tu sitio y vuelve a comprobarlo.

¿Puedo añadir el mismo formulario a varias páginas?

Sí. Puedes insertar el mismo formulario en tantas páginas, entradas o áreas de widgets como necesites. Todos los métodos que se describen en esta guía sirven para reutilizar un formulario en todo tu sitio web. Todos los envíos se siguen recopilando en un solo lugar, en WPForms » Entradas.

¿Qué método de incrustación debería utilizar?

Depende de tu situación. Aquí tienes una guía rápida:

• Asistente de inserción: la opción más rápida. Úsala cuando estés creando o editando un formulario y quieras publicarlo de inmediato.
• Editor de bloques: ideal para cuando ya estás trabajando en una página. Te ofrece controles de estilo a nivel de bloque.
• Código abreviado: Úsalo con el Editor clásico o en cualquier lugar que admita códigos abreviados, pero no bloques.
• Widget: Para barras laterales y pies de página. Ideal para formularios que deben aparecer en todas las páginas de tu sitio web.
• Creador de páginas: si utilizas Elementor o Divi, la integración nativa con WPForms mantiene todo dentro del flujo de trabajo de tu creador de páginas.

A continuación, personaliza tus formularios de WordPress

¡Y eso es todo! Ya conoces cinco formas diferentes de añadir WPForms a una página en WordPress. Ahora que tu formulario ya está activo, aquí tienes algunas cosas que quizá quieras hacer a continuación:

• Personaliza el aspecto de tu formulario con colores, fuentes y opciones de diseño
• Detén el spam en los formularios de contacto con CAPTCHA, tokens antispam y listas de permitidos/prohibidos
• Configura varias notificaciones por correo electrónico para enviar los formularios rellenados a las personas adecuadas de tu equipo

Cree su formulario WordPress ahora

¿Listo para crear tu formulario? Empieza hoy mismo con el plugin más sencillo para crear formularios en WordPress. WPForms Pro incluye un montón de plantillas gratuitas y ofrece una garantía de devolución de dinero de 14 días.

Si este artículo te ha ayudado, síguenos en Facebook y Twitter para más tutoriales y guías gratuitas sobre WordPress.