Hướng dẫn tạo bài viết liên quan trên theme Flatsome

Bài viết liên quan trên theme Flatsome ở cuối nội dung bài viết không được flatsome hỗ trợ sẵn như các theme tin tức khác, vì nó là theme chuyên bán hàng mà.
Nhưng nếu bạn muốn hãy làm theo hướng dẫn của mình dưới đây để tạo bài viết liên quan trên theme Flatsome. Rất đơn giản, không phải cài thêm plugin chi cho nó nặng web, mà chẳng may khách vô tình tắt plugin nó mất tiêu cái bài viết liên quan là lại yêu cầu support. Chèn code cho nó chắc

1. Chèn code sau vào file funcions.php của child theme

//Bài viết liên quan
function mh_add_post_content($content) {
  if (is_single()) {
    $content .= "<div class='clearfix'></div>";
    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'=> 3, // Number of related posts that will be shown.
        'caller_get_posts'=>1
      );

      $my_query = new wp_query( $args );
      if( $my_query->have_posts() ) { 		
        $content .= '<div id="related_posts"><h3>Bài viết liên quan</h3><ul>';
        while( $my_query->have_posts() ) {
            		$my_query->the_post();
          $content .= '
            <li class="col large-4">
              <div class="relatedthumb">
                <a href="' . get_the_permalink() .'">'. get_the_post_thumbnail().'</a>
              </div>
                  		<div class="relatedcontent">
                      		<h3>
                      			<a href="'. get_the_permalink().'">'. get_the_title().'</a>
                      		</h3>
                        	</div>
                      </li>';
        } //End while
        $content .= "</ul></div> 
        <div class='clearfix'></div>";
      } //End if
    } //End if
  }
  return $content;
}
add_filter ('the_content', 'mh_add_post_content', 0);

2. Chèn đoạn mã css sau vào file style.css của chile theme để tạo bài viết liên quan trên theme Flatsome

#related_posts .col {
  float: left;
  margin-left: 0;
  list-style: none;
}
.relatedcontent h3 {
  font-size: 16px;
  margin-top: 7px;
}
.relatedthumb img {
  height: 100%;
  max-height: 165px;
}
#related_posts {
  border-top: 4px double #e8e8e8;
        padding-top: 10px;
}
#related_posts li:nth-child(1) {
  padding-left: 0 !important;
}
#related_posts li:nth-child(2) {
  padding-left: 0 !important;
  padding-right: 0 !important;
}
#related_posts li:nth-child(3) {
  padding-right: 0 !important;
}
.relatedthumb img {
  min-height: 125px;
}

3. Các bạn muốn đẹp hoặc khác hơn hãy css thêm nhé

Chỉ cần đơn giản 2 bước thôi, là có ngay bài viết liên quan ở cuối mỗi bài viết đấy.

Và đây là kết quả tạo bài viết liên quan trên theme flatsome

bai-viet-lien-quan-theme-flatsome
Hướng dẫn tạo bài viết liên quan trên theme Flatsome

Tổng kết

Trên đây là Hướng dẫn tạo bài viết liên quan trên theme Flatsome và những nguyên tắc cơ bản mà bạn cần phải biết. Nếu bạn là một trong những khách hàng đang sử dụng dịch vụ thiết kế website tại WEBNOW hoặc mua các dịch vụ về website tại đơn vị này. Đội ngũ kĩ thuật viên của chúng tôi sẽ hỗ trợ bạn làm website nhanh chóng, tối ưu và tiết kiệm chi phí.

Hiện nay, SGWeb – WebNow tự hào là đơn vị cung cấp các dịch vụ về website uy tín, chất lượng, có trách nhiệm và giá tốt hàng đầu thị trường. Hãy liên hệ ngay với chúng tôi khi bạn có nhu cầu thiết kế website hoặc mua tên miền, thuê hosting, cài đặt SSL,…

SÀI GÒN WEB

Hotline02862.722.577
Emailhi@webnow.vn
Địa chỉ178 Bùi Đình Túy, Phường 12, Quận Bình Thạnh, TP.HCM

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *