0 Nhận xét

Thẻ điều kiện Blogger/Blogspot là gì? Và tổng hợp các thẻ điều kiện mới nhất

Cập nhật: 13 thg 12, 2018 Lúc 22:19
Nếu bạn là một lập trình viên, hay đơn giản đang học công nghệ thông tin thì bạn sẽ biết chắc chắn bất kỳ ngôn ngữ lập trình nào cũng có câu (thẻ) điều kiện. Và hôm nay mình muốn nói cho các bạn cụ thể nhất về thẻ điều kiện cho Blogger, để tùy chỉnh một số thứ như tiện ích, css, javascript, html tùy chọn sẽ được hiện ở đâu, trang nào,… giúp bạn có một website vượt trội hơn. Về vấn đề sử dụng khá đơn giản nên các bạn có thể yên tâm nếu các bạn không biết gì và lập trình.
Thẻ điều kiện Blogger/Blogspot là gì? Và tổng hợp các thẻ điều kiện mới nhất

Thẻ điều kiện là gì và dùng để làm gì?

Thẻ điều kiện trong blogspot giúp các bạn tối ưu seo blogspot rất nhiều. Mình lấy ví dụ cho các bạn dễ hiểu, các bạn để ý lên logo của Nguyễn Duy Blog thì các bạn thấy rằng ở trang chủ thì logo này nằm trong thẻ <h1> còn ở các trang khác thì logo nằm trong thẻ <h2>. Và đó cũng chính là công dụng của thẻ điều kiện.
Cùng một vị trí nhưng ở trang này nó có nội dung này mà ở trang khác nó lại có nội dung khác đó là công dụng của thẻ điều kiện.

Cú pháp của một thẻ điều kiện

Thẻ điều kiện của Blogger có cú pháp như sau:
<b:if cond='điều-kiện'> </b:if>
"cond" là viết tắt của Condition có nghĩa là điều kiện, và thuộc tính này sẽ nhận giá trị điều kiện được đặt

Cách dùng thẻ điều kiện

Rất đơn giản các bạn chỉ cần áp dụng cú pháp trên và thêm nội dung cần thêm điều kiện phí trên thẻ đóng </b:if> nói chung là lằm giữa thẻ mở nó b:if và thẻ đóng /b:if và chèn trực tiếp trong Template của bạn.

Tổng hợp thẻ điều kiện

Phần 1. Các thẻ điều kiện

1. Trang chủ (Homepage)

<b:if cond='data:view.isHomepage'>
<!-- Nội dung chỉ hiển thị trên trang chủ -->
</b:if>
Theo version trước:
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<!-- Nội dung chỉ hiển thị trên trang chủ -->
</b:if>

2. Trang bài viết (item)

<b:if cond='data:view.isPost'>
<!-- Nội dung chỉ hiển thị trên trang bài viết -->
</b:if>
Theo version trước:
<b:if cond='data:blog.pageType == "item"'>
<!-- Nội dung chỉ hiển thị trên trang bài viết -->
</b:if>
Cho một trang bài viết cụ thể:
<b:if cond='data:blog.url == data:blog.canonicalHomepageUrl + "2016/03/postn.html"'>
<!-- Nội dung chỉ hiển thị trên trang bài viết có địa chỉ url Blog-cua-ban/2016/03/postn.html-->
</b:if>

3. Trang tĩnh (Static page)

<b:if cond='data:view.isPage'>
<!-- Nội dung chỉ hiển thị trên trang tĩnh static page -->
</b:if>
Theo version trước:
<b:if cond='data:blog.pageType == "static_page"'>
<!-- Nội dung chỉ hiển thị trên trang tĩnh static page -->
</b:if>
Cho một trang tĩnh cụ thể:
<b:if cond='data:blog.url == data:blog.canonicalHomepageUrl + "p/static.html"'>
<!-- Nội dung chỉ hiển thị trên trang bài viết có địa chỉ url Blog-cua-ban/p/static.html 'foo' -->
</b:if>

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

