Để thêm icon “new” vào bài viết mới nhất trong WordPress, bạn có thể sử dụng plugin hoặc thêm mã tự viết vào tệp theme của bạn.
Cách 1: Sử dụng plugin
- Tìm và cài đặt plugin “New Post Badges” hoặc plugin tương tự.
- Cấu hình plugin để hiển thị icon “new” trên bài viết mới nhất.
Cách 2: Thêm mã tự viết vào theme
- Mở tệp functions.php trong theme của bạn.
- Thêm mã sau vào tệp functions.php:
function new_post_badge() {
global $post;
$post_date = get_the_date('U');
$current_date = current_time('U');
$diff = $current_date - $post_date;
if ($diff < 86400) {
echo ' <span class="new-post-badge">New</span>';
}
}
- Lưu lại và chèn mã sau vào vị trí bạn muốn hiển thị, có thể chèn trong vòng lặp : <?php new_post_badge(); ?>
- Chỉnh sửa thuộc tính của class “new-post-badge” trong mã trên để thay đổi kích thước và màu sắc của icon “new”.
- Thay đổi
86400= số thời gian bạn muốn
Trên là cách thêm icon vài tiêu đề bài viết mới ở vị trí bạn muốn, còn dưới đây là cách thêm vào toàn bộ vị trí bạn muốn theo type:
function add_new_post_badge_to_title( $title ) {
if( is_singular('post') && is_main_query() ) { // Thêm điều kiện is_main_query()
global $post;
$post_date = get_the_date('U');
$current_date = current_time('U');
$diff = $current_date - $post_date;
if ($diff < 86400) {
$title = ' <span class="new-post-badge">New</span>' . $title ;
}
}
return $title;
}
Điều kiện is_main_query() sẽ cho phép icon “new” chỉ hiển thị trong query chính của trang, nếu bài viết đó được liệt kê trong một widget hoặc trong một shortcode thì icon “new” sẽ không hiển thị.
Lưu ý: Nếu muốn thêm icon “new” vào các trang khác nhau ví dụ như archive, category hoặc trang search. Bạn cần thay đổi điều kiện is_singular(‘post’) thành is_archive() hoặc is_search() hoặc is_category()…
Code ví dụ:
function add_new_post_badge_to_title( $title ) {
if( is_archive() || is_search() || is_category() ) { // Thay đổi điều kiện
global $post;
$post_date = get_the_date('U');
$current_date = current_time('U');
$diff = $current_date - $post_date;
if ($diff < 86400) {
$title = ' <span class="new-post-badge">New</span>' . $title ;
}
}
return $title;
}
Hàm is_archive() sẽ kiểm tra xem trang hiện tại có phải là trang archive hay không. Hàm is_search() sẽ kiểm tra xem trang hiện tại có phải là trang search hay không. Hàm is_category() sẽ kiểm tra xem trang hiện tại có phải là trang category hay không.
Các hàm trên sẽ kiểm tra xem trang hiện tại là trang archive hoặc search hoặc category nếu trả về true thì sẽ hiển thị icon “new”, nếu trả về false thì sẽ không hiển thị.
Nếu muốn custom CSS cho icon “new” bạn có thể thêm vào file css của theme hoặc thêm vào tệp functions.php
function add_new_badge_style() {
echo '<style>
.new-post-badge{
color: red;
font-size: 20px;
}
</style>';
}
add_action( 'wp_head', 'add_new_badge_style' );