Resumen de IA
Incrustar un formulario en tu sitio web de WordPress significa añadir un formulario funcional y rellenable directamente a cualquier página o entrada. Así, los visitantes pueden contactar, registrarse o enviar información sin salir de tu sitio. Con un plugin como WPForms, puedes hacerlo en solo unos clics usando el botón Incrustar integrado, el bloque WPForms en Gutenberg o un simple shortcode.
Sinceramente, solía pensar que esto sería mucho más complicado de lo que realmente es. Antes de usar WPForms, imaginaba código iframe y CSS personalizado solo para poner un formulario de contacto en una página. Resulta que no necesitas nada de eso.
En esta guía, te mostraré tres formas diferentes de incrustar un formulario en tu sitio de WordPress, paso a paso, para que puedas elegir el método que te resulte más fácil.
Crea tu formulario de WordPress ahora 🙂
3 formas de añadir un formulario a cualquier página de WordPress
Comparación rápida
Puedes incrustar un formulario en tu sitio web usando un plugin de formularios como WPForms, que es la forma más fácil y rápida. Normalmente, necesitarías usar un fragmento de código de incrustación para añadir un formulario a tu sitio web.
Por ejemplo, si quisieras incrustar formularios de Google en tu sitio, necesitarías un poco de código HTML llamado iframe para añadir el formulario a tu sitio. Luego necesitarías usar CSS para dar estilo al formulario y que se viera como querías.
Con WPForms, añadir un formulario a tu sitio de WordPress es mucho más fácil. Tiene 3 métodos diferentes para incrustar formularios en tu sitio web sin necesidad de extensos fragmentos de código.
| Método | Mejor para | Dónde funciona |
| Botón de Incrustar | Principiantes: la opción más rápida | Páginas (nuevas o existentes) |
| Bloque WPForms | Usuarios de Gutenberg: vista previa visual | Páginas y entradas |
| C\ | Máxima flexibilidad | Páginas, entradas, barras laterales, pies de página, widgets |
Un par de prerrequisitos
Antes de empezar a incrustar un formulario, hay un par de cosas que debemos comprobar en nuestra lista.
Instalar el plugin WPForms
WPForms te permite crear tus propios formularios web desde cero o elegir entre más de 2100 plantillas de formularios. Las opciones incluyen formularios de registro, formularios de inscripción y un montón de formularios específicos de la industria para cada tipo de negocio. Y son muy fáciles de incrustar en tu sitio web de WordPress. Para empezar, descarga el plugin WPForms.
Una vez que hayas descargado el plugin, necesitarás subirlo a tu sitio web. Si no estás seguro de cómo hacerlo, esta guía para principiantes sobre cómo instalar plugins de WordPress puede guiarte a través del proceso.
¡Consigue el plugin WPForms ahora! :)
Crear un nuevo formulario
Una vez que hayas instalado el plugin WPForms, estarás listo para crear formularios usando el constructor de arrastrar y soltar. Tanto si quieres crear tu propio formulario como si quieres empezar con una plantilla, depende de ti, pero lo primero que debes hacer es hacer clic en Añadir nuevo.
Una vez que hagas clic en ese botón, verás una variedad de plantillas entre las que puedes elegir. También existe la opción de seleccionar un formulario en blanco y crear el tuyo propio.
Cuando pases el ratón sobre tu selección, verás 2 opciones:
- Usar plantilla
- Ver demostración
Si ves la demostración, te mostrará cómo se ve el formulario incrustado. Recuerda que la plantilla es personalizable, por lo que si hay algo que quieras cambiar, puedes hacerlo.
Una vez que hayas determinado qué plantilla quieres usar, haz clic en el botón usar plantilla. Se abrirá en el editor. Para esta publicación, usaremos la plantilla de formulario de contacto simple.
Ahora es el momento de personalizar tu formulario si lo deseas. En nuestro caso, la plantilla solo recopilaba un número de teléfono. Lo personalizamos agregando primero un campo de casilla de verificación preguntando por su preferencia de contacto y agregando una opción de correo electrónico.
Luego configuramos un poco de lógica condicional, que puedes encontrar en la pestaña Lógica inteligente, en Opciones de campo. La lógica condicional te permite configurar reglas para que los usuarios solo vean los campos que se aplican a ellos.
En este ejemplo, si seleccionan correo electrónico, verán un campo para proporcionar una dirección de correo electrónico. Si quisieras incluir una casilla de verificación GDPR aquí, también podrías hacerlo fácilmente.
Si seleccionan teléfono, pueden proporcionar un número de teléfono. Ahora es el momento de elegir cómo quieres incrustar tu formulario.
¡Ahora, vayamos al evento principal: incrustar tu formulario!
Forma 1: Usando el botón Incrustar de WPForms
WPForms tiene 3 formas de agregar un formulario a tu sitio web. Te mostraré las tres formas de hacerlo aquí y puedes elegir la que te resulte más fácil.
El primer método de incrustación es simplemente usar el botón incrustar en la parte superior de tu editor de formularios.
Una vez que hagas clic en ese botón, tendrás la opción de seleccionar una página existente de WordPress o crear una nueva página. Puedes elegir la que tenga más sentido para tu sitio. Aquí creamos una página de contacto. Una vez que la tengas, puedes hacer clic en el botón ¡Vamos!.
Una vez que hagas eso, se abrirá el borrador de la página y verás el formulario incrustado. Haz clic en publicar ¡y listo!
Forma 2: Usando el editor de bloques de WordPress
Incrustar un formulario directamente desde el editor de bloques de WordPress (también conocido como Gutenberg) es otra forma fácil de agregar uno de tus formularios a una publicación o página.
Abre la página donde quieres que aparezca el formulario y haz clic en el icono azul signo más (+).
Se abrirá un menú con una variedad de opciones de widgets. Desplázate hacia abajo hasta que encuentres el widget WPForms y haz clic en él. Cuando lo hagas, se abrirá un cuadro y podrás seleccionar el formulario que deseas incrustar.
Después de hacer tu selección, verás el formulario incrustado en tu página.
Forma 3: Usando la incrustación de shortcode
Otra forma sencilla de incrustar un formulario en tu sitio web es pegando un shortcode, lo que solo toma unos segundos. Puedes encontrar el shortcode de tu formulario en 2 lugares:
El botón Incrustar
Cuando haces clic en el botón incrustar desde el editor, como hicimos anteriormente, una de las opciones alternativas es usar un shortcode. Si haces clic en él, aparecerá el shortcode de tu formulario y podrás copiarlo.
Tu lista de formularios en el plugin WPForms
Desde tu panel de WordPress, haz clic en el plugin WPForms en la barra lateral. Se mostrará la lista de formularios que has creado y verás los shortcodes para todos ellos. Esto es útil si no estás trabajando activamente en un formulario pero necesitas obtener el shortcode rápidamente para incrustarlo en algún lugar.
Después de haber copiado el shortcode, ve a la página o publicación donde deseas incrustarlo. Una vez más, querrás hacer clic en el signo azul más (+) en la esquina superior izquierda para obtener una lista de opciones desplegables.
En lugar de seleccionar el widget de WPForms como hicimos antes, seleccionaremos el widget de Shortcode en su lugar.
Cuando hagas clic en eso, aparecerá un cuadro en el editor de tu publicación. Todo lo que tienes que hacer es pegar ese shortcode en el cuadro.
Si previsualizas la página, verás que el formulario se ha incrustado correctamente. Además, también puedes pegar el shortcode directamente en el editor en lugar de pasar por el widget.
Y de nuevo, después de pegarlo donde quieres que aparezca dentro del contenido, puedes previsualizar la página y ver que se ha incrustado.
Este método también funciona muy bien para añadir fácilmente un formulario al pie de página de tu sitio web.
Ahora publica tu formulario
Después de haber creado e incrustado tu formulario con éxito, ¡es hora de publicarlo! Haz clic en el botón publicar en WordPress. Cuando visites la página en vivo, tu formulario incrustado estará listo para recopilar información.
Por defecto, el usuario permanecerá en la misma página. Si deseas redirigir a los usuarios a otra página después de que envíen las respuestas de su formulario, puedes hacerlo.
¡Crea tu formulario de WordPress ahora! :)
Preguntas frecuentes: Cómo incrustar un formulario en tu sitio web de WordPress
¿Cómo incrusto un formulario de contacto en mi sitio web de WordPress?
Para incrustar un formulario en tu sitio web de WordPress, simplemente crea el formulario en WPForms, luego haz clic en el botón Incrustar en la parte superior del constructor de formularios. Puedes añadir el formulario a una página existente o crear una nueva. El formulario aparecerá automáticamente en la página después de que selecciones dónde quieres que vaya.
¿Cómo añado un formulario rellenable a un sitio web?
Usando WPForms, puedes añadir fácilmente un formulario rellenable a tu sitio de WordPress. Una vez que crees tu formulario, copia el shortcode proporcionado y pégalo en cualquier página o publicación. Alternativamente, puedes usar el editor de bloques para insertar el bloque WPForms, luego selecciona tu formulario del menú desplegable.
¿Cómo enlazo a un formulario en WordPress?
Para enlazar a un formulario en WordPress, crea una página o publicación con el formulario incrustado, luego copia la URL de esa página. Puedes compartir esta URL en botones o enlaces de texto en cualquier lugar de tu sitio, dirigiendo a los usuarios a tu formulario.
¿Cuál es la mejor manera de añadir un widget de formulario a WordPress?
La forma más fácil de añadir un widget de formulario en WordPress es usando los bloques nativos de WordPress de WPForms. Simplemente edita cualquier página o publicación, haz clic en el botón más (+), busca "WPForms" y selecciona tu formulario.
Este método funciona mejor que los widgets tradicionales de WordPress porque es más flexible y no requiere áreas de widgets específicas del tema.
¿Puedo incrustar formularios sin conocimientos de codificación?
¡Absolutamente! WPForms está diseñado específicamente para usuarios no técnicos. Puedes incrustar formularios utilizando el editor visual de WordPress, botones de incrustación de un solo clic o códigos cortos sencillos.
No se requieren conocimientos de HTML, CSS o PHP. Esto lo hace mucho más fácil que alternativas como Google Forms (que requiere códigos iframe) o formularios HTML personalizados.
¿Cuál es la diferencia entre incrustar formularios con bloques y códigos cortos?
Los bloques de WordPress (el bloque WPForms) ofrecen una interfaz visual y son más fáciles para principiantes, mientras que los códigos cortos ofrecen más flexibilidad para usuarios avanzados.
Los bloques funcionan muy bien en el área de contenido principal, mientras que los códigos cortos pueden ir a cualquier parte: barras laterales, pies de página, ubicaciones de plantillas personalizadas o incluso áreas de contenido de otros complementos.
¿Puedo incrustar el mismo formulario en varios lugares de mi sitio web?
¡Sí! Puedes incrustar el mismo formulario de WPForms en varias páginas, publicaciones o ubicaciones utilizando cualquiera de los tres métodos de incrustación.
Todas las envíos van al mismo lugar, lo que lo hace perfecto para tener un formulario de contacto en tu encabezado, pie de página y página de contacto dedicada simultáneamente.
¿Los formularios incrustados de WordPress funcionan en dispositivos móviles?
Sí, WPForms crea automáticamente formularios incrustados adaptables a móviles que funcionan perfectamente en todos los dispositivos.
A diferencia de los constructores de formularios externos que a veces tienen problemas de visualización móvil, WPForms utiliza el diseño adaptable de tu tema de WordPress, garantizando una apariencia y funcionalidad consistentes en escritorio, tableta y móvil.
A continuación, protege tu formulario con hCaptcha
¿Quieres añadir una capa extra de protección contra spam a tu formulario? WPForms incluye integración con hCaptcha, lo que facilita hacerlo. Aprende cómo proteger tu formulario de WordPress con hCaptcha.
Crea tu formulario de WordPress ahora
¿Listo para crear tu formulario? Empieza hoy mismo con el plugin de creación de formularios de WordPress más fácil. WPForms Pro incluye muchas plantillas gratuitas y ofrece una garantía de devolución de dinero de 14 días.
Si este artículo te ha sido útil, síguenos en Facebook y Twitter para obtener más tutoriales y guías gratuitas de WordPress.
Intenté hacer funciones de devolución de llamada creando un complemento personalizado. para intentar enviar los valores a mi segunda base de datos. Sin embargo, creo que debido a los nombres extraños de los campos del formulario, pasa un valor en blanco/vacío. ¿O me he perdido alguna parte importante en la personalización?
Hola Ian: ¡Estaremos encantados de ayudarte! Cuando tengas un momento, ponte en contacto con nosotros en soporte para que podamos ayudarte.
Si tienes una licencia de WPForms, tienes acceso a nuestro soporte por correo electrónico, así que por favor envía un ticket de soporte para que podamos investigar el problema por ti.
Gracias 🙂
Qué pasa si no quiero el código corto, me gustaría el código HTML incrustado completo. De esa manera puedo insertarlo en una pestaña. Tengo dificultades para encontrar el código completo. De hecho, puedo hacerlo con Google Forms, pero preferiría hacerlo con WP forms.
Hola Luis: Lo siento, no tenemos una función para incrustar el formulario completo en HTML. Estoy de acuerdo en que sería una gran función y añadiré una solicitud para ello.
Lamento no poder ofrecerle lo que busca en este momento, ¡pero aprecio la sugerencia y cualquier otro detalle que pueda proporcionar! Siempre es útil obtener información de nuestros usuarios.
Gracias 🙂
¿Entonces no puedo estilizar un formulario añadido con un código corto?
Hola Siegfried, al incrustar un formulario mediante un shortcode, no puedes darle estilo directamente a través del editor de bloques. Sin embargo, puedes personalizar su apariencia utilizando CSS personalizado. Para obtener una guía paso a paso sobre cómo dar estilo a tus formularios incrustados con shortcode, consulta nuestra guía sobre cómo dar estilo a WPForms con CSS personalizado.
Si estás utilizando el editor de bloques e incrustas tu formulario mediante el bloque WPForms (en lugar de un shortcode), tienes opciones de estilo integradas. Para obtener información sobre este método, echa un vistazo a nuestra guía sobre el uso de Estilos de formulario en el editor de bloques. ¡Espero que esto ayude, gracias!
Solo estoy probando WPForms y me gusta lo que veo.
Lo único que estoy intentando averiguar es cómo hacer que el formulario simplemente se expanda en la página o aparezca (incrustado en un botón, pero sin ser una URL de página completamente diferente).
¿Es eso posible?
Hola Kathy:
Tenemos 2 soluciones alternativas para ayudarte con tu caso de uso. Puedes implementar un formulario acordeón si necesitas formularios que se expandan cuando los usuarios hagan clic en un botón.
Para formularios emergentes, puedes usar Elementor Popups o OptinMonster para incrustar tus formularios.
¡Espero que esto ayude! ¡Gracias!