Cómo mostrar el contenido de tiempo condicionado cuando un temporizador de conteo inverso expira en la división

Mostrar el contenido condicional del tiempo cuando expira un temporizador de conteo inverso puede ser una poderosa herramienta de marketing. Sabemos que aquellos países con recuentos inversos son una de las mejores maneras de estimular a los usuarios a tomar medidas en un sitio web. Son perfectos para presentar ofertas en tiempo limitado para suscripciones, productos, promociones de Black Friday, etc. Pero cuando termina el temporizador, tiene una excelente oportunidad para redirigir a los visitantes con un contenido de contenido condicional. El contenido de tiempo acondicionado es contenido que se muestra (o oculta) en una página web antes o después de una vez y hora. Por lo tanto, es lógico tener un contenido recién preparado para mostrar a los visitantes que se perdieron una oferta o se quedaron sin tiempo.
En este tutorial, le mostraremos cómo mostrar contenido de contenido condicionado cuando un temporizador de conteo inverso expire en la división. Para hacer esto, utilizaremos las nuevas opciones de condición de la división para mostrar un determinado contenido antes y después de una vez y una hora establecida que coincide con un recuento inverso. Antes de que expire el temporizador, los visitantes podrán aprovechar una oferta de tiempo limitado. Después de que expire el temporizador, los visitantes serán invitados a suscribirse a un boletín para recibir notificaciones sobre ofertas. ¡Vamos a empezar! Mirar las zapatillas de deporte es un vistazo rápido al contenido de la condición de tiempo y el temporizador de conteo inverso que construiremos en este tutorial.
Aquí está la sección antes de que expire el temporizador de conteo.

Y aquí está la sección después del vencimiento del cronómetro.

Descargue el aspecto gratuito para poner su mano en los modelos en este tutorial, primero tendrá que descargarlo usando el botón a continuación. Para obtener acceso a la descarga, deberá suscribirse a nuestra lista de correo electrónico diaria utilizando el formulario a continuación. ¡Como nuevo suscriptor, recibirá aún más división de amabilidad y un paquete Divaut gratuito todos los lunes! Si ya está en la lista, simplemente ingrese el correo electrónico a continuación y haga clic en Descargar. No será “read” y no recibirá correos electrónicos adicionales. Determine los archivos
Descargue gratis únase al boletín de Divin y le enviaremos una copia del paquete de diseño de la página de buceo, además de muchos otros recursos, consejos y consejos de forma gratuita. Sigue a ti mismo y te convertirás en una división maestra en el menor tiempo. Si ya está suscrito, ingrese su correo electrónico a continuación y haga clic en Descargar para acceder al paquete de diseño.

Te has suscripto satisfactoriamente. ¡Consulte su correo electrónico para confirmar su suscripción y obtener acceso a Div Free Weekly Layout Div!
Para importar la aparición de la sección en la Biblioteca de la Divica, navegue en la Biblioteca de la Divica.
Haga clic en el botón Importar. En la ventana de portabilidad emergente, seleccione la pestaña Importar y elija el archivo de descarga en su computadora. Luego haga clic en el botón Importar.
Una vez terminado, el aspecto de la sección estará disponible en Divi Builder. Pasemos al tutorial, ¿sí? Qué necesitas para empezar

Para comenzar, deberá hacer lo siguiente:

Si aún no lo ha hecho, instale y active el tema de Div.
Cree una nueva página en WordPress y use Divi Builder para editar la página frontal (generador visual). Elija la opción “Build desde cero”.
Después de eso, tendrá un lienzo vacío para comenzar a diseñar en el Div.
Cómo mostrar el contenido de tiempo acondicionado cuando un temporizador de conteo inverso expira en Diva 1: Cargando la divicidad prefabricada Abra el menú Configuración de la página y luego haga clic en el icono más para mostrar la ventana emergente en la biblioteca. Encuentre el paquete de diseño de la escuela de artesanía y luego haga clic para usar el diseño de la página de inicio de la escuela de artesanía.
Una vez que se haya agregado la apariencia, elimine las primeras 3 secciones de la apariencia, de modo que solo queda el recuento inverso y la sección del sótano. Utilizaremos estas secciones para construir nuestro contenido de tiempo condicionado y los concejales con recuento inverso.
Paso 2: Configurar la fecha y la hora en el temporizador de conteo inverso luego, busque el módulo de temporizador y abra la configuración. En la pestaña Contenido, agregue la fecha y la hora que desea expirar. En este ejemplo, establecimos la fecha el 15 de octubre y a las 12:00. Nota: Usaremos la misma fecha y hora cuando agregaremos el contenido de tiempo condicionado más adelante.

