Cómo agregar un formulario de contacto con desplazamiento en WordPress

¿Quieres agregar un formulario de contacto con desplazamiento en WordPress? Si su negocio depende de obtener nuevos clientes potenciales desde el formulario de contacto de su sitio web, una de las mejores formas de hacer crecer su fuente de clientes potenciales es hacer que su formulario de contacto sea más prominente. En este artículo, le mostraremos cómo agregar un formulario de contacto desplazable en WordPress sin molestar a sus usuarios.

¿Por qué agregar un formulario de contacto con desplazamiento en WordPress?

Muchos propietarios de pequeñas empresas inician su sitio web con la esperanza de que les ayude a hacer crecer su negocio.

Es por eso que agrega una página de formulario de contacto para que los usuarios puedan comunicarse con usted.

Sin embargo, el problema es que la mayoría de los usuarios que puedan tener preguntas abandonarán su sitio web sin contactarlo.

Es por eso que puede notar que muchos sitios web populares agregan ventanas emergentes a los formularios de contacto, formularios de contacto deslizantes o botones de llamada a la acción que abren formularios de contacto.

Estas opciones animadas e interactivas desvían la atención del usuario hacia el formulario de contacto y le permiten completar rápidamente el formulario sin visitar otra página. Estos módulos aumentan significativamente sus conversiones, por eso los ve en todas partes.

Echemos un vistazo a cómo crear un formulario de contacto desplazable en WordPress.

Agregar un formulario de contacto con desplazamiento en WordPress

Para este tutorial, necesitará WPForms. Es el mejor plugin de formulario de contacto de WordPress del mercado.

Puedes usar un versión gratuita de WPForms plugin de formulario de contacto si no necesita todas las funciones premium.

También necesitarás OptinMonster. Es el software de optimización de conversión más poderoso. Le ayuda a convertir en clientes a los visitantes que abandonan el sitio web. Necesitará su plan profesional que le da acceso a la función de lienzo que usaremos en este tutorial.

Paso 1. Creando un formulario de contacto en WordPress

Primero necesitas instalar y activar el archivo. WPForms conectar. Para obtener más detalles, consulte nuestra guía paso a paso sobre cómo instalar un plugin de WordPress.

Después de la activación, debe visitar WPForms »Agregar nuevo página para crear su formulario de contacto. Esto lanzará la interfaz del generador de WPForms.

Ingrese un nombre para el formulario de contacto y luego seleccione la plantilla «Seleccionar formulario de contacto».

Crea un nuevo formulario de contacto

WPForms cargará un formulario de contacto simple. Verá la vista previa del formulario en el panel derecho. Puede hacer clic en cualquier campo para editarlo o agregar nuevos campos de la columna de la izquierda.

Constructor de formularios

Una vez que haya terminado de editar el formulario, haga clic en el botón Guardar para guardar sus cambios.

A continuación, debe hacer clic en el botón de inserción de arriba para obtener el código de inserción del formulario.

Aparecerá una ventana emergente que muestra el código corto de su formulario. Continúe y copie este código corto, ya que lo necesitará en el siguiente paso.

Paso 2. Creación de una opción de deslizamiento hacia afuera en OptinMonster

Ahora crearemos una campaña de diapositivas que mostrará el formulario de contacto que creó en el primer paso.

Primero, necesitas instalar y activar el archivo. OptinMonster conectar. Para obtener más detalles, consulte nuestra guía paso a paso sobre cómo instalar un plugin de WordPress.

Este plugin actúa como un conector entre su sitio web y su cuenta de OptinMonster.

Después de la activación, haga clic en el menú OptinMonster en la barra de administración de WordPress e ingrese su clave API. Puede obtener esta información de su cuenta en el sitio web de OptinMonster.

Clave de API de OptinMonster

Después de ingresar su clave de licencia, haga clic en el botón «Crear nueva suscripción» en la esquina superior derecha de la pantalla.

Nueva suscripción

Esto lo llevará al sitio web de OptinMonster.

