How to add real-time Greetings massege in post

 How to add real-time Greetings massege to Your Blogger Blog

Greeting your readers based on the time of day can personalize their experience on your blog. With a few lines of HTML, CSS, and JavaScript, you can add dynamic greetings to your Blogger blog. Here’s how:

Step 1: Open your Blogger Dashboard

Log in to your Blogger account and navigate to the blog where you want to add dynamic greetings.

Step 2: Access the layout section 

Now all theme have a AdSense add widget above blog post widget now you need to paste these whole code in this AdSense ad (HTML javascript widget) you can paste both 1. AdSense ad code and this script too now paste all code and save it 

<p id="samay"></p>
<script>
let date = new Date();
let hour = date.getHours();
let heading = document.querySelector("#samay");
if (hour > 5 && hour < 12) {
  heading.innerText = "good morning";
}
else if (hour > 11 && hour < 16){
  heading.innerText = "good afternoon";   
}
else if (hour > 15 && hour < 20){
  heading.innerText = "good evening";   
}
else {
  heading.innerText = "good night";  
}
console.log(hour);
document.location
</script>
<style>
    #samay{
        display: flex;
        justify-content: center;
        text-align: center;
        text-transform: capitalize;
        font-size: 16px;
        max-width: 150px;
        margin: auto;
        padding: 8px;
        font-family:open sans;
        border-radius: 20px;
        border: 1px solid #ccc; 
        color: black;}
</style>

  
 

After that 

Visit your site to see the dynamic greetings widget. If everything looks good, then enjoy if not showing you can paste whole code above the <data:post.body> or above <entry-title> tag to see same result 

That's it! Now your Blogger blog will greet your readers with a personalized message based on the time of day.