Tạo mầu nền xen kẽ cho comments của blog
Ngoài việc tạo sự khác biệt cho nhận xét của tác giả bài viết hôm nay mình xin giới thiệu một thủ thuật mới Tạo mầu nền xen kẽ cho comments của blog.
Bước 1: Thêm đoạn mã dưới đây vào trước thẻ
Bước 2: Thêm đoạn mã dưới đây vào trước thẻ
Bước 3: Thêm đoạn mã dưới đây vào trước thẻ
Bước 4: Thêm đoạn mã dưới đây vào sau thẻ
Bước 5: Tìm thẻ kết thúc
Bước 1: Thêm đoạn mã dưới đây vào trước thẻ
]]></b:skin> trong template của bạn.
.bgc1{background:#BFF}
.bgc2{background:#F4F4F4}
Bước 2: Thêm đoạn mã dưới đây vào trước thẻ
</head> (nếu blog bạn đã có jQuery rồi thì bỏ qua bước này).
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'/>
Bước 3: Thêm đoạn mã dưới đây vào trước thẻ
<b:loop values='data:post.comments' var='comment'>.
<script type='text/javascript'>var cCounter=0;</script>
Bước 4: Thêm đoạn mã dưới đây vào sau thẻ
<b:loop values='data:post.comments' var='comment'>.
<script type='text/javascript'>
cCounter=cCounter+1;
var du=cCounter%2;
function addclass(a){
if(du==0){
$(document).ready(function(){
$("."+a).addClass("bgc2");
});
}
else{
$(document).ready(function(){
$("."+a).addClass("bgc1");
});
}
};
</script>
<script type='text/javascript'>addclass('<data:comment.anchorName/>');</script>
<div expr:class='data:comment.anchorName'>
Bước 5: Tìm thẻ kết thúc
</b:loop> tương ứng của <b:loop values='data:post.comments' var='comment'> và thay thế thành:
</div> </b:loop>
Thay thế#BFFvà#F4F4F4thành mã màu theo ý bạn.
cCounterlà biến đếm số comments, nếu áp dụng thủ thuật tạo số đếm cho comments bạn có thể ghép 2 thủ thuật làm 1 để giảm bớt code.
Hướng dẫn thủ thuật Blogger, Blogspot
41
Nhận xét