Más

    Cómo agregar un formulario de contacto deslizable en WordPress (tutorial sencillo)

    - Advertisement -

    ¿Quieres 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, entonces una de las mejores formas de hacer crecer su fuente de clientes potenciales es hacer que su formulario de contacto sea más notorio.

    En este artículo, le mostraremos cómo agregar un formulario de contacto deslizable en WordPress sin molestar a sus usuarios.

    Cómo agregar un formulario de contacto deslizable 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 tienen preguntas abandonarán su sitio web sin comunicarse con usted o incluso visitar su página de contacto.

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

    Estas opciones animadas e interactivas llaman la atención sobre el formulario de contacto y permiten a los usuarios completarlo rápidamente sin visitar otra página. Estos formularios aumentan significativamente sus conversiones.

    Dicho esto, echemos un vistazo a cómo crear un formulario de contacto deslizable en WordPress.

    Agregar un formulario de contacto deslizable en WordPress

    Para este tutorial, necesitarás Formularios WP. Es el mejor complemento de formulario de contacto de WordPress del mercado porque es fácil y potente.

    Puedes usar el versión gratuita de WPForms Complemento 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 potente. Le ayuda a convertir en clientes a los visitantes que abandonan el sitio web. Para este tutorial, usaremos el Versión gratuita de OptinMonster.

    Paso 1: crear un formulario de contacto en WordPress

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

    Tras la activación, debe visitar el WPForms » Agregar nuevo página para crear su formulario de contacto. Esto iniciará la interfaz del creador de WPForms.

    Ingrese un nombre para su formulario de contacto en la parte superior de la página. Después de eso, debe pasar el mouse sobre la plantilla «Formulario de contacto simple» y hacer clic en el botón «Usar plantilla».

    Crear un nuevo formulario de contactoCrear un nuevo formulario de contacto

    WPForms creará un nuevo formulario basado en la plantilla 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 desde la columna de la izquierda.

    Creador de formularios WPFormsCreador de formularios WPForms

    Para obtener más detalles, puede consultar nuestra guía sobre cómo crear un formulario de contacto de WordPress.

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

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

    Esto abrirá una ventana emergente que muestra varias formas de incrustar su formulario. Simplemente haga clic en el enlace ‘usar un código corto’ y luego copie el código corto. Lo necesitarás en el siguiente paso.

    Haga clic en el enlace usar un código cortoHaga clic en el enlace usar un código corto

    Paso 2: Crear una opción deslizable en OptinMonster

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

    Necesitas instalar y activar gratis OptinMonster enchufar. Para obtener más detalles, consulte nuestra guía paso a paso sobre cómo instalar un complemento de WordPress.

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

    Tras la activación, el asistente de configuración de OptinMonster se iniciará automáticamente. Esto le permitirá crear una cuenta nueva o conectar una cuenta existente.

    Alternativamente, puedes ir al OptinMonster »Configuración página, donde puede crear o conectar una cuenta.

    OptinMonster Regístrate o inicia sesiónOptinMonster Regístrate o inicia sesión

    Después de crear o conectar su cuenta OptinMonster, puede realizar una nueva suscripción.

    Simplemente navegue hasta el OptinMonster » Campañas página y haga clic en el botón ‘Agregar nuevo’. Si aún no tiene ninguna campaña, también puede hacer clic en el botón «Crear su primera campaña».

    Agregar una nueva campaña en OptinMonsterAgregar una nueva campaña en OptinMonster

    OptinMonster ofrece diferentes tipos de campañas dinámicas.

    Para este tutorial, usaremos la campaña ‘Slide-in’. Continúe y haga clic para seleccionar «Deslizamiento» como su tipo de campaña.

    Seleccione un tipo de campaña y una plantilla en OptinMonsterSeleccione un tipo de campaña y una plantilla en OptinMonster

    A continuación, debe seleccionar la plantilla. OptinMonster ofrece varias plantillas listas para usar.

    Para este tutorial, debes elegir «Lienzo». Puede encontrarlo fácilmente usando la función de búsqueda y luego hacer clic en el botón «Usar plantilla» que aparece cuando pasa el mouse sobre él.

    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 su panel de OptinMonster.

    Nombra tu campaña OptinMonsterNombra tu campaña OptinMonster

    A continuación, haga clic en el botón «Comenzar a construir». Ahora, OptinMonster cargará su interfaz de creación de campañas. Verá una vista previa en vivo de su campaña a la derecha.

    Verás los diferentes bloques en el menú de tu izquierda. Debes encontrar el bloque WPForms y arrastrarlo y soltarlo en tu plantilla.

    Arrastrando el bloque WPForms en OptinMonsterArrastrando el bloque WPForms en OptinMonster

    Ahora, el bloque WPForms aparecerá en la plantilla y verá su configuración a la izquierda.

    Deberá hacer clic en el menú desplegable ‘Selección de formulario’ en la configuración del bloque en el menú de la izquierda y seleccionar la opción ‘Agregar código corto manualmente’.

    Esto le permitirá pegar el código corto de su formulario de contacto de WPForms en el bloque. Lo copiaste anteriormente en el tutorial.

    Pegue el código corto para su formulario WPCode en OptinMonsterPegue el código corto para su formulario WPCode en OptinMonster

    Ahora puede eliminar o personalizar los otros bloques del formulario.

    Por ejemplo, puedes cambiar la imagen haciendo clic en ella y usando la configuración de la izquierda. O puedes eliminarlo simplemente colocando el mouse sobre el bloque y haciendo clic en el ícono de la Papelera.

    Eliminar bloques en OptinMonsterEliminar bloques en OptinMonster

    Para este tutorial, eliminaremos los otros bloques de la opción, dejando solo el bloque WPForms.

    Si lo desea, también puede hacer clic en el fondo y elegir un color, degradado o imagen para la opción en el panel de configuración de la izquierda.

    Cambiar el color de fondo en OptinMonsterCambiar el color de fondo en OptinMonster

    A continuación, debe hacer clic en la pestaña «Reglas de visualización» en la parte superior de la página para configurar cuándo y cómo se mostrará la opción.

    Deberías mirar la pestaña «Condiciones» en la parte inferior de la pantalla. Aquí, la configuración predeterminada mostrará la opción de suscripción en cualquier página después de 5 segundos. Esto debería funcionar para la mayoría de los sitios web.

    Condiciones de configuración de pantalla de OptinMonsterCondiciones de configuración de pantalla de OptinMonster

    A continuación, debes hacer clic en la pestaña «Acciones» en la parte inferior de la página.

    De forma predeterminada, no hay animación ni sonido cuando se muestra la opción. Si lo desea, puede seleccionar una opción del menú desplegable «Animar con MonsterEffects», como «Deslizar hacia adentro (izquierda)».

    Acciones de reglas de visualización de OptinMonsterAcciones de reglas de visualización de OptinMonster

    Cuando haya terminado de configurar las Reglas de visualización, debe 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».

    En la siguiente pantalla, debe cambiar el estado de publicación a «Publicar». Esto hará que la opción esté disponible en su blog o sitio web de WordPress.

    Cambiar el estado de publicación en OptinMonsterCambiar el estado de publicación en OptinMonster

    Paso 3: Mostrar el formulario de contacto deslizable en WordPress

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

    Puede cerrar la página Estado de publicación haciendo clic en el ícono ‘X’ en la parte superior derecha. Ahora debería ver una página que le permite configurar la ‘Configuración de salida de WordPress’ y la ‘Visibilidad y estado’ de la opción.

    Cuando se desplaza hacia abajo en la sección «Visibilidad y estado», normalmente querrá que «Todos los visitantes y usuarios conectados» vean la campaña. Sin embargo, hay opciones para ‘Sólo visitantes’ y ‘Sólo usuarios conectados’.

    Configuración de visibilidad y estado en OptinMonsterConfiguración de visibilidad y estado en OptinMonster

    A continuación, debe seleccionar «Publicado» en el menú desplegable Estado. Una vez que haya hecho eso, debe hacer clic en el botón «Guardar cambios» para almacenar su configuración.

    Ahora puede visitar su sitio web para ver el formulario de contacto deslizable en acción.

    Vista previa deslizable del formulario de contactoVista previa deslizable del formulario de contacto

    Guías de expertos para usar formularios de WordPress

    Ahora que sabe cómo crear un formulario de contacto deslizable, es posible que desee ver algunas de nuestras otras guías sobre formularios de WordPress:

    Esperamos que este artículo le haya ayudado a aprender cómo agregar un formulario de contacto deslizable en WordPress. Es posible que también desee ver nuestra guía sobre cómo generar tráfico a su sitio de WordPress y nuestra selección experta de los mejores complementos de encuestas de WordPress.

    Fuente: Cómo agregar un formulario de contacto deslizable en WordPress (tutorial sencillo)

    Populares

    Más de esta categoría

    DEJA UNA RESPUESTA

    Por favor ingrese su comentario!
    Por favor ingrese su nombre aquí

    Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.