Đánh số thứ tự cho bài đăng phổ biến (Popular post)

Bài viết này mình sẽ hướng dẫn bạn đánh số thứ tự tự động cho widget Popular Post (Bài đăng phổ biến) của blogspot.

Thêm tiện ích Popular Post

Trước hết bạn hãy add widget Popular Post vào blog sau đó thiết lập như hình bên dưới. Bạn nên để số lượng bài viết từ 9 trở xuống để hiển thị đẹp nhất

Cài đặt trong template

Dán đoạn code bên dưới vào trước ]]></b:skin> (Click vào khung chứa template sau đó nhấn Ctrl + F sau đó dán ]]></b:skin> vào để tìm nhanh) sau đó lưu lại template

/*--Đánh số thứ tự cho Popular post--*/
.popular-posts ul {
padding-left: 0px;
counter-reset: popcount;
}
.popular-posts ul li:before {
list-style-type: none;
margin-right: 15px;
padding: 0.3em 0.6em;
counter-increment: popcount;
content: counter(popcount);
font-size: 16px;
background: #292D30;
color: #ffffff;
border-radius: 0px;
position: relative;
font-weight: bold;
font-family: georgia;
float: left;
border: 2px solid #dddddd;
box-shadow: 1px 2px 9px #666666; }
.popular-posts ul li {
border-bottom: 1px dashed #dddddd;
}
.popular-posts ul li:hover {
border-bottom: 1px dashed #696969;
}
.popular-posts ul li a {
text-decoration:none; color:#5A5F63;
}
.popular-posts ul li a:hover {
text-decoration:none;
}

Bạn có thể tùy chỉnh:

• #292D30: Màu nền khung số thứ tự
• #ffffff: Màu số thứ tự
• 0px: Tăng giá trị này để tạo thành bo góc hoặc hình tròn

Bạn cần giúp đỡ

Nếu có gặp vấn đề trong quá trình thực hiện đừng ngại comment đặt câu hỏi và mình sẽ giải đáp vấn đề liên quan đến bài viết. Mong bạn sẽ luôn ủng hộ TrollVL, đừng quên like và share bài viết đến bạn bè của bạn. Cảm ơn!

Tham khảo MBT