Saluda a tus visitantes con un mensaje dinámico de buenos días, buenas tardes y buenas noches con divi y wordpress

Hola bienvenido (o bienvenida) a otro tutorial más de OV DIVI.

En este tutorial te enseñaré a crear un mensaje dinámico en tu sitio, es decir, el usuario al visitar tu sitio web verá un mensaje de bienvenida dependiendo de la hora y día en que visita tu sitio web.

Esto lo lograremos con un fragmento de código JavaScript, en realidad es un simple script que lo que hace es detectar el día y hora de la computadora del visitante y dependiendo de eso mostrar un mensaje, en este caso, de bienvenida.

El código que necesitamos para un saludo dependiendo la hora es el siguiente:

<script>
    var myDate = new Date();
    var hrs = myDate.getHours();

    var saludar;

    if (hrs < 12)
        saludar = 'Buenos días';
    else if (hrs >= 12 && hrs <= 18)
        saludar = 'Buenas tardes';
    else if (hrs >= 18 && hrs <= 24)
        saludar = 'Buenas noches';

    document.getElementById('saludo').innerHTML = saludar;
</script> 

El código que necesitamos para un saludo dependiendo el día es el siguiente:

<script>
window.onload = ( function() {        
    mostrarDia();
     })(); 

function mostrarDia() {
  var d = new Date();
  var weekday = new Array(7);
  weekday[0] = "domingo";
  weekday[1] = "lunes";
  weekday[2] = "martes";
  weekday[3] = "miércoles";
  weekday[4] = "jueves";
  weekday[5] = "viernes";
  weekday[6] = "sábado";

  var n = weekday[d.getDay()];
  document.getElementById("dia").innerHTML = n;
}
</script>

Sí colocas los códigos anteriores en un módulo de código al final de tu sitio web y pegas este otro fragmento en un módulo de texto… ¡Verás la magia!

<h1><span id="saludo">Buenos días</span>. 
Hoy será un buen <span id="dia">día</span>...</h1>