Code Hiển Thị Bài Viết Liên Quan Theo Chuyên Mục Và Tag

Hiện nay hầu hết các Website đều có phần này ở bên dưới bất kỳ bài viết nào, nó điều hướng người dùng đến những bài viết liên quan tương tự nhầm tối ưu trãi nghiệm và đưa người dùng đi theo luồng bài theo chủ đề cần quan tâm.

Sunday Web sẽ hướng dẫn bạn Code Hiển Thị Bài Viết Liên Quan Theo Chuyên Mục Và Tag dành cho theme Flatsome.

1. Lấy bài viết liên quan cùng Chuyên Mục

Bạn truy cập vào Admin ➔ Giao diện ➔ Sửa giao diện theme Child ➔ Template Parts ➔ Posts ➔ Chọn file Single.php và sau đó copy đoạn code phía dưới vào cuối cùng file:

<?php
/*
 * Code hiển thị bài viết liên quan trong cùng 1 category
 */
$categories = get_the_category(get_the_ID());
if ($categories){
    echo '<div class="baivietlienquan">';
    $category_ids = array();
    foreach($categories as $individual_category) $category_ids[] = $individual_category->term_id;
    $args=array(
        'category__in' => $category_ids,
        'post__not_in' => array(get_the_ID()),
        'posts_per_page' => 5, // So bai viet dc hien thi
    );
    $my_query = new wp_query($args);
    if( $my_query->have_posts() ):
        echo '<h4>Có thể bạn quan tâm</h4><ul>';
        while ($my_query->have_posts()):$my_query->the_post();
            ?>
            <li><a href="<?php the_permalink() ?>" title="<?php the_title_attribute(); ?>"><?php the_title(); ?></a></li>
            <?php
        endwhile;
        echo '</ul>';
    endif; wp_reset_query();
    echo '</div>';
}
?>

Bạn có thể sửa lại số lượng bài viết theo ý muốn ( code đang hiển thị 5 bài viết theo Chuyên Mục )

2. Lấy bài viết liên quan cùng Tag

Bạn truy cập vào Admin ➔ Giao diện ➔ Sửa giao diện theme Child ➔ Template Parts ➔ Posts ➔ Chọn file Single.php và sau đó copy đoạn code phía dưới vào cuối cùng file:

<?php
/*
 * Code hiển thị bài viết liên quan theo post tag
 */
$tags = wp_get_post_tags(get_the_ID());
if ($tags){
    echo '<div class="baivietlienquan">';
    $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' => 3,
    );
    $my_query = new wp_query($args);
    if( $my_query->have_posts() ):
        echo '<h4>Có thể bạn quan tâm</h4><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>';
}
?>

Bạn có thể sửa lại số lượng bài viết theo ý muốn ( code đang hiển thị 3 bài viết theo Tag )

3. Làm đẹp phần bài viết liên quan với CSS

Bạn truy cập vào Admin ➔ Giao diện ➔ Tùy Biến CSS và sau đó copy đoạn code phía dưới vào cuối cùng file:

.baivietlienquan{
    padding: 15px;
    text-shadow: 0 1px 0 rgb(255 255 255 / 50%);
    border: 1px solid #BCE8F1;
    border-radius: 4px;
    background-color: #D9EDF7;
}
 
.baivietlienquan ul{
  margin-bottom: 0;
}
 
.baivietlienquan li{
  list-style: none;
}

Nếu bạn không chắc chắn về việc thay đổi code, hãy nhắn tin cho Sunday Web để được hướng dẫn miễn phí.

Bạn cảm thấy bài viết Code Hiển Thị Bài Viết Liên Quan Theo Chuyên Mục Và Tag như thế nào?

Nếu có góp ý bổ sung đừng ngần ngại đặt câu hỏi phía bên dưới cho Sunday Web và chúc các bạn thao tác thành công!

SundayWeb

Website Designer / Developer

Tận Tâm Làm Việc Bằng Cả Trái Tim.

Thiết kế Website – Chia sẻ kiến thức lập trình.