Bài viết này Hocban.vn chia sẻ đến bạn cách hiển thị ngày cập nhật bài viết theme GeneratePress. Bạn nào có nhu cầu thì tham khảo thử nhé. Cách làm cũng đơn giản thôi, bạn đem đoạn code bên dưới dán vào cuối file functions.php của theme/ child theme đang dùng và xem thành quả. Dưới đây có 2 tuỳ chọn, bạn thích cái nào thì dùng cái đó.
Code hiển thị ngày cập nhật bài viết v1
//CODE HIỂN THỊ NGÀY CẬP NHẬT BÀI VIẾT
function custom_replace_post_date( $output, $time_string ) {
$updated_date = get_the_modified_date( 'd/m/Y' );
$icon_html = '<i class="fa fa-refresh" aria-hidden="true" style="margin-right:5px;"></i>';
$output = str_replace( get_the_date( 'd/m/Y' ), $icon_html . $updated_date, $output );
$output = str_replace( 'Đăng ngày:', 'Cập nhật:', $output );
return $output;
}
add_filter( 'generate_post_date_output', 'custom_replace_post_date', 10, 2 );
function enqueue_font_awesome_for_date_icon() {
wp_enqueue_style( 'font-awesome', 'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css' );
}
add_action( 'wp_enqueue_scripts', 'enqueue_font_awesome_for_date_icon' );
//HẾT CODE HIỂN THỊ NGÀY CẬP NHẬT BÀI VIẾTNgoài ra, với mẫu code này thì bạn copy đoạn CSS dưới đây để chèn vào CSS bổ sung (và có thể thay đổi lại màu sắc nếu muốn):
.fa-refresh:before { content: "\f021"; color: #7e7e85; }Code thay thế ngày cập nhật cho ngày đăng v2
Với mẫu code bên dưới thì bạn copy dán vào functions.php là được, không cần thêm CSS bổ dung như phiên bản v1 ở trên.
// Thay đổi ngày đăng thành ngày cập nhật
function custom_replace_post_date( $output, $time_string ) {
$updated_date = get_the_modified_date( 'd/m/Y' );
$icon_html = '<i class="fa fa-refresh" aria-hidden="true" style="margin-right:5px;"></i>'; // Biểu tượng cập nhật
$output = str_replace( get_the_date( 'd/m/Y' ), $icon_html . $updated_date, $output );
$output = str_replace( 'Đăng ngày:', 'Cập nhật:', $output );
return $output;
}
add_filter( 'generate_post_date_output', 'custom_replace_post_date', 10, 2 );
// Tự động nạp Font Awesome nếu chưa có
function enqueue_font_awesome_for_date_icon() {
wp_enqueue_style( 'font-awesome', 'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css' );
}
add_action( 'wp_enqueue_scripts', 'enqueue_font_awesome_for_date_icon' );
// HẾT code thay đổi ngày đăng thành ngày cập nhậtHoặc nếu bạn muốn hiển thị theo cấu trúc Ngày cập nhật: [thời gian] thay vì biểu tượng cập nhật >> sử dụng code bên dưới. Không cần phải nhúng font vào nữa.
// Thay đổi ngày đăng thành ngày cập nhật
function custom_replace_post_date( $output, $time_string ) {
$updated_date = get_the_modified_date( 'd/m/Y' );
$output = str_replace( get_the_date( 'd/m/Y' ), 'Cập nhật: ' . $updated_date, $output );
return $output;
}
add_filter( 'generate_post_date_output', 'custom_replace_post_date', 10, 2 );
Nếu chỉ chèn 1 icon thì bác nên dùng SVG thay vì nhúng cả cái thư viện icon của Font Awesome như vậy. Nặng và thừa.
Code này là bản chia sẻ cho ae xài á bạn Hiếu, chứ mình chỉ nhúng đúng 1 lần trước đó thôi, khi mình xài là sẽ bỏ đoạn nhúng font ra. Mình dùng Font Awesome ở nhiều vị trí, với lại quen với font này nhiều năm nay rồi ^^
Hóng cho Flatsome bác ạ.
Sẽ vọc dần á bác, e đang hoàn thiện cho theme GenratePress. Xong là e quay lại quẩy với Flatsome ^^