Chèn Icon trước tiêu đề bài viết

Các bước thực hiện :
1. Vào bố cục
2. Vào chỉnh sửa code HTML
3. Chọn mở rộng mẫu tiện ích
4. Chèn đoạn code CSS này vào trước dòng code ]]></b:skin>

.post-icon img {
height:20px; /*có thể tùy chỉnh lại chiều cao này (hoặc xóa nó đi) tùy theo kích thước của ảnh bạn muốn hiển thị */
float:left;
margin-right:8px; }

5. Tiếp tục tìm đến đoạn code này :

<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'> <a expr:href='data:post.url'><data:post.title/></a>
<b:else/> <data:post.title/>
</b:if>
</b:if>
</h3>
</b:if> 

 6. thêm đoạn code được đánh dấu highlight như bên dưới:

<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>

<div class='post-icon'><b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'>

<b:if cond='data:label.name == &quot;Label 1&quot;'><img src='Link ảnh 1'/></b:if>

<b:if cond='data:label.name == &quot;Label 2&quot;'><img src='Link ảnh 2'/></b:if>

</b:loop>
</b:if>
</div>

<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>

- Thay tên nhãn và link ảnh icon cho thích hợp.
- Nếu có nhiều nhãn thì các bạn cứ thêm đoạn code tương tự như bên dưới vào trước dòng </b:loop> :

<b:if cond='data:label.name == &quot;Label 3&quot;'>
<img src='Link ảnh 3'/>
</b:if>
<b:if cond='data:label.name == &quot;Label 4&quot;'>
<img src='Link ảnh 4'/>
</b:if>

7. Save template.
 Chúc các bạn thành công.

Nguồn: Fandung Blog