Code bài viết liên quan WordPress giúp người dùng tương tác nhiều hơn trên website của bạn. Tùy vào Theme WordPress bạn sử dụng mà có hoặc không có chức năng này. Tất nhiên, WordPress có hàng trăm Plugin hỗ trợ hiển thị bài viết liên quan. Nhưng bạn hoàn toàn có thể sử dụng vài dòng Code để thực hiện cho chức năng này.
Để đơn giản hơn với Code, đoạn code này hiển thị bài viết một cách đơn giản. Chức năng của đoạn Code này sẽ hiển thị 5 bài viết liên quan đến nội dung chính. Ngay bên dưới là hướng dẫn thực hiện.
Code bài viết liên quan WordPress
Ngay tại giao diện Blog Lại Văn Đức cũng không có chức năng hiển thị các bài viết liên quan. Chính vì vậy mình sẽ sử dụng Code để hỗ trợ tìm kiếm các bài viết liên quan và hiển thị bên dưới các bài viết. Bạn có thể kéo xuống dưới cùng để xem cách hiển thị trên blog của mình.
Code bài viết liên quan WordPress không cần dùng Plugin
Cách thực hiện rất đơn giản, bạn hãy dán đoạn Code bên dưới vào file single.php trong Theme của bạn. Nếu như thư mục Theme của bạn không tìm thấy file single.php, bạn hãy tìm file content-single.php để dán đoạn Code này.
Code bài viết liên quan WordPress hiển thị chỗ nào phụ thuộc vào vị trí bạn dán đoạn Code này. Nếu bạn chưa biết gì về Code, hãy backup file single.php ra và thử nghiệm dán Code để hiển thị, đến khi nào ưng ý thì thôi. Vì mỗi Theme có cách viết Code khác nhau nên mình không hướng dẫn cụ thể được.
<div class="relatedpost" >
<p style="text-align: left;"><span style="color: #993366;"><strong><span style="font-family: arial, helvetica, sans-serif; font-size: 14pt;">Bài viết liên quan:</span></strong></span></p>
<?php
$tags = wp_get_post_tags(get_the_ID());
if ($tags){
echo '<div id="relatedpost">';
$tag_ids = array();
foreach($tags as $individual_tag) $tag_ids[] = $individual_tag->term_id;
$args=array(
'tag__in' => $tag_ids,
'post__not_in' => array(get_the_ID()),
'posts_per_page' => 5,
);
$my_query = new wp_query($args);
if( $my_query->have_posts() ):
echo '<ul>';
while ($my_query->have_posts()):$my_query->the_post();
?>
<li><a href="<?php the_permalink() ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></li>
<?php
endwhile;
echo '</ul>';
endif;
wp_reset_query();
echo '</div>';
}
?>
</div>
Mặc định, đoạn Code bên trên sẽ hiển thị 5 bài viết liên quan. Nếu bạn muốn hiển thị nhiều hơn hoặc ít hơn, hãy sửa số lượng ở dòng 'posts_per_page' => 5,
Tiếp theo, bạn hãy chèn đoạn code CSS này vào Custom CSS trong Theme Options của bạn. Nếu Theme bạn sử dụng không có chức năng này, bạn hãy chèn đoạn Code CSS bên dưới vào Additional CSS trong Customize.
.relatedpost {
border-bottom: dashed #efefef 1px;
margin-bottom: 1.5em;
margin-top: -0.8em;
}
div#relatedpost li a {
color: #0024e9;
line-height: 1.5;
}
Như vậy là xong, bạn hãy kiểm tra xem đoạn Code bài viết liên quan WordPres đã hoạt động chưa. Nếu bạn có thêm kiến thức về CSS, bạn có thể tùy chỉnh thêm cho hiển thị đẹp hơn.
Thế Thôi
Bài viết liên quan vô cùng quan trọng để giúp người dùng xem thêm các nội dung trên website của bạn. WordPress có rất nhiều Plugin hỗ trợ vấn đề này và hiển thị vô cùng đẹp. Tuy nhiên, nếu bạn thích đơn giản mà không cần cài Plugin, đoạn Code bên trên dễ dàng hỗ trợ bạn.
Nếu bạn vẫn muốn tìm một Plugin để sử dụng chức năng này. Bạn có thể sử dụng Plugin Yet Another Related Posts Plugin (YARPP). Plugin này rất dễ sử dụng và tương đối nhẹ nhàng.
Trong quá trình thực hiện thủ thuật WordPress bên trên, nếu bạn gặp bất kỳ khó khăn hoặc thắc mắc nào. Hãy để lại bình luôn bên dưới và chúng ta cùng thảo luận. Chúc bạn luôn thành công.
Bài viết liên quan:
