Cómo crear formularios AMP en WordPress (la forma fácil)

¿Quiere crear formularios compatibles con AMP en su sitio de WordPress?

Accelerated Mobile Pages o AMP es un proyecto de Google que hace que los sitios web se carguen más rápido en dispositivos móviles.

Aunque AMP brinda una excelente experiencia de navegación móvil al hacer que las páginas se carguen más rápido, deshabilita muchas funciones útiles de su sitio.

Uno de ellos es un formulario de contacto. Debido a que AMP usa un conjunto limitado de HTML y JavaScript, no puede cargar sus formularios de WordPress correctamente en las páginas de AMP.

Pero, afortunadamente, ahora hay una solución fácil. lista de trabajo, el mejor complemento de formularios de WordPress para principiantes, ahora lo ayuda a crear formularios de WordPress listos para AMP. Su equipo se asoció recientemente con Google para simplificar los formularios AMP para WordPress.

En este artículo, le mostraremos cómo crear formularios AMP en WordPress usando WPForms (la manera fácil).

Crear formularios AMP en WordPress (Paso a Paso)

Para usar AMP con WordPress, debe instalar y activar Complemento oficial de AMP para WordPress. Para obtener más detalles, consulte nuestra guía paso a paso sobre cómo instalar complementos de WordPress.

Una vez activado, el complemento agregará automáticamente el soporte de Google AMP a su sitio de WordPress.

Sin embargo, puede cambiar la configuración de AMP en su sitio visitando AMP »General desde tu tablero.

Configuración de AMP para WordPress

En la página de configuración de AMP, puede habilitar o deshabilitar AMP en su sitio, seleccionar el modo de sitio para AMP y seleccionar una plantilla compatible.

Después de configurar AMP, el siguiente paso es crear un formulario de contacto compatible con AMP en su sitio de WordPress.

Paso 1. Crea un formulario de WordPress con WPForms

Para comenzar, instale y active WPForms Lite Complementos en su sitio web. Esta es una versión ligera WPForms Pro insertar.

Tanto la versión Lite como la Pro de WPForms le permiten crear un formulario de contacto básico listo para AMP. En nuestro artículo utilizaremos capturas de pantalla de la versión gratuita.

Después de instalar y activar el complemento, debe ir a WPForms »Agregar nuevo página para crear un nuevo formulario de WordPress.

En la pantalla de configuración del formulario, puede seleccionar una plantilla de formulario para comenzar rápidamente. Si desea comenzar desde cero, puede elegir un formulario en blanco.

Plantilla de formulario WPForms

A continuación, se abrirá la página de creación de formularios.

Cómo crear una alfombra de bienvenida para su sitio de WordPress

Arrastre y suelte el generador de formularios WPForms

Desde aquí puede agregar o eliminar campos de formulario. Para agregar un nuevo campo a un formulario, simplemente haga clic en el campo de formulario en el panel izquierdo y aparecerá en el panel de formulario a la derecha.

A continuación, puede configurar las opciones de campo. Simplemente haga clic en un campo y aparecerán las opciones de campo.

Configure las opciones de campo en el complemento WPForms

Puede personalizar todos los demás campos de la misma manera.

A continuación, puede hacer clic en la pestaña Configuración para configurar los ajustes del formulario.

Configuración general de WPForms

La configuración general le permite cambiar el nombre del formulario, enviar el texto del botón, enviar texto para procesar los botones, activar hanipots antispam y más.

Luego puede hacer clic en la pestaña Notificaciones para configurar notificaciones por correo electrónico para que le notifiquen cuando los usuarios completen el formulario.

Configuración de notificaciones de WPForms

A continuación, puede hacer clic en la pestaña Confirmación para configurar un mensaje de confirmación que se mostrará cuando el usuario envíe el formulario.

Configuración del mensaje de confirmación de WPForms

Una vez configurado, puede guardar el formulario.

Paso 2. Agregue su formulario AMP a la página

Ahora que su formulario de WordPress está listo, puede agregarlo a su página.

Primero, necesitas crear uno nuevo página o abra una página existente en la que desee agregar un formulario.

En la pantalla de edición de la página, haga clic en el ícono Agregar nuevo bloque y seleccione el bloque WPForms.

Agregue un bloque WPForms al editor de páginas de WordPress

Cómo crear una página de archivo personalizada en WordPress

Luego puede ver el widget WPForms agregado a la pantalla de edición de la página. Solo necesita seleccionar el formulario creado previamente y el widget lo cargará en el editor de páginas inmediatamente.

