Nếu bạn thường xuyên chỉnh sửa mẫu template ắt hẳn bạn phải biết đến thẻ điều kiện tuy nhiên các thẻ điều kiện này nhiều lắm không tài nào nhớ nổi và tất nhiên bạn phải hiểu thẻ điều kiện đó là gì sử dụng thế nào mới hợp lý.
Đọc thêm: Danh sách tổng hợp các loại thẻ data mặc định trong blogspot
Danh sách thẻ điều kiện thông dụng
1. data:view.isMultipleItems: bao gồm các trang sau:
+ data:view.isHomepage: Trang chủ
+ data:view.isLabelSearch: Trang Nhãn
+ data:blog.searchLabel == "Tên nhãn" Trang tìm kiếm cho 1 nhãn cố định
+ data:view.isSearch: Các trang có /search đằng sau địa chỉ trang chủ
+ data:blog.searchQuery: Trang tìm kiếm từ khóa
+ data:view.isArchive: Trang lưu trữ
2. data:view.isSingleItem: Trang bài viết và trang tĩnh
+ data:view.isPost: Trang bài viết
+ data:view.isPage: Trang tĩnh
3. data:blog.postId == ";postID": Trang bài viết với điều kiện postID
4. data:blog.pageId == "pageID": Trang tĩnh với điều kiện pageID
5. data:view.isError: Trang báo lỗi 404
6. data:blog.url == data:blog.canonicalHomepageUrl + "Url": Điều kiện với Url
7. Các thẻ điều kiện chỉ hoạt động với widget Blog
+ data:post.isFirstPost: Bài viết đầu tiên
+ data:post.title: Tiêu đề bài viết
+ data:post.id == "post_ID": ID bài viết
+ data:label.name == "tên nhãn" Tên một nhãn cụ thể
+ data:post.firstImageUrl: Ảnh đầu tiên của bài viết
+ data:post.link: Liên kết tiêu đề
+ data:post.url: Url bài viết
+ ...
Cách sử dụng các thẻ điều kiện
+ Các thẻ điều kiện mà mình liệt kê ở phần trên phải được đặt trong cond='thẻ điều kiện' ví dụ: cond='data:view.isHomepage'
+ Thêm dấu chấm than (!) đằng trước thẻ nếu điều kiện đó không bằng, ví dụ cond='!data:view.isHomepage'
+ Nội dung trong thẻ điều kiện có thể là thẻ meta, css, javascript hay html
+ Từ mục 1 đến mục 5 có thể đặt bất cứ chỗ nào trong template nhưng phải đặt trong
- <b:if...> kết thúc bằng </b:if>, ví dụ <b:if cond='data:view.isHomepage'>
- <b:section ...> kết thúc bằng </b:section>, ví dụ: <b:section cond='data:view.isSingleItem' id='qc_bottom' name='QC_Bottom' showaddelement='false'>
- <b:widget...> kết thúc bằng </b:widget>, ví dụ <b:widget cond='data:view.isPost' id='PopularPosts1' locked='true' title='Phổ biến trong tuần' type='PopularPosts' version='1'>
+ Sử dụng 'and' hoặc 'or' hoặc <b:else/> kết hợp nhiều điều kiện trong một thẻ, ví dụ:
- Sử dụng với 'and': <b:widget cond='data:view.isMultipleItems and !data:blog.searchQuery' id='HTML3' locked='true' title='Quảng cáo' type='HTML' version='2' visible='false'>
- Sử dụng với 'or': <b:if cond='data:post.id == "postID 1" or 'data:post.id == "postID 2" or 'data:post.id == "postID n"'>
- Sử dụng với <b:else/> ví dụ:
<b:if cond='data:view.isMultipleItems and !data:view.isHomepage'>
// Nội dung
<b:else/>
<b:if cond='data:view.isHomepage'>
// Nội dung
<b:else/>
// Nội dung
</b:if></b:if>
+ Các thẻ điều kiện trong mục 6 chỉ được đặt trong widget Blog và trong thẻ <b:if...> kết thúc bằng </b:if>, ví dụ <b:if cond='data:post.isFirstPost'>
Một vài lưu ý:
+ Khi sử dụng thẻ điều kiện nên sử dụng kết hợp nhiều điều kiện trong một thẻ chẳng hạn khi đặt thẻ meta sử dụng cho các trang tiếp theo
<b:if cond='data:view.isSearch and !data:view.isLabelSearch and !data:blog.searchQuery'>
<title><data:messages.morePosts/> - <data:blog.title/></title>
<meta expr:content='data:messages.morePosts + " - " + data:blog.title' name='description'/>
</b:if>
Hoặc khi viết css cho trang tĩnh nhưng loại bỏ một trang cụ thể
<b:if cond='data:view.isPage and data:blog.pageId != "5383490038187241731"'>
<style>
#backer{display:none}
</style>
</b:if>
+ Nếu bắt buộc phải sử dụng thẻ điều kiện trong <b:if> thì mới sử dụng còn không cứ đặt thẻ điều kiện trực tiếp trong <b:section > hoặc <b:widget>. Lấy ví dụ cấu trúc HTML khi đặt thẻ <b:if>
<b:if cond='data:view.isSingleItem'>
<div class=sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' name='Sidebar' showaddelement='true'>
<b:widget...>...</b:widget>
</b:section>
</div>
</b:if>
Chúng ta có thể thiết kế lại như sau để tối ưu hơn:
<b:section cond='data:view.isSingleItem' class='sidebar-wrapper' id='sidebar' name='Sidebar' showaddelement='true'>
<b:widget...>...</b:widget>
</b:section>
Vì <b:section > hay <b:widget> khi tải trang đều ra thẻ <div> nên không cần thiết phải đặt <b:section > trong thẻ <div> mà đặt class trực tiếp trong <b:section >
+ Nếu đã đặt điều kiện trong <b:section > vẫn có thể đặt điều kiện trong <b:widget> nhưng phải điều kiện cho một trang cụ thể ví dụ:
<b:section cond='data:view.isSingleItem' class='sidebar-wrapper' id='sidebar' name='Sidebar' showaddelement='true'>
<b:widget cond='data:view.isPost'>...</b:widget>
<b:widget cond='data:view.isPage'>...</b:widget>
</b:section>