<b:if cond='data:view.isMultipleItems'>
<!-- Nội dung chỉ hiển thị trên các trang index: trang chủ, trang hiển thị nhãn, trang lưu trữ -->
</b:if>
Theo version trước:
<b:if cond='data:blog.pageType == "index"'>
<!-- Nội dung chỉ hiển thị trên các trang index: trang chủ, trang hiển thị nhãn, trang lưu trữ -->
</b:if>

5. Trang label search

<b:if cond='data:view.isLabelSearch'>
<!-- Nội dung hiển thị trên tất cả các trang nhãn label -->
</b:if>
................. <b:if cond='data:view.isLabelSearch == "blogger"'>
<!-- Nội dung chỉ hiển thị trên nhãn "blogger"-->
</b:if>
Theo version trước:
<b:if cond='data:blog.searchLabel'>
<!-- Nội dung hiển thị trên tất cả các trang nhãn label -->
</b:if>
................. <b:if cond='data:blog.searchLabel == "blogger"'>
<!-- Nội dung chỉ hiển thị trên nhãn "blogger"-->
</b:if>

6. Hiển thị nội dung cho kết quả tìm kiếm (ví dụ: /search?q=blogger)

<!-- Bao gồm trang tìm kiếm nhãn -->
<b:if cond='data:view.isSearch'>
… </b:if>
<!-- Chỉ các trang tìm kiếm -->
<b:if cond='data:view.isSearch and !data:view.isLabelSearch'>
… </b:if>
Theo version trước:
<b:if cond='data:blog.searchQuery'>
<!-- Nội dung hiển thị trên tất cả các trang tìm kiếm -->
</b:if>
................................... <b:if cond='data:blog.searchQuery == "blogger"'>
<!-- Nội dung chỉ hiển thị trên trang tìm kiếm với từ "blogger"-->
</b:if>

7. Trang lỗi 404

<b:if cond='data:view.isError'>
<!-- Nội dung chỉ hiển thị trên trang lỗi -->
</b:if>
Theo version trước:
<b:if cond='data:blog.pageType == "error_page"'>
<!-- Nội dung chỉ hiển thị trên trang lỗi -->
</b:if>

8. Trang lưu trữ (archive)

<b:if cond='data:view.isArchive'>
<!-- Nội dung chỉ hiển thị trên tất cả các trang lưu trữ archive-->
</b:if>
Theo version trước:
<b:if cond='data:blog.pageType == "archive"'>
<!-- Nội dung chỉ hiển thị trên tất cả các trang lưu trữ archive-->
</b:if>

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

<b:if cond="data:blog.isMobile">
<!-- Nội dung chỉ hiển thị trên trang mobile-->
</b:if>

10. Nội dung hiển thị cho những trang có nhiều bài viết trên cùng một trang, áp dụng này cho bài viết đầu tiên FirstPost

<b:if cond='data:post.isFirstPost'>
<!-- Nội dung cần trình bày -->
</b:if>

11. Nội dung hiển thị cho trang tĩnh Static Page và bài viết Item

<b:if cond='data:view.isSingleItem'>
<!-- Nội dung chỉ hiển thị với trang tĩnh và bài viết -->
</b:if>
Theo version trước:
<b:if cond='data:blog.url == data:post.url'>
<!-- Nội dung chỉ hiển thị với trang tĩnh và bài viết -->
</b:if>

12. Hiển thị nội dung nếu bài viết có ảnh thumbnail

<b:if cond='data:post.thumbnailUrl'>
<!-- Nội dung chỉ hiển thị với bài viết có ảnh thumbnail -->
</b:if>

13. Hiển thị một nội dung khi có Backlink

<b:if cond='data:post.showBacklinks'>
<!-- Nội dung chỉ hiển thị khi có backlink -->
</b:if>

14. Hiển thị nội dung cho Tác giả bài viết

<b:if cond='data:displayname == "author-name"'>
<!-- Nội dung cần trình bày -->
</b:if>

15. Hiển thị nội dung trên trang có số comments bằng một giá trị nào đó

