CÁCH ĐÁNH SỐ THỨ TỰ BÀI XEM NHIỀU NHẤT TỪ 1 ĐẾN 10.
Không giống như các style khác, popular post thật không dễ để tùy biến với những bạn không thạo. Nhất là bạn không thể đánh style với kiểu decimal xấu xí.
Trong bài viết này mình sẽ hướng dẫn bạn cách để đánh thứ tự bài viết xem nhiều nhất trên blogger.
Đầu tiên mời bạn xem demo :
Cách đánh số thứ tự như ở DEMO
Mở chế độ chỉnh sửa HTML. Bạn thêm code sau trước ]]></b:skin>
Bạn vào Dashbroad -> Mẫu -> Chỉnh sửa HTML
Thêm đoạn code sau :
#PopularPosts{width:100%!important;margin:0 auto!important;padding:5px 0 !important;}
.popular-posts ol{list-style-type:decimal !important;}
.widget-content popular-posts ul{list-style-type:decimal !important;}
#PopularPosts1 .widget-content ul{list-style-type:decimal !important;}
.PopularPosts .widget-content ul{width:100%;list-style-type:decimal !important;margin:0;padding-left:30px;padding-top:13px; color:black}
#PopularPosts1 ul li:first-child:before{content:"1."; color: #76A3E0; font-weight:bold; font-size:18px}
#PopularPosts1 ul li:first-child+li:before{content:"2."; color: #76A3E0; font-weight:bold; font-size:18px}
#PopularPosts1 ul li:first-child+li+li:before{content:"3."; color: #76A3E0; font-weight:bold; font-size:18px}
#PopularPosts1 ul li:first-child+li+li+li:before{content:"4."; color: #76A3E0; font-weight:bold; font-size:18px}
#PopularPosts1 ul li:first-child+li+li+li+li:before{content:"5."; color: #76A3E0; font-weight:bold; font-size:18px}
#PopularPosts1 ul li:first-child+li+li+li+li+li:before{content:"6."; color: #76A3E0; font-weight:bold; font-size:18px}
#PopularPosts1 ul li:first-child+li+li+li+li+li+li:before{content:"7."; color: #76A3E0; font-weight:bold; font-size:18px}
#PopularPosts1 ul li:first-child+li+li+li+li+li+li+li:before{content:"8."; color: #76A3E0; font-weight:bold; font-size:18px}
#PopularPosts1 ul li:first-child+li+li+li+li+li+li+li+li:before{content:"9."; color: #76A3E0; font-weight:bold; font-size:18px}
#PopularPosts1 ul li:first-child+li+li+li+li+li+li+li+li+li:before{content:"10."; color: #76A3E0; font-weight:bold; font-size:18px}
.PopularPosts .widget-content li{width:100%;height:auto;overflow:hidden!important;list-style:none!important;text-indent:0;margin:0 5px!important;}
.popularposts-img{margin:2px!important;padding:3px!important;}
Lưu ý : Bạn cần để chế độ không ảnh nhé (no thumbnail)
Ok. Vậy là đã xong. Mọi người có thể tùy chỉnh lại màu, kích thước, font cho phù hợp.
Ghi lại nguồn erhay khi bạn phát hành lại thông tin từ trang này.
Nguồn : chúng tôi sưu tầm từ nhiều nguồn
Chúng tôi tuyên thiết kế web chuyên nghiệp đẳng cấp giá rẻ với 5 năm kinh nghiệm trong lĩnh vực thiết kế website nếu các bạn có nhu cầu có thể liên hệ Hotline: 0962 66 57 57 || Email: cmay.tt@gmail.com || website: cmay.vn
0 nhận xét:
Đăng nhận xét