Seleccionar página

En este post quiero explicar cómo podemos crear el lanzamiento de una página web con un contador utilizando las herramientas que nos aporta el tema DIVI de Elegant Themes y sin utilizar ningún plugin.

Vamos a trabajar con el tema DIVI el más potente y flexible de los temas que ofrece Elegant Themes para WordPress.

Cómo habréis visto en algunas páginas web a veces se pone un contador regresivo que cuenta días, horas, minutos y segundos hasta una determinada fecha del calendario en la cual se hace oficial el lanzamiento de una página web. En ese periodo se realizan diferentes promociones en redes sociales para aumentar la expectación. Finalmente en el día y hora señalada se realiza el lanzamiento quitando el contador y mostrando públicamente la web.

 

DESCUENTO DIVI

1.- ¿Qué queremos conseguir en la página web?

a.- Crear una página de inicio con un contador regresivo que marque los días, horas, minutos y segundos para el lanzamiento público de la página web.

b.- Que se pueda acceder al Front Office de la página web por parte de los miembros del equipo para hacer los últimos retoques y compartir opiniones sobre el desarrollo de la misma. El público general sólo debe poder acceder al contador.

c.- Ya sabemos que la utilización de plugins ralentiza las páginas web por lo que vamos a intentar no utilizar ningún plugin para este cometido.

 

2.- ¿Cómo lo haremos?

Tenemos creada una página web con 6 pestañas: Inicio, nosotros, servicios, equipo, contacto y blog.

La página de inicio está puesta como home como podemos ver en «Ajustes > Lectura» del panel de administración de nuestra instalación de WordPress.

 

Algunos de los enlaces en este post son enlaces de afiliado. Es decir, son recomendaciones que hago y por las que recibiré una comisión en caso de compra

 

En la imagen podemos ver cómo está configurado que la página inicial o home que muestra WordPress sea la página denominada INICIO.

 

configuracion-pagina-inicio

 

Lo que vamos a hacer es crear una página nueva que vamos a llamar “contador” y esta será la página que pondremos como home o página inicial de la web.

Por lo que si escribimos la url del sitio web “www.miweb.es” nos aparecerá el contador. Si por el contrario escribimos “www.miweb.es/inicio” accederemos a la que será la página inicial cuando llegue el momento del lanzamiento de la web y quitemos la página del contador.

 

3.- Creamos la página contador.

Queremos que hasta que no llegue el día, hora, minuto y segundo de lanzamiento de la página web aparezca un contador regresivo con un fondo. Lógicamente esta página no puede tener ningún tipo de menú ni enlaces a ninguna otra parte de la web.

 

Contador en página web con el tema Divi de WordPress Elegant Themes

 

Para crear la página de contador con DIVI vamos a “Páginas > añadir nueva” y pulsamos el botón de “use page builder” para activar el constructor de páginas de DIVI.

En el bloque “Atributos de página” opción “plantilla” tenemos que seleccionar “Blank Pagepara utilizar una plantilla vacía. Es decir, una plantilla sin encabezamiento (logo y menú).

En el page builder vamos a añadir una sección pulsando el botón “Add section”. En la sección añadiremos una imagen como background de 1280 x 1280 px. Para ello, tras añadir la sección pulsamos el botón formado por tres rayas horizontales en la solapa azul que aparece en el lateral izquierdo del bloque de sección. Al desplegarse los elementos de configuración pulsaremos el botón “Upload an image” en el apartado “Background Image” para subir la imagen de fondo de la página web del contador.

 

Colocar fondo en la página web del contador hecho con DIVI WordPress

 

Dentro de dicha sección vamos a colocar tres bloques:

a.- Bloque de texto (text): en este bloque escribiremos un texto que aparecerá por encima del contador.

b.- Bloque de cuenta atrás (Countdown Timer): este bloque mostrará el contador de cuenta atrás para el lanzamiento de la web. Para configurar este bloque hay que pulsar en las tres rayas horizontales que aparecen a la izquierda del bloque. En la configuración solamente habrá que incluir la fecha y hora del final de la cuenta atrás rellenando la etiqueta “Countdown To”.

c.- Bloque de texto (text): en este bloque pondremos saltos de línea para que la imagen de fondo cubra toda la pantalla. Los saltos de línea los incluiremos introduciendo el texto “ ” varias veces con el editor de texto pero con la pestaña “visual” no activada.

 

bloque texto page builder divi

 

Realizado todo esto ponemos a la página el nombre “contador” y la publicamos.

Bloque añadidos con el page builder de DIVI elegant Themes

 

4.- Ponemos la página contador como home

Para que al acceder a la url de la página web aparezca el contador en vez de la página de inicio actual debemos ir a “Ajustes > Lectura” en el menú lateral izquierdo de WordPress. En la opción que dice “Página frontal muestra” pondremos el check box en “Una página estática (seleccionar abajo)” y en “Página inicial” elegiremos en el desplegable la página con el nombre “contador”. Guardamos cambios.

 

5.- Trabajo terminado

A partir de ahora si alguien accede a la url de la página web, por ejemplo: “www.miweb.es“ verá la página denominada contador que hemos creado con una cuenta atrás hacia el día y hora en que se producirá el lanzamiento oficial de la página web. Pero si somos un miembro del equipo y queremos acceder a la web para ver las últimas modificaciones que se han realizado podremos hacerlo a través de la url “www.miweb.es/inicio “accediendo a la que será la futura página de inicio del sitio web y desde aquí a todas las páginas interiores del sitio.

Hemos creado una página de lanzamiento y cuenta atrás sin haber tenido que utilizar ningún plugin de mantenimiento o contador gracias a la potencia y flexibilidad del tema DIVI de Elegant Themes.

 

Compártelo ya!!
Curso gratis de wordpress y divi

▷LLÉVATE EL CURSO WORDPRESS Y DIVI GRATIS

Aprende a crear una página web con Wordpress y Divi

22 vídeos gratis

Consentimiento

Vé a tu buzón de correo y confirma la suscripción. Si no encuentras el correo de confirmación mira en la carpeta de SPAM.

Abrir chat
¿Dudas sobre mis cursos o servicios?
🙋🏻‍♂️** ¿Alguna duda sobre mis cursos o servicios? Soy Joaquín, cuéntame y te ayudo encantado
**Accede a TODOS mis cursos por solo 10 €/mes desde cursotiendaonline.com