Hiển thị ngày tháng tương đối trong WordPress
Hiển thị Ngày Tháng Tương Đối trong WordPress
Giới thiệu về Ngày Tháng Tương Đối (Relative Dates)
Trong WordPress, mặc định, ngày tháng của bài viết, bình luận và các nội dung khác được hiển thị theo một định dạng cụ thể, ví dụ: “Ngày 15 tháng 10 năm 2023”. Tuy nhiên, đôi khi người dùng muốn hiển thị ngày tháng một cách tương đối, ví dụ: “1 giờ trước”, “2 ngày trước”, hoặc “Tuần trước”. Điều này giúp người đọc dễ dàng nắm bắt được tính thời sự của thông tin, đặc biệt trên các trang tin tức hoặc blog.
Ngày tháng tương đối mang lại trải nghiệm người dùng tốt hơn bằng cách:
- Tăng cường tính thời sự và liên quan của nội dung.
- Giúp người đọc nhanh chóng đánh giá độ mới của thông tin.
- Tạo cảm giác thân thiện và gần gũi hơn.
Có nhiều cách để hiển thị ngày tháng tương đối trong WordPress, từ việc sử dụng plugin đến chỉnh sửa trực tiếp code theme. Bài viết này sẽ hướng dẫn bạn chi tiết các phương pháp này.
Sử dụng Plugin để Hiển thị Ngày Tháng Tương Đối
Cách đơn giản nhất để hiển thị ngày tháng tương đối là sử dụng plugin. Có rất nhiều plugin miễn phí và trả phí có thể giúp bạn thực hiện điều này một cách dễ dàng. Một số plugin phổ biến bao gồm:
- WP Last Modified Info: Plugin này cho phép bạn hiển thị ngày chỉnh sửa cuối cùng của bài viết, cả theo định dạng tuyệt đối và tương đối.
- Relative Date: Plugin này chỉ tập trung vào việc thay đổi định dạng ngày tháng sang tương đối.
- PublishPress Revisions: Mặc dù chủ yếu tập trung vào quản lý các bản nháp và chỉnh sửa, plugin này cũng cung cấp tính năng hiển thị ngày tháng tương đối.
Để cài đặt và kích hoạt plugin, bạn thực hiện theo các bước sau:
- Đăng nhập vào trang quản trị WordPress.
- Đi đến mục “Plugins” -> “Add New”.
- Tìm kiếm plugin bạn muốn sử dụng.
- Nhấn “Install Now” và sau đó “Activate”.
- Cấu hình các cài đặt của plugin (nếu có) để phù hợp với nhu cầu của bạn.
Sau khi kích hoạt plugin, bạn có thể cần phải tùy chỉnh các cài đặt để đảm bảo ngày tháng tương đối được hiển thị chính xác trên trang web của bạn. Hầu hết các plugin đều cung cấp các tùy chọn để bạn chọn các đơn vị thời gian (ví dụ: phút, giờ, ngày, tuần, tháng, năm) và định dạng hiển thị.
Chỉnh sửa Theme để Hiển thị Ngày Tháng Tương Đối
Nếu bạn muốn có nhiều quyền kiểm soát hơn đối với cách hiển thị ngày tháng tương đối, hoặc nếu bạn muốn tránh việc sử dụng quá nhiều plugin, bạn có thể chỉnh sửa trực tiếp code theme của mình. Cách này đòi hỏi bạn có kiến thức cơ bản về PHP và WordPress theme development.
Quan trọng: Trước khi thực hiện bất kỳ thay đổi nào đối với theme, hãy tạo một bản sao lưu (backup) để tránh mất dữ liệu nếu có sự cố xảy ra. Bạn cũng nên sử dụng một theme con (child theme) để tránh các thay đổi của bạn bị ghi đè khi cập nhật theme chính.
Bước 1: Xác định Vị trí Hiển Thị Ngày Tháng
Đầu tiên, bạn cần xác định vị trí trong theme nơi ngày tháng được hiển thị. Thông thường, ngày tháng được hiển thị trong các file như single.php (cho trang bài viết), index.php (cho trang chủ), archive.php (cho trang lưu trữ), và comments.php (cho bình luận). Bạn có thể sử dụng công cụ “Inspect Element” của trình duyệt để tìm ra file và dòng code chịu trách nhiệm hiển thị ngày tháng.
Bước 2: Sử dụng Hàm human_time_diff()
WordPress cung cấp một hàm tích hợp sẵn là human_time_diff(), có thể được sử dụng để hiển thị ngày tháng tương đối. Hàm này nhận vào hai tham số: thời gian gốc (timestamp) và thời gian so sánh (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_diff = human_time_diff( $post_date, time() ); // Tính khoảng thời gian tương đối
echo $time_diff . ' trước'; // Hiển thị kết quả
?>
Đoạn code trên sẽ lấy timestamp của bài viết bằng hàm get_the_time('U'), sau đó sử dụng hàm human_time_diff() để tính khoảng thời gian tương đối so với thời gian hiện tại. Cuối cùng, nó hiển thị kết quả kèm theo chữ “trước”.
Bước 3: Tùy chỉnh Định dạng Hiển thị
Bạn có thể tùy chỉnh định dạng hiển thị bằng cách điều chỉnh chuỗi được in ra sau khi gọi hàm human_time_diff(). Ví dụ, bạn có thể thêm các điều kiện để hiển thị các thông báo khác nhau tùy thuộc vào khoảng thời gian:
<?php
$post_date = get_the_time('U');
$time_diff = human_time_diff( $post_date, time() );
if ($time_diff == '1 second') {
echo 'Vừa xong';
} elseif ($time_diff == '1 minute') {
echo '1 phút trước';
} elseif (strpos($time_diff, 'minute') !== false) {
echo str_replace('minutes', 'phút', $time_diff) . ' trước';
} elseif ($time_diff == '1 hour') {
echo '1 giờ trước';
} elseif (strpos($time_diff, 'hour') !== false) {
echo str_replace('hours', 'giờ', $time_diff) . ' trước';
} elseif ($time_diff == '1 day') {
echo 'Hôm qua';
} else {
echo get_the_date(); // Nếu quá 1 ngày, hiển thị ngày tháng thông thường
}
?>
Đoạn code trên sẽ hiển thị “Vừa xong” nếu thời gian chỉ mới 1 giây, “1 phút trước” nếu là 1 phút, và tương tự cho các khoảng thời gian khác. Nếu thời gian quá 1 ngày, nó sẽ hiển thị ngày tháng theo định dạng mặc định của theme.
Bước 4: Thêm vào Theme Con
Sau khi đã chỉnh sửa code, hãy sao chép các file đã chỉnh sửa vào theme con của bạn. Điều này đảm bảo rằng các thay đổi của bạn sẽ không bị ghi đè khi cập nhật theme chính.
Các Lựa Chọn Tùy Chỉnh Nâng Cao
Ngoài các phương pháp cơ bản trên, bạn có thể tùy chỉnh thêm để đáp ứng các yêu cầu cụ thể:
- Sử dụng
date_i18n(): Hàm này cho phép bạn hiển thị ngày tháng theo ngôn ngữ của trang web (đã được thiết lập trong cài đặt WordPress). - Tạo hàm tùy chỉnh: Bạn có thể tạo một hàm PHP tùy chỉnh để xử lý việc tính toán và hiển thị ngày tháng tương đối theo một định dạng hoàn toàn khác.
- Sử dụng Javascript: Nếu bạn muốn cập nhật ngày tháng tương đối một cách tự động (ví dụ: hiển thị “Vừa xong” và sau đó tự động cập nhật thành “1 phút trước” mà không cần tải lại trang), bạn có thể sử dụng Javascript để thực hiện việc này.
Ví dụ về Hàm Tùy Chỉnh
Dưới đây là một ví dụ về một hàm PHP tùy chỉnh để hiển thị ngày tháng tương đối:
<?php
function custom_relative_date($timestamp) {
$time_ago = strtotime($timestamp);
$current_time = time();
$time_difference = $current_time - $time_ago;
$seconds = $time_difference;
$minutes = round($seconds / 60);
$hours = round($seconds / 3600);
$days = round($seconds / 86400);
$weeks = round($seconds / 604800);
$months = round($seconds / 2629440);
$years = round($seconds / 31553280);
if ($seconds <= 60) {
return "Vừa xong";
} else if ($minutes <= 60) {
if ($minutes == 1) {
return "1 phút trước";
} else {
return "$minutes phút trước";
}
} else if ($hours <= 24) {
if ($hours == 1) {
return "1 giờ trước";
} else {
return "$hours giờ trước";
}
} else if ($days <= 7) {
if ($days == 1) {
return "Hôm qua";
} else {
return "$days ngày trước";
}
} else if ($weeks <= 4.3) {
if ($weeks == 1) {
return "1 tuần trước";
} else {
return "$weeks tuần trước";
}
} else if ($months <= 12) {
if ($months == 1) {
return "1 tháng trước";
} else {
return "$months tháng trước";
}
} else {
if ($years == 1) {
return "1 năm trước";
} else {
return "$years năm trước";
}
}
}
?>
Để sử dụng hàm này, bạn có thể thêm nó vào file functions.php của theme con, sau đó gọi nó trong các file template:
<?php
echo custom_relative_date(get_the_date('c'));
?>
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ạn có thể sử dụng plugin hoặc chỉnh sửa theme để thực hiện điều này. Hãy lựa chọn phương pháp phù hợp nhất với nhu cầu và trình độ kỹ thuật của bạn. Chúc bạn thành công!
