2 cách thêm các bài viết liên quan có thumbnail đơn giản

Lượt xem
Home

Trong thời đại số hóa ngày nay, việc tạo ra các bài viết liên quan và kết nối chúng một cách hợp lý là một phần quan trọng của việc quản lý nội dung trên website. Tuy nhiên, nhiều người gặp khó khăn khi muốn thêm các bài viết liên quan có thumbnail mà không cần sử dụng các plugin phức tạp. Để có thể dễ dàng thực hiện, hãy cùng Vietnix tham khảo nội dung bài viết sau.

Tại sao nên thêm các bài viết liên quan có thumbnail trong WordPress?

Khi blog WordPress của bạn bắt đầu phát triển, việc cho người dùng tìm các bài viết khác về cùng một chủ đề có thể trở nên khó khăn hơn. Hiển thị danh sách nội dung liên quan ở cuối mỗi bài viết blog là một cách tuyệt vời để giữ khách truy cập trên trang web và tăng lượng xem trang. Chúng cũng giúp cải thiện sự hiển thị của các trang quan trọng nhất bằng cách hiển thị nội dung tốt nhất mà người dùng có thể dễ dàng tìm thấy.

Nếu bạn không quen với việc viết code, thì đơn giản hơn khi chọn một trong những plugin bài viết liên quan WordPress nhiều lựa chọn có thể hiển thị các bài viết liên quan mà không yêu cầu code.

Thêm các bài viết liên quan có thumbnail trong WordPress
Thêm các bài viết liên quan có thumbnail trong WordPress

2 cách thêm các bài viết liên quan có thumbnail trong WordPress

1. Cách hiển thị các bài viết liên quan có thumbnail theo tag

Một cách hiệu quả để tìm nội dung liên quan là tìm các bài viết khác có chung các tag. Tag thường được sử dụng để tập trung vào các chi tiết cụ thể trong một bài viết. Do đó, bạn có thể thêm một số tag chung vào các bài viết mà bạn muốn liên quan đến nhau. Bạn có thể nhập chúng vào box Tags trong WordPress editor.

them cac bai viet lien quan co thumbnail wordpress 1
Thêm tag tại box Tags

Sau khi bạn đã thêm tag vào các bài viết của mình, việc tiếp theo là thêm code snippet sau vào template single.php của theme:

$orig_post = $post;
global $post;
$tags = wp_get_post_tags($post->ID);
if ($tags) {
$tag_ids = array();
foreach($tags as $individual_tag) $tag_ids[] = $individual_tag->term_id;
$args=array(
'tag__in' => $tag_ids,
'post__not_in' => array($post->ID),
'posts_per_page'=>5, // Number of related posts that will be shown.
'ignore_sticky_posts'=>1
);
$my_query = new wp_query( $args );
if( $my_query->have_posts() ) {
    
echo '<div id="relatedposts"><h3>Related Posts</h3><ul>';
    
while( $my_query->have_posts() ) {
$my_query->the_post(); ?>
    
<li><div class="relatedthumb"><a href="<?php the_permalink()?>" rel="bookmark" title="<?php the_title(); ?>"><!--?php the_post_thumbnail(); ?--></a></div>
<div class="relatedcontent">
<h3><a href="<?php the_permalink()?>" rel="bookmark" title="<?php the_title(); ?>"><!--?php the_title(); ?--></a></h3>
<!--?php the_time('M j, Y') ?-->
</div>
</li>
<!--?php }
echo '</ul--></ul></div>';
}
}
$post = $orig_post;
wp_reset_query();

Code này tìm kiếm các tag được liên kết với một trang và sau đó thực hiện truy vấn database để lấy các trang có các tag tương tự. Để tìm vị trí của code nằm ở đâu phụ thuộc vào theme của bạn, nhưng trong hầu hết các trường hợp, bạn nên có thể dán code vào template single.php của theme sau bài viết chính và ngay phía trên phần bình luận.

Nếu bạn đang sử dụng theme Twenty Twenty-One như trang web minh họa, thì nơi tốt để dán code là trong file template-parts/content/content-single.php sau phần tiêu đề và ngay sau <?php the_content();.

Dán code để hiển thị bài viết theo tag
Dán code để hiển thị bài viết theo tag

Phần này sẽ tự động hiển thị nội dung liên quan trên bất kỳ bài viết WordPress nào. Bạn sẽ cần thay đổi kiểu dáng và giao diện của các bài viết liên quan để phù hợp với theme bằng cách thêm CSS tùy chỉnh.

Giao diện khi được kích hoạt
Giao diện khi được kích hoạt

Mẹo: Thay vì chỉnh sửa các file theme có thể gây hỏng trang web, Vietnix khuyên bạn nên sử dụng một plugin code snippet như WPCode.

WPCode giúp bạn thêm code tùy chỉnh vào WordPress một cách an toàn và dễ dàng. Ngoài ra, chúng đi kèm với các tùy chọn Insertion cho phép bạn tự động chèn và thực thi đoạn code ở các vị trí cụ thể trên trang web WordPress, chẳng hạn sau một bài viết.

