Thứ Năm, 20 tháng 8, 2015

Sử dụng thuộc tính b:if condition trong blogger

Trang chủ » blogger » Sử dụng thuộc tính b:if condition trong blogger

Có lẽ thuộc tính này không được nhiều người biết cho lắm. Trong hướng dẫn này mình hướng bạn cách sử dụng thuộc tính b:if condition.

Dùng b:if condition làm gì?

Khi bạn muốn phân loại trang web theo một chuyên mục nào đó mà muốn mỗi trang một style khác nhau bạn có thể sử dụng tiện ích này. Hay khi bạn muốn ẩn một thẻ div nào đó đi bạn cũng có thể sử dụng b:if condition.

Cú pháp :

<b:if cond='Điều kiện'>
Nội dung trong trang
</b:if>

Danh sách các điều kiện :

1. Trang items (trang nội dung bài viết chi tiết)

<b:if cond='data:blog.pageType == "item"'>

2. Trang Static pages (trang có định dạng kiểu http://erhay.com/p/index.html)

<b:if cond='data:blog.pageType == "static_page"'>

3. Archive pages (trang lưu trữ)

<b:if cond='data:blog.pageType == "archive"'>

4. Homepage (trang chủ)

<b:if cond='data:blog.url == data:blog.homepageUrl'>

5. Trang riêng biệt :

<b:if cond='data:blog.url == "Nhập Url tr"'>

6. Post and static pages

<b:if cond='data:blog.url == data:post.url'>

7. Label-search pages

<b:if cond='data:blog.searchLabel'>

8. Danh sách trang chính (bao gồm trang chủ, trang label, trang lưu trữ). Bạn muốn nó chỉ hiển thị ở những trang này thì dùng với cond như sau :

<b:if cond='data:blog.pageType == "index"'>

Áp dụng với style CSS:

Ví dụ bạn muốn Active Menu cho từng chuyên mục trong một menu dạng :

<ul>
<li class='menu1'><a href="URL chuyên mục 1">Chuyên mục 1</a></li>
<li class='menu2'><a href="URL chuyên mục 2">Chuyên mục 2</a></li>
<li class='menu3'><a href="URL chuyên mục 3">Chuyên mục 3</a></li>
</ul>

thì sử dụng CSS như sau (sau đó đặt trước </head>):

<style type="text/css">
<b:if cond='data:blog.url == "URL chuyên mục 1"'>
.menu1{color:red}
</b:if>
<b:if cond='data:blog.url == "URL chuyên mục 2"'>
.menu2{color:blue}
</b:if>
<b:if cond='data:blog.url == "URL chuyên mục 3"'>
.menu3{color:green}
</b:if>
</style>