Thêm tính năng sắp xếp bình luận mới nhất, cũ nhất cho blogspot

- Mặc định trong Blogspot sẽ hiển thị comment từ cũ nhất đến mới nhất. Việc này làm cho những comment mới nhất bị trôi xuống dưới quá nhiều rất khó để theo dõi.

Do đó ta sẽ thêm tính năng sắp xếp bình luận từ mới nhất → cũ nhất để bạn có thể dễ dàng theo dõi những bình luận mới nhất là khi nào!

Tính năng này tương tự như Comment của Facebook thì nay đã có thể sử dụng trên Blogspot 1 cách dễ dàng.

Bước 1: Xác định nơi muốn hiển thị sắp xếp comment

Thông thường ta sẽ chèn phía trên những bình luận hoặc trên Khung Comment của Blogger.
Code phần bình luận có cấu trúc như sau.

Thêm tính năng sắp xếp bình luận mới nhất, cũ nhất cho blogspot
Thêm tính năng sắp xếp bình luận mới nhất, cũ nhất cho blogspot

Chèn vào đây nếu bạn muốn hiển thị trên khung bình luận
<p class='comment-footer'>
      <b:if cond='data:post.allowNewComments'>
        <b:include data='post' name='threaded-comment-form'/>
      <b:else/>
        <data:post.noNewCommentsText/>
      </b:if>
    </p>
Chèn vào đây nếu bạn muốn hiển thị trên nội dung bình luận
    <div class='comments-content'>
      <b:include cond='data:post.embedCommentForm' data='post' name='threaded_comment_js'/>
      <div id='comment-holder'>
         <data:post.commentHtml/>
      </div>

Bước 2 Chèn đoạn code sắp xếp bình luận cho blogspot

<b:if cond='data:post.numComments &gt; 2'>
<style>
.coud-com{float:left;font-weight:700;margin-top:4px;font-size:14px}
.sort-comment{margin-top:13px;text-align:left}
.sort-comment .sort-sel{display:block;position:relative}
.sort-comment .sort-sel span{font-size:14px;font-weight:400;color:#888}
.sort-comment .sort-sel .sort-option{font-weight:500;cursor:pointer;padding:0;color:#4b4f56;border:0;font:500 14px Roboto,sans-serif;outline:0;margin:0 0 0 -2px}
.post-author.bottom {font-size: 18px;float: left;line-height: 0px;margin: 14px 0 0 7px;color: #5273b8}
</style>
<span class='post-author bottom'><a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><i class='fas fa-pen-square'/> Viết bình luận (<data:post.numComments/>)</a></span>
<div class='sort-comment' style='float:right'>
<div class='sort-sel'>
<span style='font-size:14px'>Xếp theo</span>
<select class='sort-option'>
<option selected='selected' value='newest'>Cũ nhất</option>
<option value='oldest'>Mới nhất</option>
</select>
</div>
</div><script type='text/javascript'>
//<![CDATA[
$.fn.reverseChildren = function() {
return this.each(function() {
var $this = $(this);
$this.children().each(function() {
$this.prepend(this);
});
});
};
$(".comments-content ol").reverseChildren();
$(".sort-option").on("change", function() {
$(".comments-content ol").reverseChildren();
})
//]]>
</script>
</b:if>

Bước 3: Lưu lại và kiểm tra

Lưu ý: Tính năng sắp xếp bình luận mới nhất, cũ nhất cho blogspot mình đã viết lại điều kiện.
↠ chỉ hoạt động khi bài viết của bạn có từ 3 bình luận trở lên. Vì khi chỉ có 1 hoặc 2 bình luận ta cũng không có gì để cần phải sắp xếp để để tránh ảnh hưởng tốc độ Website.

Chúc bạn thành công! 
[/tintuc]
Huỳnh Phụng Blogger

TLQT là Blog chia sẻ kiến thức về Marketing, Digital Marketing, Kinh nghiệm làm SEO, Tối ưu Website và nhiều thứ khác

Đăng nhận xét

➔ Gửi kèm hình ảnh trên bài viết để được hỗ trợ tốt nhất.
➔ Để bình luận kèm hình ảnh, bạn vào trang Upload Ảnh, kéo thả để Upload hình ảnh lên.
➔ Bạn dán URL link hình ảnh vào khung bình luận và ấn Xuất bản, ảnh sẽ được tự động tải lên.
➔ Không spam trong khung bình luận, hạn chế viết tắt.
➔ Tích vào ô Thông báo cho tôi (Notify me) để nhận thông báo phản hồi của Admin

Mới hơn Cũ hơn

POST ADS1

POST ADS 2