Hướng dẫn code chức năng xem đủ thời gian để hiển thị nội dung trong wordpress

Giới thiệu

Trong một số trường hợp, bạn muốn người dùng đọc bài viết đủ 30 giây hoặc một khoảng thời gian nhất định rồi mới hiển thị nội dung quan trọng. Điều này giúp tăng thời gian đọc bài viết, cải thiện tỷ lệ thoát trang (Bounce Rate) và tối ưu SEO. Trong bài viết này, MUATHEMEWPGIARE sẽ hướng dẫn bạn cách code chức năng phải xem đủ thời gian để hiển thị nội dung trong wordpress này bằng shortcode trong WordPress.

Lợi ích của việc hiển thị nội dung sau thời gian chờ

Chức năng này gần giống với chức năng nút đếm ngược để tải file trong wordpress, còn trong chức năng đếm ngược để hiển thị nội dung này sẽ giúp cho chúng ta thực hiện các vấn đề sau:

• Tăng thời gian trên trang (Time on Page), giúp SEO tốt hơn.
• Giữ chân người dùng lâu hơn, tránh thoát trang nhanh.
• Chỉ hiển thị nội dung quan trọng cho người thực sự quan tâm.
• Có thể áp dụng cho nội dung VIP, khuyến mãi hoặc link tải file.

Cách hoạt động của chức năng này

1. Người dùng truy cập trang và phải cuộn trang để kích hoạt bộ đếm.
2. Nếu bật yêu cầu đăng nhập, hệ thống chỉ đếm khi người dùng đã đăng nhập.
3. Sau khi đủ thời gian quy định, nội dung sẽ hiển thị tự động kèm hiệu ứng mượt mà.
4. Hiệu ứng thanh tiến trình giúp người dùng theo dõi thời gian chờ.
5. Popup chúc mừng khi hoàn thành thời gian đọc bài.

Code chức năng xem đủ thời gian để hiển thị nội dung

Bước 1: Thêm Shortcode vào functions.php

Chèn đoạn code sau vào functions.php của theme để tạo shortcode :

Bước 2: Sử dụng Shortcode trong bài viết

Bạn có thể sử dụng shortcode như sau:

• Nếu đặt login_required="1", chỉ những người đã đăng nhập mới thấy nội dung sau 30 giây.
• Nếu đặt login_required="0", bất kỳ ai cũng có thể xem nội dung sau 30 giây.

Cải tiến nâng cao

1. Thêm âm thanh thông báo khi hết thời gian.
2. Chặn người dùng rời tab để tránh gian lận.
3. Lưu thời gian đọc vào localStorage để không bị reset khi tải lại trang.

Code và css hoàn chỉnh của chức năng xem đủ thời gian để hiển thị nội dung

Bạn chỉ cần coppy toàn bộ file này, bỏ vào funtion.php là nó sẽ chạy thôi nhé, và hơn nữa là đẹp như của mình luôn nhé.

Kết luận

Chức năng hiển thị nội dung sau thời gian chờ là một cách hiệu quả để tăng tương tác, giữ chân người dùng và cải thiện SEO. Với đoạn code trên, bạn có thể dễ dàng tùy chỉnh thời gian chờ, yêu cầu đăng nhập, và hiệu ứng hiển thị. Hãy thử áp dụng ngay để nâng cao chất lượng website của bạn!

🚀 Nếu bạn cần code nâng cao hơn, hãy liên hệ để được hỗ trợ chi tiết!