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 có dạng chung như sau:
1. Trang chủ. ví dụ như: www.tips24h.net
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
Ví dụ: http://www.tips24h.net/p/contact.html
Đọ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.
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
<b:if cond='data:blog.url == data:blog.homepageUrl'>Bạn chú ý tới một so sánh khác là
Nội dung tùy chỉnh
</b:if>
<b:if cond='data:blog.url != data:blog.homepageUrl'>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.
Nội dung tùy chỉnh
</b:if>
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 == "item"'>3. Trang tĩnh
Nội dung tùy chỉnh
</b:if>
Ví dụ: http://www.tips24h.net/p/contact.html
<b:if cond='data:blog.pageType == "static_page"'>4. Trang index bao gồm trang chủ, trang hiển thị nhãn, và trang archive.
Nội dung tùy chỉnh
</b:if>
<b:if cond='data:blog.pageType == "index"'>5. Trang label (nhãn) ví dụ http://www.tips24h.net/search/label/Windows
Nội dung tùy chỉnh
</b:if>
<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"'>7. Trang lỗi 404
Nội dung tùy chỉnh
</b:if>
<b:if cond='data:blog.pageType == "error_page"'>8. Trang lưu trữ
Nội dung tùy chỉnh
</b:if>
<b:if cond='data:blog.pageType == "archive"'>9. Trang hiển thị trên mobile
Nội dung tùy chỉnh
</b:if>
<b:if cond='data:blog.pageType == "data:blog.isMobile"'>10. Bài viết đầu tiên
Nội dung tùy chỉnh
</b:if>
<b:if cond='data:post.isFirstPost'>11. Trang label search
Nội dung tùy chỉnh
</b:if>
<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'>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>
<b:if cond='Điều kiện'>
..............
<b:else/>
..............
</b:if>
<b:if cond='data:blog.pageType == "item"'>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:
<div style='float:left; margin:10px;'>
Mã quảng cáo đặt ở đây
</div>
</b:if>
<b:if cond='data:blog.pageType == "item"'>Ví dụ về sự kết hợp thẻ điều kiện với css
<b:if cond='data:post.isFirstPost'>
Mã quảng cáo đặt ở đây
</b:if>
</b:if>
<b:if cond='data:blog.pageType != "item"'>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.
<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>
Nhận xét
Đăng nhận xét