Thẻ điều kiện trong blogspot là thành phần khá hữu ích để bạn có thể tùy chỉnh hiển thị ở những trang nhất định như trang chủ, trang tĩnh, trang bài viết, trang lưu trữ, trang chứa url bất kỳ...Nếu sử dụng linh hoạt thẻ này kết hợp với html, css và jquery bạn sẻ làm được khá nhiều điều trong blogspot.
 

Tìm hiểu thẻ điều kiện if else trong blogspot

Thực ra có khá nhiều bài viết trên mạng nói về thẻ điều kiện này rồi nhưng mình post bài này nhằm tổng hợp kiến thức mà mình đã học được và nếu cần thì dỡ ra xem luôn, bài này như là một bài bookmark lại vậy thôi. Còn nếu bạn nào mới tìm hiểu blogspot chưa hiểu về thẻ này thì có thể lấy bài này tham khảo cũng tốt :)

Thẻ điều kiện có dạng chung như sau:

<b:if cond='Điều kiện'> Nội dung tùy chỉnh </b:if>

Nó bắt đầu bằng một thử mở với thuộc tính cond và thẻ đóng </b:if>

Danh sách thẻ điều kiện trong blogspot

1. Trang chủ. ví dụ như: www.tips24h.net

<b:if cond='data:blog.url == data:blog.homepageUrl'>
Nội dung tùy chỉnh
</b:if>

Bạn chú ý tới một so sánh khác là

<b:if cond='data:blog.url != data:blog.homepageUrl'>
Nội dung tùy chỉnh
</b:if>

Chú ý tới dấu: == và != tương ứng là so sánh bằng và không bằng.Nghĩa là nếu có dấu == thì chỉ hiển thị nội dung ở trang chủ, còn dấu != thì trừ trang chủ ra sẻ hiển thị tất cả các trang còn lại hay là trừ trang chủ ra.

2. Trang bài viết

Ví dụ như: http://www.tips24h.net/2014/12/huong-dan-cach-tao-form-lien-he-o-trang-tinh-blogspot.html

<b:if cond='data:blog.pageType == &quot;item&quot;'>
Nội dung tùy chỉnh
</b:if>

3. Trang tĩnh

Ví dụ: http://www.tips24h.net/p/contact.html

<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
Nội dung tùy chỉnh
</b:if>

4. Trang index bao gồm trang chủ, trang hiển thị nhãn, và trang archive.

<b:if cond='data:blog.pageType == &quot;index&quot;'>
Nội dung tùy chỉnh
</b:if>

5. Trang label (nhãn) ví dụ http://www.tips24h.net/search/label/Windows

<b:if cond='data:blog.searchLabel'> Nội dung tùy chỉnh </b:if>

6. Trang hoặc bài viết bất kỳ

<b:if cond='data:blog.url == "URL_Ở_Đây"'>
Nội dung tùy chỉnh
</b:if>

7. Trang lỗi 404

<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
Nội dung tùy chỉnh
</b:if>

8. Trang lưu trữ

<b:if cond='data:blog.pageType == &quot;archive&quot;'>
Nội dung tùy chỉnh
</b:if>

9. Trang hiển thị trên mobile

<b:if cond='data:blog.pageType == "data:blog.isMobile"'>
Nội dung tùy chỉnh
</b:if>

10. Bài viết đầu tiên

<b:if cond='data:post.isFirstPost'>
Nội dung tùy chỉnh
</b:if>

11. Trang label search

<b:if cond='data:blog.searchLabel'>
Nội dung tùy chỉnh
</b:if>

Cách áp dụng thẻ điều kiện trong blogspot

Đọc đoạn trên chắc bạn cũng hiểu thẻ điều kiện nó hiển thị ở đâu như thế nào rồi chứ nhỉ. Tuy nhiên nó không đơn thuần như thế mà bạn cần kết hợp chúng lại với nhau thông dụng nhất là áp dụng thẻ điều kiện để tối ưu thẻ meta tag trong blogspot.

<b:if cond='Điều kiện'>
..............
</b:if>
<b:if cond='Điều kiện'>
..............
<b:else/>
..............
</b:if>

Thêm một ví dụ nữa ví dụ bạn muốn chèn mã quảng cáo vào bài viết thì bạn chèn code sau vào. Muốn hiển thị vị trí nào thì bạn xác định vị trí đó và chèn đoạn code dưới vào thôi.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='float:left; margin:10px;'>
Mã quảng cáo đặt ở đây
</div>
</b:if>

Hoặc thêm một ví dụ nữa là chèn mã quảng cáo sau bài viết đầu tiên thì chèn code sau:

<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:post.isFirstPost'>
Mã quảng cáo đặt ở đây
</b:if>
</b:if>

Ví dụ về sự kết hợp thẻ điều kiện với css

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<style type='text/css'>
.post-body {color: yellow;}
</style>
<b:else/>
<b:if cond='data:blog.searchLabel'>
<style type='text/css'>
.post-body {color: blue;}
</style>
<b:else/>
<style type='text/css'>
.post-body {color: red;}
</style>
</b:if>
</b:if>
<b:else/>
<style type='text/css'>
.post-body {color: green;}
</style>
</b:if>

Còn khá nhiều điều thú vị mà bạn có thể khám phá thêm từ các thẻ điều kiện này. Hy vọng bài viết các thẻ điều kiện trong blogspot sẻ giúp ích cho nhiều người.