Đối với những nhà thiết kế web chuyên nghiệp bằng Blogspot thì thẻ điều kiện (hay if tag) là một thành phần không thể thiếu và có thể coi là quan trọng bậc nhất trong thiết kế blogspot. Thẻ điều kiện được sử dụng rất nhiều trong các template cao cấp.
Để hiểu rõ hơn về thẻ điều kiện, mình sẽ giải thích đơn giản như sau:
<b:if cond='giá trị'>
nội dung thực hiện khi giá trị trên là đúng
<b:else/>
nội dung thực hiện khi giá trị trên là sai
</b:if>
Hiểu đơn giản là như vậy thôi, khi bắt tay vào sử dụng thì bạn sẽ hiểu rõ hơn về cách thức hoạt động của nó. Giờ cùng xem có những thẻ điều kiện nào nhé!

Các thẻ điều kiện mới nhất

1. Thẻ điều kiện chỉ áp dụng cho trang chủ

<b:if cond='data:view.isHomepage'>
<!-- chỉ áp dụng cho trang chủ -->
</b:if>
hoặc
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<!-- chỉ áp dụng cho trang chủ -->
</b:if>

2. Thẻ điều kiện chỉ áp dụng cho trang bài viết

<b:if cond='data:view.isPost'>
<!-- chỉ áp dụng cho trang bài viết -->
</b:if>
hoặc
<b:if cond='data:blog.pageType == "item"'>
<!-- chỉ áp dụng cho trang bài viết -->
</b:if>

3. Thẻ điều kiện chỉ áp dụng cho trang tĩnh (dạng bacsiwindows.com/p/contact.html)

<b:if cond='data:view.isPage'>
<!-- chỉ áp dụng cho trang tĩnh -->
</b:if>
hoặc
<b:if cond='data:blog.pageType == "static_page"'>
<!-- chỉ áp dụng cho trang tĩnh -->
</b:if>

Thẻ điều kiện áp dụng cho 3 loại trang: Trang chủ, trang nhãn, trang lưu trữ

<b:if cond='data:view.isMultipleItems'>
<!-- chỉ áp dụng cho trang index -->
</b:if>
hoặc
<b:if cond='data:blog.pageType == "index"'>
<!-- chỉ áp dụng cho trang index -->
</b:if>

4. Thẻ điều kiện chỉ áp dụng cho trang search label (trang tìm kiếm nhãn)

<b:if cond='data:view.isLabelSearch'>
<!-- chỉ áp dụng cho trang nhãn -->
</b:if>
hoặc
<b:if cond='data:blog.searchLabel'>
<!-- chỉ áp dụng cho trang nhãn -->
</b:if>

5. Thẻ điều kiện chỉ áp dụng cho 1 nhãn cụ thể

<b:if cond='data:view.isLabelSearch == "Theme Blogspot"'>
<!-- áp dụng cho nhãn Theme Blogspot -->
</b:if>
hoặc
<b:if cond='data:blog.searchLabel == "Theme Blogspot"'>
<!-- áp dụng cho nhãn Theme Blogspot -->
</b:if>

6. Thẻ điều kiện chỉ áp dụng cho trang tìm kiếm (search)

<b:if cond='data:view.isSearch'>
<!-- áp dụng cho trang tìm kiếm -->
</b:if>
hoặc
<b:if cond='data:blog.searchQuery'>
<!-- áp dụng cho trang tìm kiếm -->
</b:if>

7. Thẻ điều kiện chỉ áp dụng cho trang lỗi (trang 404)

<b:if cond='data:view.isError'>
<!-- áp dụng cho trang lỗi (404 page) -->
</b:if>
hoặc
<b:if cond='data:blog.pageType == "error_page"'>
<!-- áp dụng cho trang lỗi (404 page) -->
</b:if>

8. Áp dụng cho trang lưu trữ (archive)

<b:if cond='data:view.isArchive'>
<!-- áp dụng cho trang lưu trữ -->
</b:if>
hoặc
<b:if cond='data:blog.pageType == "archive"'>
<!-- áp dụng cho trang lưu trữ -->
</b:if>

9. Áp dụng khi xem bằng điện thoại (mobile request)

<b:if cond="data:blog.isMobile">
<!-- hiển thị trên Mobile -->
<b:else/>
<!-- hiển thị trên PC -->
</b:if>
hoặc
<b:if cond='data:blog.isMobileRequest'>
<!-- hiển thị trên Mobile -->
<b:else/>
<!-- hiển thị trên PC -->
</b:if>

10. Áp dụng cho bài viết đầu tiên trên trang Index

<b:if cond='data:post.isFirstPost'>
<!-- áp dụng cho bài viết đầu tiên -->
</b:if>

11. Áp dụng cho trang bài viết và trang tĩnh

<b:if cond='data:view.isSingleItem'>
<!-- áp dụng cho trang bài viết và trang tĩnh -->
</b:if>
hoặc
<b:if cond='data:blog.url == data:post.url'>
<!-- áp dụng cho trang bài viết và trang tĩnh -->
</b:if>

12. Áp dụng nếu bài viết có ảnh thumbnail

<b:if cond='data:post.thumbnailUrl'>
<!-- áp dụng cho bài viết có ảnh thumbnail -->
</b:if>

13. Áp dụng khi tên tác giả bài viết là ...

<b:if cond='data:displayname == "TÊN_TÁC_GIẢ"'>
<!-- áp dụng cho tác giả bài viết đó -->
</b:if>

14. Áp dụng khi bài viết có số nhận xét bằng 1 số nhất định (69 là giá trị)

<b:if cond='data:post.numComments == 69'>
<!-- áp dụng khi bài viết đó có 69 nhận xét -->
</b:if>

15. Áp dụng khi bài viết cho phép đăng nhận xét