OptinMonster ofrece varios tipos de campañas dinámicas. Para este tutorial, usaremos la campaña «Slide in». Continúe y haga clic para seleccionar «Deslizar hacia adentro» como el tipo de campaña.

Ingrese optin

A continuación, debe seleccionar el modelo. OptinMonster ofrece varias plantillas listas para usar, pero tenemos que seleccionar «Lienzo» para este tutorial.

Modelo Optin

Tan pronto como seleccione la plantilla, se le pedirá que proporcione un nombre para su campaña. Esto le ayudará a localizar fácilmente la campaña en el panel de OptinMonster.

OptinMonster ahora cargará su interfaz de creación de campañas.

Constructor de OptinMonster

Verá una vista previa en vivo de su campaña a la derecha. Dado que estamos usando la plantilla de lienzo, estará completamente en blanco en este momento.

En la mano izquierda, verá varias pestañas. En la sección «Configuración general de suscripción», debe ingresar la URL de su sitio web en la opción «Sitio web de la campaña de suscripción».

A continuación, debe cambiar a la pestaña «Optin». Aquí puede seleccionar colores, altura y ancho para su opción.

Diseña tu formulario deslizable

Continúe y seleccione los colores que le gusten y ajuste el ancho y la altura, para que pueda mostrar bien toda la forma.

Después de eso, debe desplazarse hacia abajo hasta la sección «Lienzo HTML personalizado» e insertar el código corto de WPForms que copió anteriormente.

Agregar código corto a HTML personalizado

Ingresar el código corto no mostrará inmediatamente el formulario dentro de la campaña de diapositivas. Esto se debe a que el código abreviado solo funciona en su sitio de WordPress.

Ahora puede hacer clic en el botón «Guardar» en la parte superior para almacenar su configuración y luego hacer clic en el botón «Publicar».

Guarda y publica tu suscripción

En la siguiente pantalla, debe cambiar el estado de activación a publicado. Esto hará que la opción de suscripción esté disponible en su sitio de WordPress.

Estado de publicación

Paso 3. Ver el formulario de contacto con desplazamiento en WordPress

Ahora que ha creado tanto el formulario de contacto como la campaña deslizable, está listo para mostrarlo en su sitio web.

Adelante y visita OptinMonster página en su área de administración de WordPress. Verá su campaña de diapositivas recién creada en la lista.

Cambiar la configuración de salida de suscripción

Debe hacer clic en el enlace «Cambiar configuración de salida» para decidir cómo se muestra en el sitio web.

En la siguiente pantalla, asegúrese de marcar la casilla junto a «¿Habilitar la suscripción en el sitio?» opción. OptinMonster le permite elegir quién puede ver el optin. También puede seleccionar un área específica de su sitio web para ver la suscripción.

Habilite la opción de suscripción en su sitio web

No olvide hacer clic en el botón Guardar configuración para guardar sus cambios.

Ahora puede visitar su sitio web para ver el formulario de contacto desplazable en acción. Asegúrese de usar el modo icognito en su navegador o cierre la sesión de WordPress, para que pueda ver exactamente lo que verán sus usuarios.

Vista previa del formulario de contacto con desplazamiento

De forma predeterminada, la campaña deslizable aparecerá 5 segundos después de que la página se haya cargado por completo. Sin embargo, OptinMonster le permite cambiar eso también.

Puede crear innumerables reglas para ver la campaña siempre que se cumplan determinadas condiciones.

Por ejemplo, puede mostrar el formulario deslizable cuando un usuario se ha desplazado el 50% de la página, cuando un usuario está a punto de salir de una página y muchos más.

Ver reglas

Esperamos que este artículo le haya ayudado a aprender cómo agregar un formulario de contacto con desplazamiento en WordPress. Es posible que también desee ver nuestra lista de consejos que puede utilizar para dirigir el tráfico a su sitio de WordPress.

¿Te ha resultado útil??

0 / 0

Deja una respuesta 0

Tu dirección de correo electrónico no será publicado. Required fields are marked *