Trang chủ
Bạn có để ý rằng nhiều blog lớn như Medium, HubSpot, Ahrefs luôn hiển thị “5 min read”, “6 phút đọc” ngay đầu bài viết không? Đây là một yếu tố nhỏ nhưng rất quan trọng để tăng trải nghiệm đọc, giúp người dùng quyết định có nên đọc tiếp hay không.
Trong bài viết này, mình hướng dẫn bạn cách tự thêm tính năng Reading Time vào WordPress bằng cách sử dụng functions.php, hoàn toàn không cần cài plugin. Cách làm gọn – nhẹ – tối ưu SEO và tương thích với mọi giao diện, đặc biệt là Flatsome.
Vì sao nên thêm Reading Time cho bài SEO?
- Tăng trải nghiệm người đọc → họ biết mất bao lâu để đọc hết.
- Giảm bounce rate → người đọc cam kết ở lại lâu hơn.
- Tạo sự chuyên nghiệp → giống các blog quốc tế.
- Không ảnh hưởng tốc độ web → không dùng plugin, load cực nhẹ.
- Phù hợp mọi theme → chỉ cần một đoạn code nhỏ là dùng được.
Cách tính thời gian đọc cho bài viết WordPress
Thông thường tốc độ đọc trung bình của người lớn là 200–250 từ/phút.
Trong bài này, mình dùng mức chuẩn:
200 từ / phút
Ví dụ: bài viết có 850 từ → 850 / 200 = 4.25 phút → làm tròn thành 5 phút đọc.
Thêm function tính số từ & phút đọc (dán vào functions.php)
Chép đoạn code dưới đây vào cuối file functions.php của child theme:
// ===============================
// TÍNH THỜI GIAN ĐỌC BÀI VIẾT
// ===============================
if ( ! function_exists( 'tn_get_reading_time' ) ) {
function tn_get_reading_time( $post_id = null ) {
if ( ! $post_id ) {
$post_id = get_the_ID();
}
// Lấy nội dung
$content = get_post_field( 'post_content', $post_id );
// Đếm số từ
$text = wp_strip_all_tags( strip_shortcodes( $content ) );
$word_count = str_word_count( $text );
// Tốc độ đọc trung bình: 200 từ/phút
$words_per_minute = 200;
// Tính phút đọc (tối thiểu 1 phút)
$minutes = max( 1, ceil( $word_count / $words_per_minute ) );
return array(
'minutes' => $minutes,
'word_count' => $word_count,
);
}
}
if ( ! function_exists( 'tn_the_reading_time' ) ) {
function tn_the_reading_time( $post_id = null ) {
$data = tn_get_reading_time( $post_id );
$minutes = $data['minutes'];
$word_count = $data['word_count'];
echo '<span class="tn-reading-time">'
. esc_html( $minutes . ' phút đọc' )
. ' (' . esc_html( $word_count . ' từ' ) . ')'
. '</span>';
}
}
Cách hiển thị Reading Time trên bài viết
Cách 1: Chèn vào template theme (đẹp & chủ động nhất)
Chèn ngay dưới tiêu đề trong single.php, content-single.php, hoặc file template của Flatsome:
<h1 class="entry-title"><?php the_title(); ?></h1>
<div class="entry-meta">
<?php tn_the_reading_time(); ?>
</div>
Cách 2: Tự động chèn vào đầu nội dung (không sửa template)
add_filter( 'the_content', 'tn_add_reading_time_to_content' );
function tn_add_reading_time_to_content( $content ) {
if ( is_singular( 'post' ) && in_the_loop() && is_main_query() ) {
ob_start();
tn_the_reading_time();
$time_html = ob_get_clean();
return '<div class="tn-reading-time-wrap">' . $time_html . '</div>' . $content;
}
return $content;
}
CSS làm badge “X phút đọc” cho đẹp
Dán vào Customizer > Additional CSS hoặc file CSS của bạn:
.tn-reading-time-wrap {
margin-bottom: 12px;
}
.tn-reading-time {
display: inline-block;
padding: 5px 12px;
border-radius: 50px;
font-size: 12px;
font-weight: 600;
background: #f2f4f7;
border: 1px solid #e4e7ec;
color: #333;
text-transform: uppercase;
letter-spacing: 0.04em;
}
Demo kết quả sau khi cài
5 phút đọc (1.042 từ)
Hiển thị ngay bên dưới tiêu đề hoặc ngay đầu nội dung bài viết. Nhìn rất chuyên nghiệp và tăng UX rõ rệt.
Mẹo SEO nhỏ
- Nên đặt Reading Time trước nội dung, càng cao càng tốt.
- Tránh hiển thị trong sidebar → người đọc ít để ý.
- Với bài dài, badge “5 phút đọc” giúp giữ chân user tốt hơn.
Kết luận
Chỉ với vài dòng code nhỏ trong functions.php, bạn có thể thêm tính năng tính thời gian đọc cực kỳ hữu ích cho blog WordPress. Không cần plugin, không nặng site, lại rất phù hợp SEO.