<b:if cond='data:post.allowComments'>
<!-- áp dụng khi bài viết cho phép nhận xét mới -->
</b:if>

16. Áp dụng ở trang xem trước bài viết

<b:if cond='data:view.isPreview'>
<!-- áp dụng ở trang xem trước bài viết -->
</b:if>

17. Áp dụng đối với nhãn cuối cùng

<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
<!-- content -->
</b:if>
</b:loop>

18. Áp dụng cho một trang cụ thể

<b:if cond='data:blog.url == data:blog.canonicalHomepageUrl + "2018/06/bsw-04-bsw-flat-blogging-responsive-template-for-blogspot.html"'>
<!-- chỉ áp dụng cho bài viết có URL như trên, chỉ lấy từ phần sau domain chính -->
</b:if>

Cách sử dụng các thẻ điều kiện

Tất cả các thẻ điều kiện bên trên chỉ là thẻ mở, vì vậy khi sử dụng bạn phải thêm thẻ đóng vào: </b:if>

Ví dụ:
<b:if cond='data:blog.pageType == "item"'>
<!-- Nội dung chỉ xuất hiện ở trang bài viết -->
</b:if>

Phủ định lại thẻ điều kiện

Là sao? Là như này, xem ví dụ để rõ:
<b:if cond='data:blog.pageType == "item"'>
<!-- nội dung chỉ xuất hiện ở trang bài viết -->
<b:else/>
<!-- nội dung sẽ xuất hiện ở tất cả, ngoại trừ trang bài viết -->
</b:if>
hoặe
<b:if cond='data:view.isPost'>
<!-- áp dụng cho trang bài viết -->
</b:if>
phủ định lại
<b:if cond='!data:view.isPost'>
<!-- áp dụng cho tất cả trang, trừ trang bài viết -->
</b:if>
tương tự với các thẻ khác cũng như vậy:
<b:if cond="data:blog.isMobile">
<!-- nội dung chỉ hiện ở Mobile -->
<b:else/>
<!-- nội dung sẽ hiện ở PC, không hiện ở Mobile -->
</b:if>

Lưu ý

Đối với những thẻ điều kiện này, khi bạn lưu Template, những kí tự " sẽ tự động được convert thành &quot; bạn không phải lo lắng gì hết nhé, vì mặc định Blogger nó như vậy. Đây không phải là lỗi. Bạn có thể áp dụng 3 4 hay 5 thẻ điều kiện vào cùng 1 lúc, điều này đòi hỏi trình độ khá cao nên các bạn beginners có thể sẽ không hiểu. Mình sẽ cho ví dụ như này, các bạn có thể tự tìm hiểu nhé.
<b:if cond='!data:blog.pageType == "item"'>
<b:if cond='data:view.isHomepage'>
<!-- trang chủ -->
<b:else/>
<b:if cond='data:view.isLabelSearch'>
<!-- trang nhãn -->
<b:else/>
<!-- trừ trang nhãn -->
</b:if>
</b:if>
</b:if>

Tổng kết

Trên đây là tất cả thẻ điều kiện mới nhất và chính xác nhất do mình sưu tầm được, hy vọng sẽ giúp ích cho các bạn trong thiết kế blogspot chuyên nghiệp. Chúc thành công!
0 bình luận
Tag
  • 0 bình luận
  • Mặt cười
  • Chèn ảnh
  • Mã hóa HTML
  • Lưu ý
  • Admin Panel
  • :))
    :((
    :D
    :(
    :)
    :-)
    ;)
    =))
    :p
    =.=
    ==
    ^_^
    /=he
    :*
    /=r
    /=l
    :v
    /=ok
    /=clap
    (y)
    (yy)
    /=hi
    /=j
    /=hup
    /=hd
    /=hl
    /=hr
    /=s
    <3
  • Chức năng này hiện chưa khả dụng, bấm vào đây để sử dụng tạm.
  • Hướng dẫn bình luận

    Chèn chữ in đậm: Chữ in đậm

    Chèn chữ in đậm: Chữ in nghiêng

    Chèn ảnh: [img]Link Ảnh[/img]


    Một số lưu ý khi bình luận

    Không đăng bình luận có nội dung khiêu dâm, 18+

    Không đăng bình luận có liên quan đến chính trị, nhà nước.

    Không đăng bình luận có nội dung phản động, kích động chiến tranh, thù địch.

    Không đăng bình luận có nội dung phản cảm, bêu rếu, nói xấu.

    Không đăng bình luận có nội dung tục tiểu, bậy bạ hay thậm chí "vô học".

    Không đăng bình luận có liên kết spam, dẫn đến những trang có nội dung xấu.

    Được đăng bình luận có mang tính đóng góp, xây dựng bài viết / blog.

    Được đăng bình luận có liên quan đến nội dung bài viết.

    Có thể góp ý, hay báo lỗi bài viết (thiếu ý, sai chính tả hay thiếu hình ảnh minh họa).

    Bấm Thông báo cho tôi bên dưới khung bình luận để nhận thông báo khi admin trả lời.

    Bạn có thể dùng ảnh động hoặc mã hóa code HTML để bình luận.

    Bấm vào đây để xem chi tiết hơn nội quy trên Blog.

  • Đây là khu vực quản trị, bạn không có quyền truy cập vào!
  • Một số lưu ý khi bình luận

    Vui lòng xem Hướng Dẩn Sử dụng trước khi bình luận

    Bấm Thông báo cho tôi bên dưới khung bình luận để nhận thông báo khi admin trả lời

    Mọi bình luận sai nội quy sẽ bị xóa mà không cần báo trước (xem nội quy)

    Nhớ bấm Thông báo cho tôi bên trên để nhận thông báo qua Email khi Admin trả lời nhé.