Cách chèn thời gian (ngày/tháng/năm) vào website WordPress

★ Đăng bởi BkViet — Cập nhật: 01-01-2022

Chèn thời gian vào website WordPress là cách để làm cho độc giả thường xuyên ghé thăm website của bạn. Khi nhìn thấy website có hiển thị đồng hồ (thứ, ngày tháng năm), họ sẽ xem trên website cho tiện.

Mặc dù chúng ta có thể xem giờ (ngày/tháng/năm) từ chiếc đồng hồ, điện thoại, máy tính. Nhưng nếu không xem được cụ thể, chẳng hạn muốn biết hôm nay là thứ mấy? Cho nên, tích hợp mã code để hiển thị thời gian lên website là một ý tưởng không tồi.

Trong bài viết này, BkViet.Com muốn chia sẻ đoạn mã code HTML để hiển thị thời gian cho website WordPress.

Cách chèn thời gian (ngày tháng năm) vào website WordPress

Hiện nay, đa số website/blog sử dụng mã nguồn WordPress. Cho nên, bài viết này chia sẻ cách thêm thời gian bằng code HTML cho trang web WordPress.

Bước 1: Bạn đăng nhập vào trang quản trị website WordPress.

Bước 2: Sau đó, copy mã code bên dưới đây. Đây là đoạn mã code hiển thị ngày giờ cho WordPress.

<font color="0000FF"><span style="font-size: 13px"><b>&nbsp; XEM NGÀY GIỜ:
<span style="color: 0000FF">
<script language="" type="text/javascript">
//<![CDATA[
<!--   // Array ofmonth Names
<!-- var monthNames = new Array("một","hai","ba","bốn","năm","sáu","bảy","tám","chín","mười","mười một","mười hai"); -->
var monthNames = new Array("1","2","3","4","5","6","7","8","9","10","11","12");
var dayNames = new Array("CN -","THỨ 2 -","THỨ 3 -","THỨ 4 -","THỨ 5 -","THỨ 6 -","THỨ 7 -")
var now = new Date();
thisYear = now.getYear();
thisDay = dayNames[now.getDay()];
if(thisYear < 1900) {thisYear += 1900}; // corrections if Y2K display problem
document.write("" + thisDay +""+""+" "+ now.getDate() + "/" + monthNames[now.getMonth()] + "/" + thisYear);
// -->
//]]>
</script>
</span>
</b></span></font>

Bước 3: Bạn tạo một khối HTML, khi đã nhúng mã code vào khung “HTML Tùy chỉnh”, thì nhấn Đăng bài viết. Sau đó, mở một tab mới của trình duyệt để kiểm tra việc chèn ngày giờ đã thành công hay chưa? Code hiển thị ngày giờ đã đúng như mong muốn chưa?

Trong giao diện của trang chỉnh sửa bài viết/trang của Gutenberg editor, bạn click dấu (+) để thêm một khối mới và chọn HTML. Có thể dùng thanh tìm kiếm để tìm kiếm khối HTML cho nhanh.

chèn ngày giờ vào website

Nếu để ý thì bạn sẽ thấy trên website BkViet.Com vẫn có hiển thị thời gian tại phần Sidebar (ngoài Trang chủ).

Xem bài viết: Cách chèn Fanpage Facebook vào website WordPress.

Dùng code khác để hiển thị ngày giờ cho Website

Có một đoạn mã code HTML khác cũng rất hữu ích, để bạn chèn vào trang web của mình để hiển thị ngày giờ.

