Es difícil imaginar Internet sin formularios de suscripción hoy en día. Los usamos en nuestro sitio web por dos razones principales en particular; conseguir suscriptores o generar leads.
Encontrar la forma correcta de acercarse a su audiencia con formularios de suscripción puede ser un verdadero desafío. Algunas personas quieren ir a lo seguro y no quieren que sus visitantes sientan que están ‘invadiendo’ su burbuja de Internet con formularios de suscripción no deseados. Por lo general, ese es el momento en que las personas eligen un formulario de suscripción que aparece después de hacer clic en algún lugar específico del sitio web, o cómo lo llamamos; ‘Activar al hacer clic’.
En el tutorial de hoy, le mostraremos exactamente cómo puede utilizar estos activadores de clic en algunas de las partes más importantes de su sitio web. Una vez que hayas logrado incluir la opción de hacer clic en desencadenar, no olvides medir los resultados que te brinda para ver si te ayuda a progresar.
Básicamente, puede hacer que cualquier cosa en su sitio web active un formulario de suscripción. Pero usarlo en los lugares equivocados puede volverse rápidamente en tu contra. La gente está acostumbrada a hacer clic al azar en un sitio web todo el tiempo; cuando están leyendo algo, por ejemplo. O incluso cuando están mirando a su alrededor, a menudo hacen clic en algún lugar del sitio web sin un propósito.
Ahora imagina que eres el visitante; con cada clic aleatorio, es posible que se enfrente a un formulario de suscripción inesperado debido a una acción que realizó sin un propósito. Sin duda, eso tendrá un efecto negativo porque, en ese momento, sentirá que no tiene ningún control cuando visite ese sitio web.
Sin embargo, colocar un formulario de suscripción de activadores de clics en lugares donde las personas eligen voluntariamente hacer clic o no hacer clic (como botones o llamadas a la acción en general) es otra historia. Estamos familiarizados con hacer clic en un CTA (llamado a la acción), por lo que no nos asusta. Estamos eligiendo deliberadamente ver qué paso es el siguiente. Si no tenemos curiosidad por ver qué hay detrás de un CTA, simplemente no haremos clic. Pero si queremos, podemos. Esta ‘elección’ que tienen los visitantes los hace sentir más cómodos cuando finalmente aparece un formulario de suscripción y aumenta las posibilidades de que realmente se suscriban a su boletín informativo.
Suscríbete a nuestro canal de Youtube
Cree su formulario de suscripción
Hacer que la gente haga clic en tu CTA es una forma de arte. Lograr que las personas se suscriban o se conviertan en líderes a través de un formulario de suscripción después de hacer clic en su CTA es la apreciación del arte. Tienes que experimentar y encontrar la forma correcta de acercarte a tu público objetivo para que ambas partes queden complacidas al final.
Le mostraremos cómo activar un clic para dos botones diferentes en su sitio web donde puede beneficiarse de ese tipo de formulario de suscripción; el módulo de botones y el botón de encabezado de ancho completo. La forma de trabajar es la misma, pero verlo en diferentes escenarios puede ayudarlo a comprender la lógica. Después de eso, también puede usarlo para otros módulos.
Ahora, antes de que le mostremos cómo vincular los formularios de suscripción a una CTA, vamos a revisar la configuración de un formulario de suscripción. En esta publicación, no le proporcionaremos ningún diseño específico, sino solo la lógica. Hay algunas configuraciones que son necesarias para asegurarse de que el activador de clic funcione.
Elija el tipo de formulario de suscripción
Al agregar un nuevo formulario de suscripción, la primera opción a la que se enfrentará es el tipo de formulario de suscripción que desea utilizar. Para crear el efecto de activación al hacer clic, puede usar dos de los tipos: la ventana emergente y la ventana emergente. El que probablemente elegirá es la ventana emergente. Pero si quieres ser un poco más sutil, también puedes usar el fly in.
Pestaña Configurar
Comience por nombrar su formulario de suscripción en la pestaña Configuración del formulario de suscripción que está creando. A continuación, conecte su formulario a un proveedor de correo electrónico. Sin el proveedor de correo electrónico, la cuenta y la lista de correo electrónico, el formulario estará inactivo.
Ficha Diseño
Dentro de la pestaña Diseño, puede diseñar el formulario que va a utilizar. En este post, no vamos a hacer eso. Vamos a seleccionar un formulario de suscripción estándar sin modificaciones solo para ver si funciona. Más tarde, siempre puede volver al formulario de suscripción que creó para realizar cambios.
Pestaña Configuración de pantalla
Esta es la pestaña en la que vincularemos el formulario de suscripción a uno de los botones. Para asegurarse de que los resultados funcionen, debe asegurarse de que el formulario de suscripción se pueda mostrar en la página en la que desea que funcione. Si va a utilizar el mismo formulario en todo el sitio web, puede habilitar fácilmente el formulario para todo, como se muestra en la imagen a continuación.
Además, queremos utilizar el formulario de suscripción para activadores solo al hacer clic. Es por eso que vamos a deshabilitar todas las demás opciones y solo habilitaremos la opción ‘Activar al hacer clic’. Verás que el campo Selector de CSS aparecerá inmediatamente. Más adelante en esta publicación, usaremos este campo para vincular nuestros botones al formulario de suscripción que estamos creando. Deje esta página abierta en su pestaña para que pueda acceder a ella de inmediato más adelante.
Empecemos
Aunque la lógica detrás de agregar un formulario de activación de clic en diferentes módulos es la misma, lo explicaremos en dos ejemplos; el módulo de botones y el botón de encabezado de ancho completo. Sin comprender la lógica, simplemente puede seguir los pasos de esta publicación para que esto suceda.
Sin embargo, si desea que el disparador de clic funcione en lugares distintos a los que se explican a continuación, deberá realizar una ligera modificación. Lo único que va a cambiar es la clase que estamos usando, ya que esta siempre es diferente. Si desea que este desencadenante de clics suceda en cualquier otra parte de su sitio web, simplemente siga los mismos pasos que le mostraremos a continuación y cambie la clase de CSS de acuerdo con lo que esté utilizando.
El primer ejemplo por el que lo guiaremos es el módulo de botones. Lo bueno de crear un activador de clic para un módulo de botones es que las posibilidades son infinitas. Puede crear cualquier tipo de sección o fila que contenga un módulo de botones y ser tan creativo como desee.
Sin más, comencemos a crear un activador de clic para el botón. Tenemos dos formas de hacer esto; usando la clase CSS o creando una ID CSS asignada al módulo.
Mediante el uso de la clase CSS
Abra la página o cree la página en la que desea que funcione el activador de clic. A continuación, agregue un módulo de botones o abra la configuración del módulo de botones del botón en el que desea que funcione.
Vaya a la pestaña Avanzado y desplácese hacia abajo. Haga clic en el campo Elemento principal y observe cómo aparece la clase CSS asignada al botón. Copie la clase CSS, la necesitaremos de inmediato.
Luego, vaya a la pestaña Configuración de pantalla del formulario de suscripción que está creando. En la parte anterior, ya te mostramos dónde sucederá la magia. Habilitamos ‘Activar al hacer clic’ y deshabilitamos todas las demás posibilidades mencionadas. Justo debajo de ‘Trick On Click’, tendrás que pegar la siguiente línea:
|
01
|
*.et_pb_button_0.et_pb_button.et_pb_module |
Como puede ver, es simplemente un símbolo ‘*’ seguido de la clase que copió justo antes de este paso.
Al usar este método, hay una cosa que debe tener en cuenta; la clase CSS del botón difiere para cada botón en la misma página, pero tan pronto como agregue un botón a otra página, comenzará desde ‘0’ de inmediato. Esto significa que cada primer módulo de botón en cada página activará el formulario de suscripción si su formulario de suscripción está disponible para todas las páginas y publicaciones.
Si desea evitar esto, puede hacer que el desencadenador de clic suceda a través de una ID de CSS. Pero en los casos en los que asigne una ID de CSS específica al módulo completo, la forma más fácil de hacerlo realidad es a través de la clase CSS.
Puede determinar en qué páginas puede aparecer un determinado formulario de suscripción en la Configuración de visualización de su formulario de suscripción. Al hacerlo, tendrá el control y sabrá exactamente en qué páginas aparecerá el formulario de suscripción después de hacer clic en el botón que se le ha asignado.
Usando CSS ID
El segundo método es mediante el uso de una ID de CSS. Abra el Módulo de botones, vaya a la pestaña Avanzado y asígnele una ID de CSS. En este caso, usaremos ‘emergente’.
Continúe yendo a la pestaña Contenido del Módulo de botones y escribiendo el símbolo «#» seguido de lo que desee. Al hacer esto, se asegurará de que el visitante permanezca en el mismo lugar de la página mientras hace clic en el botón.
Continuando, regrese a la configuración de su formulario de suscripción y agregue «a # popup» al campo Activar al hacer clic. Siempre debe escribir «a #» seguido de la ID de CSS que asignó al módulo de botones.
|
01
|
a#popup |
El otro ejemplo en el que le mostraremos cómo hacer un formulario de activación Activar al hacer clic es el Botón de encabezado de ancho completo. La única posibilidad que tenemos aquí es usar la clase botón CSS. No podemos asignar una ID de CSS a través del constructor Divi al botón en particular.
Mediante el uso de la clase CSS
Cree un encabezado de ancho completo o abra el encabezado de ancho completo en el que desee agregar el formulario de suscripción Activar al hacer clic. Vaya a la pestaña Avanzado del encabezado de ancho completo y desplácese hacia abajo hasta que encuentre el ‘Botón uno’. Haga clic en el campo y copie la clase CSS asignada al botón.
Luego, vaya a la pestaña Contenido y escriba el símbolo «#» seguido de cualquier otra cosa en el campo URL del Botón #1.
Finalmente, vaya a la pestaña Configuración de pantalla de su suscripción y escriba el símbolo «*» seguido de la clase que copió asignada al botón.
|
01
|
*.et_pb_fullwidth_header_0 .header-content-container .header-content .et_pb_button_one.et_pb_button |
Pensamientos finales
Este tutorial debería ayudarlo a comenzar con los activadores al hacer clic y el formulario de suscripción de Bloom . Incluso podría hacerle reconsiderar la forma en que actualmente está tratando de obtener suscriptores o clientes potenciales. Si tiene alguna pregunta o sugerencia; no dude en dejar un comentario en la sección de comentarios a continuación. Y mientras estás allí; díganos en qué casos usaría el formulario de suscripción Trigger On Click.
¡Asegúrate de suscribirte a nuestro boletín de correo electrónico y canal de YouTube para que nunca te pierdas un gran anuncio, un consejo útil o un obsequio de Divi!
Imagen destacada de BarsRsind / shutterstock.com