Tùy chọn Insertion cho phép bạn tự động chèn và thực thi đoạn code
Tùy chọn Insertion cho phép bạn tự động chèn và thực thi đoạn code

Ngoài cách thêm các bài viết liên quan có thumbnail, bạn cũng có thể tham khảo:

2. Cách hiển thị các bài viết liên quan trong WordPress theo category

Một cách khác để hiển thị nội dung liên quan là liệt kê các bài viết thuộc cùng một category. Lợi ích của phương pháp này là danh sách các bài viết liên quan sẽ không bị trống. Tương tự như phương pháp 1, bạn cần thêm đoạn code vào template single.php của theme hoặc sử dụng một plugin code snippet như WPCode.

$orig_post = $post;
global $post;
$categories = get_the_category($post->ID);
if ($categories) {
$category_ids = array();
foreach($categories as $individual_category) $category_ids[] = $individual_category->term_id;
$args=array(
'category__in' => $category_ids,
'post__not_in' => array($post->ID),
'posts_per_page'=> 2, // Number of related posts that will be shown.
'ignore_sticky_posts'=>1
);
$my_query = new wp_query( $args );
if( $my_query->have_posts() ) {
echo '<div id="related_posts"><h3>Related Posts</h3><ul>';
while( $my_query->have_posts() ) {
$my_query->the_post();?>
    
<li><div class="relatedthumb"><a href="<?php the_permalink()?>" rel="bookmark" title="<?php the_title(); ?>"><!--?php the_post_thumbnail(); ?--></a></div>
<div class="relatedcontent">
<h3><a href="<?php the_permalink()?>" rel="bookmark" title="<?php the_title(); ?>"><!--?php the_title(); ?--></a></h3>
<!--?php the_time('M j, Y') ?-->
</div>
</li>
<!--?php }
echo '</ul--></ul></div>';
}
}
$post = $orig_post;
wp_reset_query();

Bây giờ, bạn sẽ thấy một danh sách nội dung liên quan ở cuối mỗi bài viết. Nếu bạn muốn thay đổi kiểu dáng và giao diện của các trang liên quan, bạn sẽ cần thêm CSS tùy chỉnh để phù hợp với theme của mình.

Ngoài nội dung trên, bạn cũng có thể tham khảo:


Nếu bạn đang nỗ lực tìm kiếm một giải pháp hosting chất lượng cao để phát triển trang web hoặc blog cá nhân dựa trên nền tảng WordPress, Vietnix khuyến nghị bạn xem xét lựa chọn dịch vụ WordPress Hosting tại Vietnix. Vietnix cung cấp WordPress Hosting, một dịch vụ tối ưu hóa riêng biệt cho các trang web vận hành trên mã nguồn WordPress, với một loạt các tính năng ưu việt bao gồm:

  • Tải trang nhanh chóng, chỉ dưới 1 giây, nhờ ổ cứng NVMe cực nhanh và công nghệ LiteSpeed Enterprise.
  • Hỗ trợ tư vấn tăng tốc độ trang web bởi các chuyên gia WordPress 24/7.
  • An toàn dữ liệu đảm bảo với hệ thống backup tự động 4 lần mỗi ngày và khả năng phục hồi nhanh.
  • Sự ổn định của website được bảo đảm bởi cơ sở hạ tầng tiên tiến và công nghệ Firewall anti DDoS do Vietnix phát triển.
  • Tạo website WordPress dễ dàng chỉ với một cú click chuột qua WordPress Toolkit.
  • Tặng kèm bộ sưu tập theme và plugin WordPress cao cấp, với giá trị lên đến 50.000.000 VND/Năm, bao gồm Rank Math SEO Pro, Elementor Pro, Divi,…

Để biết thêm thông tin và lựa chọn gói WordPress Hosting phù hợp, hãy liên hệ Vietnix ngay hôm nay!

  • Địa chỉ: 265 Hồng Lạc, Phường 10, Quận Tân Bình, Thành Phố Hồ Chí Minh.
  • Hotline: 1800 1093.
  • Email: sales@vietnix.com.vn.

Lời kết

Vietnix hy vọng nội dung bài viết trên đã giúp bạn hiểu được cách thêm các bài viết liên quan có thumbnail không cần plugin. Ngoài nội dung này, bạn cũng có thể tham khảo thêm các bài viết khác như tổng hợp 20 plugin hiển thị bài viết WordPress phổ biến hiện nay hoặc cách tạo bài viết tổng hợp trong WordPress tại vietnix.vn, chúc bạn thành công!

Chia sẻ lên

Theo dõi trên

Logo Google new

Đánh giá

5/5 - (146 bình chọn)

Hoàng Vui

Kết nối với mình qua

Icon Quote
Icon Quote
Đăng ký nhận tin
Để không bỏ sót bất kỳ tin tức hoặc chương trình khuyến mãi từ Vietnix

Bình luận