Thêm tính năng sắp xếp bình luận mới nhất, cũ nhất cho blogspot
Xuất bản
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.
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 |
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 > 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!
- Bacsiwindows -
- Bacsiwindows -
Đây là khu vực quản trị, bạn không có quyền truy cập vào!
quá chuyên nghiệp :)
Trả lờiXóa:D
XóaLâu rồi mới ghé thăm ae :D
Trả lờiXóaVào comment dạo thường xuyên nhé :))
XóaRất hay Phụng ơi tôi đã áp dụng và thành công
Trả lờiXóa