¿Le gustaría agregar un formulario de contacto deslizable en WordPress? Si su negocio depende de obtener nuevos clientes potenciales a través del formulario de contacto de su sitio web, una de las mejores maneras de aumentar su fuente de clientes potenciales es hacer que su formulario de contacto sea más visible. En este artículo, le mostraremos cómo agregar un formulario de contacto deslizable en WordPress sin molestar a sus usuarios.

Agregue un formulario de contacto Slideout en WordPress

¿Por qué agregar un formulario de contacto deslizable 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 sin contactarlo.

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

Estas animaciones y opciones interactivas dirigen la atención del usuario al formulario de contacto y le permiten completarlo rápidamente sin visitar otras páginas. Estos formularios aumentan significativamente su tasa de conversión, por lo que los ve en todas partes.

Veamos cómo crear un formulario de contacto deslizable en WordPress.

Agregue un formulario de contacto Slideout en WordPress

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

Si no necesita todas las funciones avanzadas, puede usar la versión gratuita del complemento de formulario de contacto de WPForms.

También necesita OptinMonster. Es el software de optimización de conversión más poderoso. Puede ayudarlo a convertir a los visitantes abandonados del sitio web en clientes. Necesitará su plan profesional, que le da acceso a las funciones de lienzo que usaremos en este tutorial.

paso 1.Crear un formulario de contacto en WordPress

Primero, debe instalar y activar el complemento WPForms. Para obtener más detalles, consulte nuestra guía paso a paso sobre cómo instalar complementos de WordPress.

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

Ingrese un nombre para el formulario de contacto y seleccione la plantilla “Seleccionar formulario de contacto”.

Crear un nuevo formulario de contacto

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

constructor de formularios

Cuando haya terminado de editar el formulario, haga clic en el botón Guardar para guardar los cambios.

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

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

Paso 2.Crear una opción deslizable en OptinMonster

Ahora crearemos una actividad deslizable que mostrará el formulario de contacto que creó en el primer paso.

Primero, debe instalar y activar el complemento OptinMonster. Para obtener más detalles, consulte nuestra guía paso a paso sobre cómo instalar complementos de WordPress.

El complemento 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 desde su cuenta en el sitio web de OptinMonster.

Clave API de OptinMonster

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

nueva elección

Esto lo llevará al sitio web de OptinMonster.

OptinMonster ofrece diferentes tipos de actividades dinámicas. En este tutorial, utilizaremos la actividad Slide In. Continúe y haga clic para seleccionar “Slide In” como su tipo de campaña.

desliza para seleccionar

A continuación, debe elegir una plantilla. OptinMonster proporciona varias plantillas listas para usar, pero debemos elegir Canvas para este tutorial.

Elige una plantilla

Después de elegir una plantilla, se le pedirá un nombre para su campaña. Esto lo ayudará a encontrar fácilmente sus campañas en su tablero OptinMonster.

Ahora OptinMonster cargará su interfaz de generador de actividad.

Constructor OptinMonster

Verá una vista previa en vivo de su campaña a la derecha. Como estamos usando la plantilla de lienzo, ahora está completamente en blanco.

A la izquierda, verás diferentes pestañas. En la sección “Configuración de selección general”, deberá ingresar la URL de su sitio web en la opción “Seleccionar sitio activo”.

A continuación, debe cambiar a la pestaña “Seleccionar”. Aquí puede elegir el color, la altura y el ancho de su optin.

Diseñe su formulario deslizable

Continúe y elija un color que le guste y ajuste el ancho y la altura para que muestre todo su formulario muy bien.

Después de eso, debe desplazarse hacia abajo hasta la sección “HTML personalizado de lienzo” e ingresar el código abreviado de WPForms que copió anteriormente.

Agregar códigos abreviados a HTML personalizado

Ingresar un código abreviado no mostrará inmediatamente su formulario en una campaña deslizante. Eso es porque los códigos abreviados solo funcionan con su propio sitio de WordPress.

Ahora puede hacer clic en el botón “Guardar” en la parte superior para almacenar su configuración, luego haga clic en el botón “Publicar”.

Guarda y publica tu selección

En la siguiente pantalla, debe cambiar el estado de suscripción a Publicado. Esto hará que optin esté disponible para su sitio de WordPress.

Estado de la publicación

Paso 3.Mostrar formulario de contacto Slideout en WordPress

Ahora que ha creado su formulario de contacto y su campaña deslizable, puede mostrarlos en su sitio web.

seguir visitando OptinMonster Páginas en el área de administración de WordPress. Verá su campaña deslizable creada más recientemente aquí.

Editar configuración de salida optin

Deberá hacer clic en el enlace “Editar configuración de salida” para decidir cómo desea que aparezca en su sitio web.

En la siguiente pantalla, asegúrese de que la casilla junto a “¿Habilitar selección de campo?” esté marcada. opciones OptinMonster le permite elegir quién puede ver la suscripción. También puede seleccionar áreas específicas del sitio web para mostrar la opción.

Habilite optin en su sitio web

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

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

Deslice la vista previa del formulario de contacto

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

Puede crear innumerables reglas para mostrar campañas cuando se cumplen ciertas condiciones.

Por ejemplo, puede mostrar un formulario deslizable cuando el usuario se desplaza el 50 % de la página, cuando el usuario está a punto de abandonar la página, etc.

reglas de visualización

Esperamos que este artículo le haya ayudado a aprender cómo agregar un formulario de contacto deslizable en WordPress. También puede consultar nuestra lista de consejos prácticos para aumentar el tráfico a su sitio de WordPress.

Si te gustó este artículo, suscríbete a nuestro canal de YouTube para videos tutoriales de WordPress.También puedes encontrarnos en Gorjeo y Facebook.

Los datos expuestos en este sitio web son de índole informativo, no necesariamente están actualizados. Esta información es una recopilación de información de internet.