<b:if cond='data:post.numComments == number'>
<!-- Nội dung cần trình bày -->
</b:if>

16. Hiển thị nội dung trong tất cả các trang khi chức năng comment được kích hoạt

<b:if cond='data:post.allowComments'>
<!-- Nội dung cần trình bày -->
</b:if>

17. Hiển thị nội dung ở trang Preview (xem trước)

<b:if cond='data:view.isPreview'>
… </b:if>

18. Điều kiện đối với nhãn (Label) cuối cùng

<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
<!-- Nếu ko phải nhãn cuối thì thêm ký tự đặc biệt vào phía sau -->
, </b:if>
</b:loop>

Phần 2. Cách sử dụng và kết hợp các thẻ điều kiện 

1. Áp dụng điều kiện xuất hiện hoặc không xuất hiện

 == Có nghĩa là chỉ xuất hiện trên trang này …..
!= Có nghĩa là xuất hiện trên tất cả các trang trừ trang này ra……

2. Dùng thêm thẻ <b:/else/>

Nếu muốn đưa vào một nội dung thay thế khi điều kiện đưa vào là sai, bạn cần thêm một thẻ <b:else> và cho nội dung vào giữa.
<b:if cond='data:view.isPost'>
Nội dung chỉ hiển thị trang bài viết Item <b:else/>
Nội dung hiển thị các trang còn lại </b:if>

3. Kết hợp của nhiều điều kiện (xuất hiện khi thỏa mãn các điều kiện)

<b:if cond='!data:blog.pageType == "item"'>
<b:if cond='data:view.isHomepage'>
<style type='text/css'>
.post-body {color: yellow;}</style>
<b:else/>
<b:if cond='data:view.isLabelSearch'>
<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:if>
Với đoạn code này thì có ý nghĩa xuất ở trang chủ thì .post-body có chữ màu yellow, nếu là trang nhãn sẽ có màu là blue, còn nếu là các trang khác sẽ có màu red.

4. Sử dụng điều kiện IN

<b:if cond='data:blog.pageType in {"static_page","item"}'>
Nội dung chỉ hiển thị Trang Tĩnh và trang Bài Viết </b:if>

5. Sử dụng điều kiện NOT IN

<b:if cond='data:blog.pageType not in {"static_page","item"}'>
Nội dung không hiển thị Trang Tĩnh và trang Bài Viết </b:if>

6. Sử dụng điều kiện AND

<b:if cond='data:view.isPage and data:view.isPost'>
Nội dung hiển thị Trang Tĩnh và Trang Bài Viết </b:if>

7. Sử dụng điều kiện OR

<b:if cond='data:view.isPage or data:view.isPost'>
Nội dung hiển thị hoặc Trang Tĩnh hoặc Trang Bài Viết </b:if>

8. Sử dụng điều kiện Else if

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
<b:elseif cond='data:blog.pageType == &quot;static_page&quot;'>
<data:post.body/>
<b:else/>
<data:post.snippet/>
</b:if>
Đoạn code trên tương đương với
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<data:post.body/>
<b:else/>
<data:post.snippet/>
</b:if>
</b:if>

Phần 3. Lưu ý 

Khi bạn chỉnh sửa code cho template của bạn, đôi khi dấu ngoặc kép (“) sẽ bị thay thế bằng ký tự quot;. Ví dụ như
<b:if cond='data:blog.pageType == "static_page"'>
sẽ được thay là
<b:if cond='data:blog.pageType == quot;static_pagequot;'>
Sử dụng điều kiện trong thẻ b:include hoàn toàn tương tự với thẻ b:if, bạn chỉ cần thêm vào thuộc tính cond='ĐIỀU KIỆN' của thẻ b:if vào thẻ b:include là xong.
Theo thichnet.com

Lời Kết

Bài viết trên có thể giúp bạn hiểu khá rõ phần nào về thẻ điều kiện cho Blogspot mà mình tập hợp lại cho các bạn. Chúc các bạn vui vẻ