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.

    鉂 Tambi茅n te interesa:馃摲 Como moderar los registros de nuevos usuarios en WordPressC贸mo moderar los registros de nuevos usuarios en WordPress

    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

    鉂 Tambi茅n te interesa:馃摲 Como habilitar la busqueda por SKU de producto en WooCommerceC贸mo habilitar la b煤squeda por SKU de producto en WooCommerce

    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.

    鉂 Tambi茅n te interesa:馃摲 Como agregar un icono de enlace externo en su sitioC贸mo agregar un 铆cono de enlace externo en su sitio 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.