HIỂN THỊ ICON BÀI VIẾT THEO LABEL

HIỂN THỊ ICON BÀI VIẾT THEO LABEL

                                                                 

CÁCH THỰC HIỆN:

Bước 1. Chèn đoạn CSS này trước thẻ ]]></b:skin>

/* Icon Theo 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 này vào sau thẻ <div class='entry-image'>

<b:if cond='data:post.labels any (l =&gt; l.name == &quot;PSD&quot;)'><span class='post-labelx anh-bia'><i class='fa fa-folder-open'/></span></b:if>
<b:if cond='data:post.labels any (l =&gt; l.name == &quot;Template&quot;)'><span class='post-labelx templates'><i class='fa fa-bell'/></span></b:if>
<b:if cond='data:post.labels any (l =&gt; l.name == &quot;Thủ thuật facebook&quot;)'><span class='post-labelx facebook'><i class='fa fa-facebook'/></span></b:if >
Bước 3. Chỉnh sửa một số thông tin lại cho phù hợp ở chỗ in màu thành tên nhãn của blog các bạn nhé.

                                                                                               Chúc các bạn thành công!!!
Tác giả: Ngọc Tính IT

Tôi lang thang trên đường đời, bỏ qua những thứ quan trọng nhất. Để rồi khi ngoảnh lại, chỉ còn Tôi - Các Bạn và Blog!

4 nhận xét:


Cùng tham gia bình luận bài viết này nhé!