Code Hiển Thị Icon Trên Ảnh Theo Labels Cho Blogspot
Vào lúc tháng 12 02, 2017 ngày Thứ Bảy, 2 tháng 12, 2017 - Chuyên mục: Thủ Thuật BlogspotXin chào các bạn, hôm nay mình muốn chia sẽ cho các bạn nào chơi blog :v về cách hiển thị icon theo nhãn.
Cái này hiện tại cũng khá được các bạn yêu thích
 |
| Ảnh Minh Họa |
CÁC BƯỚC THỰC HIỆN
Bước 1 : chèn đoạn code bên dưới trước thẻ *]]></b:skin>*/* Icon Theo Search Label */
.post-labelx{font-size: 20px;
width: 40px;
height: 40px;
line-height: 38px;
text-align: center;
position: absolute;
top: 6px;
right: 6px;
box-sizing: border-box;
color: #fff;
z-index: 2;
border: 2px solid #fff;
border-radius:100%}
.post-labelx.anh-bia,.post-labelx.windows{background-color: #4a9b6c;}
.post-labelx.blogger{background-color: #FF8000;}
.post-labelx.facebook{background-color: #4267b2;}
.post-labelx.templates{background-color: #8E44AD;}
.post-labelx.psd{background-color: #787878;}
Bước 2 : Đặt đoạn code này vào nơi muốn hiển thị ,blog mình thì sau thẻ
*<div class='entry-image'>*
<b:if cond='data:post.labels any (l => l.name == "PSD")'><span class='post-labelx anh-bia'><i class='fa fa-folder-open'/></span></b:if>
<b:if cond='data:post.labels any (l => l.name == "Template Blogger")'><span class='post-labelx templates'><i class='fa fa-bell'/></span></b:if>
<b:if cond='data:post.labels any (l => l.name == "Facebook")'><span class='post-labelx facebook'><i class='fa fa-facebook'/></span></b:if>
<b:if cond='data:post.labels any (l => l.name == "Blogger")'><span class='post-labelx blogger'><i class='fa fa-rss'/></span></b:if>
Nguồn : Starnit