Tùy biến label blogspot #2 post lại từ thủ thuật Popular Labels của bác Duy Phạm, nó giúp hiển thị số bài đăng của mỗi nhãn với bố cục và màu sắc bắt mắt. Bạn có thể chỉnh sửa màu sắc bằng cách chỉnh sửa css.
>> Tùy biến label blogspot #1
>> Ẩn dấu chấm ở label trong blogspot
- Vào Mẫu > Chỉnh sửa HTML
- Tìm đến tiện ích Label* (* là số thứ tự của widget label, nếu blog chỉ có 1 widget label thì * là 1)
- Tìm đoạn code sau trong widget
- Thay thế đoạn code vừa tìm thành đoạn code dưới đây
- Thay 5 bằng số label muốn hiển thị
- Lưu mẫu
- Vào bố cục và chỉnh tiện ích widget như sau:
>> Tùy biến label blogspot #1
>> Ẩn dấu chấm ở label trong blogspot
THÊM CSS CHO LABEL #2
- Thêm đoạn css sau trên ]]></b:skin>.Label ul{margin:0!important;padding:0!important;list-style-type:none!important} .Label ul li{margin:0!important;border:0!important;background:transparent!important;padding:0 0 0 10px!important} .Label ul li a{display:block;position:relative;margin:10px 0!important;background:#17b38f;padding:10px 0 10px 20px!important;font-size:14px;line-height:20px;color:#fff!important;text-decoration:none} .Label ul li a:hover{color:#fff!important;text-decoration:none} .Label ul li a:hover:after{background:#ff4e47} .Label ul li a:before{content:'';position:absolute;top:0;left:-10px;width:0;height:0;border-top:20px solid transparent;border-right:10px solid #17b38f;border-bottom:20px solid transparent} .Label ul li a:after{content:'';position: absolute;top:17px;left:0;border-radius:50%;background:#fff;width:6px;height:6px} .Label ul li span{float:right;margin-right:-10px;background:#ff4e47;width:30px;height:20px;font-size:10px;color:#fff;text-align:center}
CHỈNH SỬA WIDGET LABEL #2
- Thêm widget Label cho Blog- Vào Mẫu > Chỉnh sửa HTML
- Tìm đến tiện ích Label* (* là số thứ tự của widget label, nếu blog chỉ có 1 widget label thì * là 1)
- Tìm đoạn code sau trong widget
<b:loop values='data:labels' var='label'> <li> <b:if cond='data:blog.url == data:label.url'> <span expr:dir='data:blog.languageDirection'><data:label.name/></span> <b:else/> <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a> </b:if> <b:if cond='data:showFreqNumbers'> <span dir='ltr'>(<data:label.count/>)</span> </b:if> </li> </b:loop>
<b:loop index='i' values='data:labels' var='label'> <b:if cond='data:i < 5'> <li><a expr:href='data:label.url' rel='tag'><data:label.name/><b:if cond='data:showFreqNumbers'><span><data:label.count/></span></b:if></a></li> </b:if> </b:loop>
- Lưu mẫu
- Vào bố cục và chỉnh tiện ích widget như sau:


0 nhận xét :
Post a Comment