Các thẻ điều kiện trong blogspot

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.
 
thẻ điều kiện if else 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.
Donate MoMo: 035.45.48.599
Bài đăng mới hơn Bài đăng mới hơn Bài đăng cũ hơn Bài đăng cũ hơn

Bài đăng khác

8 nhận xét

Khi Comment hãy click vào "Thông báo cho tôi" để theo dõi phản hồi mới nhất từ admin
  1. cho em hỏi nghĩa là gì ạ?

    Trả lờiXóa
  2. Chào bạn, cho mình về cấu trúc:
    b:if cond='data:blog.pageType == "index"'>
    div class='newsfea'>
    b:if cond='data:blog.url == "http://www.thinghiemcoc.vn/search/label/tin%20tuc"'>
    Tin tức
    b:else/>
    bây giờ cái url của mình nó thêm thuộc tính hiển thị tối đa 6 bài 1 trang.
    Mình đã copy cái url paste chèn vào đoạn url bên trên kia mà không được. Không biết có lỗi nào ở chỗ này không? Giúp mình với, cám ơn bạn nhiều
    (mình bỏ dấu < để có thể đăng bình luận)

    Trả lờiXóa
  3. cảm ơn bạn cho các hàm < b if>, tôi đã ứng dụng vào XEMPFAUCET của tôi, chúc bạn vui vẻ hạnh phúc. Thân !

    http://xempfaucet.blogspot.com/

    Trả lờiXóa
  4. Thánh xem lại cái chữ "Replay" dưới avatar đi nhé Nó là "Reply" chú không phải "Replay" Còn nữa là blog của thánh có virus mã độc nhé Thánh xem lại các nguồn js của mình đi nhé

    Trả lờiXóa
    Trả lời
    1. Oke, thanks đúng là ẩu tả k để ý tới Replay luôn :D mấy cái js chắc là do ads, xin cảm ơn bạn

      Xóa
  5. Hiển thị code adsense trên mobile chèn vào chỗ nào bạn ơi?

    Trả lờiXóa
  6. Cho Mình hỏi, trang web mình làm có 6 ảnh slide, nhưng khi chạy đến ảnh thứ 6 thì dừng lại hẳn, mình muốn ảnh xoay lại từ đầu thì thêm lệnh gì. Cám ơn (


    Trả lờiXóa