Parte 3: Agregue una condición de tiempo a la sección de visualización antes de la fecha y la hora establecidas para cambiar el contenido siempre que el Consejo de recuento inverso, debemos agregar una condición de tiempo para mostrar la sección completa antes de la fecha y el tiempo establecido anteriormente agregado a El temporizador de conteo inverso.

Para hacer esto, abra la configuración para la sección que contiene el contador con recuento inverso. En la pestaña avanzada, haga clic para agregar una nueva condición de visualización. En el menú desplegable, seleccione la fecha y la hora de la condición. En el mismo cuadro, actualice la configuración de la fecha y la hora, de la siguiente manera:


Asegúrese de que la opción de visualización solo si la fecha actual se establece en E antes.
Elija la fecha y la hora que coincidan con la fecha y la hora agregadas previamente al temporizador con el recuento inverso.

Paso 5: Creación del contenido condicional del tiempo para después del vencimiento del temporizador Ya tenemos una sección de contenido que aparecerá antes de que expire el temporizador. Ahora debemos crear una nueva sección de contenido que se mostrará después de que expire el temporizador. Para hacer esto, duplique la sección con el tiempo. En la nueva sección, puede ajustar la etiqueta del administrador para leer el “recuento inverso” para que no confunda los dos.
Abra la configuración para la sección duplicada y actualice la opción de mostrar la fecha y la hora de mostrar solo si la fecha actual es después. Asegúrese de mantener la fecha y la hora exactamente igual que el temporizador. Queremos que esta sección se muestre después de que expire el temporizador de conteo inverso.
Paso 6: Agregue/actualice el contenido condicionado Una vez que termine el negocio, queremos reflejar esto agregando un título y dándole un gris claro. Para hacer esto, abra la configuración del módulo de texto que contiene el título principal y actualice lo siguiente:

Título 2 Estilo de fuente: Strikethrough

Color Text Título 2: #DDD

Luego abra la configuración para el segundo módulo de texto y cambie el contenido de la siguiente manera: pestaña HTMLSUB Design, actualice el estilo de texto de la siguiente manera:
El peso de la fuente de texto: semi bold
Tamaño de texto de texto: 18px

La altura de la línea de texto: 1.8 Emheading 3 Color de texto: #000

Título 3 Tamaño de texto: 44px (escritorio), 38px (tableta y teléfono)
Luego mueva el temporizador con el recuento en reversa con una posición, incluso debajo del módulo de texto superior con el título principal. Luego borre el módulo de botón en la parte inferior. Reemplazaremos esto con un módulo de opciones de correo electrónico.
Para crear la opción de correo electrónico, mueva (o copie e inserte) el módulo de correo electrónico existente en la sección del pie inferior y colóquela en la sección que contiene el contenido después del módulo de texto inferior
Abra la configuración de inscripción para el correo electrónico y actualice el texto del botón y la información de la cuenta de correo electrónico, según sea necesario.
En la pestaña Diseño, actualice los colores de los campos y los botones, de la siguiente manera:

Fields de color de papel tapiz: #F8F8F8

Color de fondo para el botón: #DE6561

¡El resultado final es! Veamos lo que hicimos.

Establecí el cronómetro para finalizar el 15 de octubre a las 12:00.
Hemos agregado una condición de mostrar la fecha y hora en la primera sección para que se muestre antes del 15 de octubre a las 12:00.
Creamos una nueva sección de contenido con una fecha y hora de condición de pantalla que muestra la sección después del 15 de octubre a las 12:00.

Aquí está la sección antes de que expire el temporizador de conteo.
Y aquí está la sección después del vencimiento del cronómetro.