Hiển thị ngày tháng tương đối trong WordPress: Cập nhật trải nghiệm người dùng
Trong thế giới web hiện đại, tốc độ và tính tiện lợi là chìa khóa để thu hút và giữ chân người dùng. Một khía cạnh thường bị bỏ qua nhưng có ảnh hưởng lớn đến trải nghiệm người dùng là cách hiển thị ngày tháng. Thay vì sử dụng định dạng ngày tháng truyền thống như “15 tháng 7 năm 2023”, việc sử dụng định dạng ngày tháng tương đối, ví dụ như “2 ngày trước” hoặc “hôm qua”, có thể mang lại cảm giác gần gũi và trực quan hơn.
Bài viết này sẽ đi sâu vào cách triển khai hiển thị ngày tháng tương đối trong WordPress, từ những khái niệm cơ bản đến các phương pháp nâng cao, giúp bạn tạo ra một trang web thân thiện và dễ sử dụng hơn.
Ngày tháng tương đối là gì và tại sao nó quan trọng?
Ngày tháng tương đối, hay còn gọi là “time ago strings,” biểu thị thời gian đã trôi qua kể từ một sự kiện nào đó thay vì sử dụng định dạng ngày tháng cụ thể. Ví dụ:
- Thay vì “15 tháng 7 năm 2023”, chúng ta hiển thị “2 ngày trước”.
- Thay vì “1 tháng 8 năm 2023”, chúng ta hiển thị “hôm qua”.
- Thay vì “10 tháng 8 năm 2023”, chúng ta hiển thị “5 ngày trước”.
Tại sao ngày tháng tương đối lại quan trọng?
Ngày tháng tương đối mang lại một số lợi ích quan trọng:
- Tăng cường tính trực quan: Người dùng có thể nhanh chóng nắm bắt được tính thời sự của thông tin mà không cần phải tính toán hoặc so sánh ngày tháng.
- Cải thiện trải nghiệm người dùng: Việc hiển thị ngày tháng một cách thân thiện và dễ hiểu giúp người dùng cảm thấy thoải mái và dễ dàng tương tác với trang web hơn.
- Phù hợp với nội dung thời gian thực: Đối với các trang web tin tức, blog hoặc mạng xã hội, nơi thông tin thường xuyên được cập nhật, ngày tháng tương đối đặc biệt hữu ích vì nó nhấn mạnh tính mới nhất của nội dung.
Triển khai ngày tháng tương đối trong WordPress
Có nhiều cách để triển khai hiển thị ngày tháng tương đối trong WordPress. Chúng ta sẽ khám phá một số phương pháp phổ biến và hiệu quả nhất.
Sử dụng hàm human_time_diff() của WordPress
WordPress cung cấp một hàm tích hợp sẵn có tên là human_time_diff(), giúp bạn dễ dàng chuyển đổi ngày tháng thành định dạng tương đối. Hàm này nhận hai tham số: thời gian bắt đầu (timestamp) và thời gian kết thúc (mặc định là thời gian hiện tại). Nó trả về một chuỗi mô tả khoảng thời gian giữa hai thời điểm đó.
Ví dụ:
<?php
$post_date = get_the_time('U'); // Lấy timestamp của bài viết
$time_ago = human_time_diff( $post_date, time() );
echo $time_ago . ' trước';
?>
Đoạn code trên sẽ lấy timestamp của bài viết hiện tại, so sánh nó với thời gian hiện tại và hiển thị khoảng thời gian đã trôi qua, ví dụ: “2 ngày trước”, “1 tuần trước”, v.v.
Bạn có thể sử dụng đoạn code này trong vòng lặp của WordPress, chẳng hạn như trong tệp index.php, single.php hoặc trong các tệp template khác, để hiển thị ngày tháng tương đối cho các bài viết, bình luận, hoặc bất kỳ loại nội dung nào khác.
Sử dụng Plugin WordPress
Nếu bạn không muốn chỉnh sửa code trực tiếp, bạn có thể sử dụng plugin WordPress để triển khai hiển thị ngày tháng tương đối. Có rất nhiều plugin miễn phí và trả phí có sẵn trên thị trường, mỗi plugin có các tính năng và tùy chọn khác nhau.
Một số plugin phổ biến:
- WP Time Ago: Một plugin đơn giản và dễ sử dụng, cho phép bạn tùy chỉnh định dạng hiển thị ngày tháng tương đối.
- Time Since: Cung cấp nhiều tùy chọn tùy chỉnh hơn, bao gồm khả năng hiển thị ngày tháng tương đối cho các loại nội dung khác nhau.
- Social Warfare: Một plugin mạng xã hội phổ biến cũng bao gồm tính năng hiển thị ngày tháng tương đối.
Việc sử dụng plugin thường là cách dễ nhất và nhanh nhất để triển khai ngày tháng tương đối, đặc biệt nếu bạn không có nhiều kinh nghiệm lập trình.
Tự tạo hàm hiển thị ngày tháng tương đối
Nếu bạn muốn kiểm soát hoàn toàn cách hiển thị ngày tháng tương đối, bạn có thể tự tạo một hàm tùy chỉnh. Điều này cho phép bạn tùy chỉnh các chuỗi hiển thị, ví dụ: thay đổi “1 ngày trước” thành “hôm qua” hoặc “2 ngày trước” thành “hai hôm trước”.
Ví dụ:
<?php
function time_ago( $time ) {
$periods = array("giây", "phút", "giờ", "ngày", "tuần", "tháng", "năm", "thập kỷ");
$lengths = array("60","60","24","7","4.35","12","10");
$now = time();
$difference = $now - $time;
if ($difference < 1) {
return 'vừa xong';
}
for($j = 0; $difference >= $lengths[$j] && $j < count($lengths)-1; $j++) {
$difference /= $lengths[$j];
}
$difference = round($difference);
if ($difference != 1) {
$periods[$j].= "s";
}
return "$difference $periods[$j] trước";
}
// Sử dụng hàm:
$post_date = get_the_time('U');
echo time_ago( $post_date );
?>
Đoạn code trên định nghĩa một hàm time_ago() nhận một timestamp làm tham số. Hàm này tính toán khoảng thời gian đã trôi qua và trả về một chuỗi mô tả khoảng thời gian đó bằng tiếng Việt.
Bạn có thể tùy chỉnh các chuỗi trong mảng $periods để phù hợp với phong cách và ngôn ngữ của trang web của bạn.
Tối ưu hóa hiển thị ngày tháng tương đối
Để đảm bảo rằng việc hiển thị ngày tháng tương đối hoạt động hiệu quả và mang lại trải nghiệm tốt nhất cho người dùng, hãy cân nhắc các yếu tố sau:
- Sử dụng bộ nhớ cache: Việc tính toán khoảng thời gian có thể tốn tài nguyên, đặc biệt nếu trang web của bạn có lượng truy cập lớn. Hãy sử dụng bộ nhớ cache để lưu trữ kết quả và giảm tải cho máy chủ.
- Cập nhật định kỳ: Đảm bảo rằng ngày tháng tương đối được cập nhật định kỳ để phản ánh chính xác thời gian đã trôi qua. Điều này đặc biệt quan trọng đối với các trang web tin tức hoặc blog.
- Chú ý đến ngữ cảnh: Trong một số trường hợp, việc hiển thị ngày tháng cụ thể có thể phù hợp hơn so với ngày tháng tương đối. Ví dụ: đối với các sự kiện lịch sử hoặc các bài viết cũ, việc hiển thị ngày tháng cụ thể có thể cung cấp thông tin chính xác hơn.
Kết luận
Hiển thị ngày tháng tương đối là một cách tuyệt vời để cải thiện trải nghiệm người dùng trên trang web WordPress của bạn. Bằng cách sử dụng các hàm tích hợp sẵn, plugin hoặc tự tạo hàm tùy chỉnh, bạn có thể dễ dàng triển khai tính năng này và tạo ra một trang web thân thiện và dễ sử dụng hơn.
Hãy nhớ rằng việc tối ưu hóa hiệu suất và chú ý đến ngữ cảnh là rất quan trọng để đảm bảo rằng việc hiển thị ngày tháng tương đối mang lại lợi ích thực sự cho người dùng của bạn. Chúc bạn thành công!