Agregue formularios de contacto a las páginas de WordPress usando WPForms

A continuación, puede publicar o actualizar su página.

¡eso es todo! No necesitas configurar nada más. El complemento WPForms Lite ahora agregará soporte completo de AMP a sus formularios.

Si desea ver cómo se ve, puede abrir la página en su teléfono.

Como alternativa, puede abrir la página en un navegador de escritorio agregando / amp / o /? Amp al final de la URL de la página. Por ejemplo https://www.example.com/contact/?amp.

Agregue Google reCAPTCHA a sus formularios AMP

De forma predeterminada, WPForms incluye un honeypot antispam para capturar y bloquear el spam. También puede usar Google reCAPTCHA para reducir el spam.

Para usar Google reCAPTCHA con sus formularios AMP, debe registrar su sitio web con Google reCAPTCHA v3 y obtener una clave API de Google.

ir sitio web de google captcha y haga clic en el botón Consola de administración en la esquina superior derecha de la página.

Visite el sitio web de Google reCAPTCHA

A continuación, deberá iniciar sesión con su cuenta de Google. Cuando haya terminado, verá la página "Registrar un nuevo sitio".

Regístrese en un nuevo sitio de Google reCAPTCHA

Primero, debe ingresar el nombre de su sitio web en el campo de etiqueta. Google AMP solo admite reCAPTCHA v3, por lo que debe elegir entre las opciones de tipo de reCAPTCHA.

Luego ingrese su nombre de dominio en la sección "Dominio".

Agregue un dominio y un propietario para Google reCAPTCHA

La sección de propietario muestra su dirección de correo electrónico predeterminada. También puede agregar otro correo electrónico si es necesario.

A continuación, debe aceptar los Términos y condiciones de reCAPTCHA para continuar. Además, marque la casilla junto a 'Informar esto al propietario', lo que permitirá que Google le notifique problemas como configuraciones incorrectas y tráfico sospechoso a su sitio.

Cómo crear una página de archivo personalizada en WordPress

Aceptar los Términos de servicio de Google ReCAPTCHA

Cuando haya terminado, haga clic en el botón Enviar.

Luego verá un mensaje de éxito junto con la clave del sitio y la clave para agregar reCAPTCHA a su sitio.

clave reCAPTCHA

Ahora que tiene su clave API de Google, puede agregar reCAPTCHA a su formulario. Sin embargo, se necesita otro ajuste para garantizar que AMP sea compatible con reCATCHA. Haga clic en el enlace "Ir a la configuración" aquí.

Luego verá la configuración de reCAPTCHA nuevamente con la casilla de verificación "Permitir que esta clave se use con páginas AMP". Simplemente marque la casilla y haga clic en el botón Guardar a continuación.

Permitir que reCAPTCHA se ejecute en páginas AMP

Ahora que tiene su clave API de Google para agregar reCAPTCHA a los formularios de AMP, debe abrir WPForms »Configuración» reCAPTCHA Páginas en el tablero de WordPress.

WPForms reCAPTCHA Configurar WordPress

En esta pantalla, debe seleccionar la opción reCAPTCHA v3 y colocar la clave del sitio y la clave secreta. Luego haga clic en el botón "Guardar configuración".

Una vez que Google reCAPTCHA se haya agregado a WPForms, puede activarlo en sus formularios si es necesario. WPForms »Todos los formularios y seleccione el formulario para el que desea activar reCAPTCHA.

Editar formularios creados con WPForms

Una vez que aparece la pantalla de configuración haga clic en la pestaña Configuración y seleccione la sección Configuración general. En la parte inferior puede ver la casilla de verificación "Habilitar Google v3 reCAPTCHA".

Activar Google v3 reCAPTCHA en WPForms

Marque la casilla y guarde su formulario haciendo clic en el botón "Guardar" en la esquina superior derecha.

Luego puede volver a visitar su página de contacto y ver el formulario AMP con reCAPTCHA.

Cómo crear una calculadora de préstamo de automóvil / pago de automóvil en WordPress

Esperamos que este artículo te haya ayudado a aprender cómo crear fácilmente formularios AMP en WordPress. También puede consultar nuestra guía sobre cómo crear formularios compatibles con GDPR en WordPress.

Si te ha gustado este artículo, suscríbete a nuestro Canal de Youtube Vídeo tutoriales para WordPress, también nos puedes encontrar en Gorjeo y Facebook

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Subir