Cách ẩn hình ảnh trong bài viết chỉ hiển thị ở trang chủ

Đôi khi chúng ta muốn sử dụng 1 ảnh tượng trưng cho 1 bài viết ở bên ngoài trang chủ để bài viết của bạn trở nên đẹp và sống động hơn, nhưng làm thế thì trong nội dung bài viết đó cũng sẽ xuất hiện ảnh mà bạn đã chèn. Vậy có cách nào để ẩn ảnh đó đi trong bài viết nhưng vẫn hiển thị được trên trang chủ? Với vấn đề này, mình đã tìm ra được cách giải quyết như sau:

Bước 1: Đăng nhập Blogger/Mẫu/HTML

Bước 2: Click vào 1 vị trí bất kỳ trong vùng HTML/ ấn tổ hợp Ctrl+F

Bước 3: Tìm đến thẻ ]]></b:skin> , sau đó Copyđoạn code dưới đây dán vào ngay bên dưới thẻ ]]></b:skin>

[code type="HTML"]<b:if cond='data:blog.pageType != "index"'>

<style>

.hidepic{

display: none;

}

</style>

</b:if>[/code]

Bước 4: Lưu Template

Bước 5: Bây giờ mỗi khi bạn tạo bài viết mới, và thêm hình ảnh vào đó thì tự động trong phần HTML của bài viết đó sẽ có đoạn code tương tự sau:
[code type="JavaScript"]<div class="separator" style="clear: both; text-align: center;">

<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigv12-3PtUwDjnhhrRH_S_Kaap40MtgzF5f95IUs0bbR0OmYwpi4Jx6MAGB3L9wthPF6a5pT3CC8-APEvo91GVz20rr21ywo2_QdTkyRDnx0r3xRDp0-B67WcBMWt49YJO1DhacYrflQoG/s1600/Ketoanthanhtu-loi-l0009-sai-ma-phieu-giao-nhan.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="543" data-original-width="720" height="241" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigv12-3PtUwDjnhhrRH_S_Kaap40MtgzF5f95IUs0bbR0OmYwpi4Jx6MAGB3L9wthPF6a5pT3CC8-APEvo91GVz20rr21ywo2_QdTkyRDnx0r3xRDp0-B67WcBMWt49YJO1DhacYrflQoG/s320/Ketoanthanhtu-loi-l0009-sai-ma-phieu-giao-nhan.PNG" width="320" /></a></div>[/code]

Để ẩn ảnh khi xem bài viết bạn chỉ cần đổi "separator" thành “hidepic” và ngược lại

Ngoài ra bạn cũng có thể thay đổi ảnh hay kích thước ảnh tùy thích cho phù hợp với trang web của bạn nhờ vào những link và kích thướctrong đoạn code trên.

Nguồn: http://demotemplatemoi.blogspot.com

Chúc các bạn thành công!