<script language="JavaScript">
<!--
// Store the date In avarlable
d = new Date()
dateText = ""
// Get the cuurent day and convert it to the name of the day
dayValue = d.getDay()
if(dayValue == 0)
dateText += "Chủ Nhật"
else if (dayValue == 1)
dateText += "Thứ hai"
else if (dayValue == 2)
dateText += "Thứ Ba"
else if (dayValue == 3)
dateText += "Thứ Tư"
else if (dayValue == 4)
dateText += "Thứ Năm"
else if (dayValue == 5)
dateText += "Thứ Sáu"
else if (dayValue == 6)
dateText += "Thứ Bảy"
// Get the current date; if it's before 2000,add 1900
dateText += ", Ngày " + d.getDate()
monthValue = d.getMonth()
dateText += " "
if (monthValue == 0)
dateText += "Tháng 1"
if (monthValue == 1)
dateText += "Tháng 2"
if (monthValue == 2)
dateText += "Tháng 3"
if (monthValue == 3)
dateText += "Tháng 4­"
if (monthValue == 4)
dateText += "Tháng 5"
if (monthValue == 5)
dateText += "Tháng 6"
if (monthValue == 6)
dateText += "Tháng 7"
if (monthValue == 7)
dateText += "Tháng 8"
if (monthValue == 8)
dateText += "Tháng 9"
if (monthValue == 9)
dateText += "Tháng 10"
if (monthValue == 10)
dateText += "Tháng 11"
if (monthValue == 11)
dateText += "Tháng 12"
// Get the current year; if it's before 2000, add 1900
if (d.getYear() < 2000)
dateText += ", Năm " + (1900 + d.getYear())
else
dateText += ", Năm " + (d.getYear())
// Get the current minutes
minuteValue = d.getMinutes()
if (minuteValue < 10)
minuteValue = "0" + minuteValue
// Get the current hours
hourValue = d.getHours()
// Customize the greeting based on the current hours
if (hourValue >=5 && hourValue <= 10)
{
timeText =  ". Chào buổi sáng và chúc một ngày tốt lành!"
}
else if (hourValue > 10 && hourValue <= 12)
{
timeText =  ". Chào buổi trưa - Bạn ăn cơm chưa vậy?"
}
else if (hourValue >= 13 && hourValue <17)
{
timeText = ". Chào buổi chiều! "
}
else if (hourValue >=17 && hourValue <18)
{
timeText = ". Chào buổi chiều bạn nhé!"
}
else if (hourValue >=18 && hourValue<21)
{
timeText =  ". Chào buổi tối!"
}
else if( hourValue >=21 && hourValue <=24)
{
timeText =  ". Chúc bạn ngủ ngon và có giấc mơ đẹp!"
}
else if(hourValue >=1 && hourValue <5 )
{
timeText = ". Chúc bạn một ngày vui vẻ!"
}
document.write(  dateText + "" + timeText + "")
-->
</script>

Xem bài viết: Cách chống copy bài viết WordPress, hiệu quả nhất.

Tích hợp ngày giờ vào Blogspot (Google Blogger)

Việc tích hợp thời gian (ngày/tháng/năm) vào trang Blogspot như thế nào? Thật ra cũng rất đơn giản, về cơ bản nó không khác so với WordPress là mấy.

Để tích hợp bạn cần vào phần Bố cục của trang Blogspot, sau đó tạo một Tiện ích HTML. Rồi paste một trong những đoạn mã code đã được chia sẻ phía trên.

Kết luận

Như vậy, BkViet.Com đã hướng dẫn bạn cách sử dụng code để tạo đồng hồ hiển thị thứ/ngày/tháng/năm gắn vào website WordPress. Đây là cách không cần dùng Plugin vẫn có thể hiển thị ngày giờ trên trang web.

Tuy nhiên, nếu bạn vẫn muốn sử dụng Plugin để hiển thị ngày giờ thì có thể tìm kiếm từ các Plugin đếm ngược thời gian hoặc các Plugin liên quan về thời gian xem sao. Rất có thể sẽ có được những Plugin phù hợp.

Trong bài viết này mình đã share 2 đoạn mã code giúp hiển thị ngày tháng năm cho WordPress. Tuy nhiên, bạn cũng có thể tìm kiếm thêm rất nhiều mã code (HTML, CSS) khác, để hiển thị ngày giờ độc đáo theo ý muốn của bạn. Chúc các bạn thành công!

Có thể bạn quan tâm: