Adding Clock with Date and Time Widget in Blogger Blog

Adding Clock with Date 

So follow the below steps to install this on your blog.

Before following below steps kindly do backup your blog template for any kind of errror and easy restoration.

Adding Clock with Date and Time Widget on Blogger

Step 1: Go to Blogger Dashboard.

Step 2: Go to Layout section.

Step 3: Click on Add a Gadget. A popup box will appear.

Step 4: Now Click on HTML/JavaScript.

Step 5: Copy the below Codes(Css, HTML, JavaScript) and paste it in the content section and leave the title blank.

Let's Do a Demo Here...!

View Demo

<style>.ta-time{text-align:center;}
#ta-hour{font-weight:400;display:block;font-size:30px;margin: 0 0 5px;letter-spacing:5px;}</style>

<div class="ta-time">
  <span id="ta-hour"></span>
  <span id="ta-date"></span>
</div>

<script>var myVar = setInterval(function() {
    myTimer()
}, 1000);
function myTimer() {
    var d = new Date();
    var t = d.toLocaleTimeString();
    document.getElementById("ta-hour").innerHTML = t;
}
n = new Date();
if (n.getTimezoneOffset() == 0) t = n.getTime() + (7 * 60 * 60 * 1000);
else t = n.getTime();
n.setTime(t);
var dn = new Array("Sunday", "Monday", "Tuesday", "Wednesday", "Thrusday", "Friday", "Saturday");
d = n.getDay();
m = n.getMonth() + 1;
y = n.getFullYear()
var date = dn[d] + ", " + (n.getDate() < 10 ? "0" : "") + n.getDate() + "/" + (m < 10 ? "0" : "") + m + "/" + y;
document.getElementById("ta-date").innerHTML = date;</script>

Step 6: Now click on the Save button.

Now you have successfully installed the date and time widget on your blog.

Conclusion

This is all about making a Contact Form using Telegram Bot API. I hope you enjoy this article. Please do share this article. And if you are facing problem in any section or you have any question then ask us in comment box.

Copyright ©

ᗩᗷᗪᑌᒪᒪᗩᕼ ᑕᗝᗪᗴᗪ