Bài này là dạng bài nâng cao dành cho những bạn thích tìm hiểu sâu về mã nguồn Blogger cho nên các bạn cần nắm được những thứ cơ bản nhất về Blogger trước thì mới hiểu được bài này còn không sẽ rất mơ hồ không hiều bài đang viết về cái gì.
Trước khi đi vào bài cụ thể mình sẽ ôn lại những kiến thức cơ bản để bạn nắm về nhóm trang và từng trang riêng biệt kèm theo điều kiện của nó, lưu ý với nhóm trang là tập hợp các trang và trang riêng biệt chỉ một loại trang duy nhất. Mình đánh dấu "-" đằng trước là nhóm trang và dấu "+" đằng trước là một trang
- Nhóm trang chỉ mục: data:view.isMultipleItems
+ Trang chủ: data:view.isHomepage
+ Trang lưu trữ: data:view.isArchive
- Nhóm trang tìm kiếm: data:view.isSearch
+ Trang các bài đăng cũ hơn: data:view.isSearch and !data:view.search.label and !data:view.search.query
+ Trang label: data:view.search.label
+ Trang tìm kiếm kết quả: data:view.search.query
- Nhóm trang bài viết và page: data:view.isSingleItem
+ Trang bài viết: data:view.isPost
+ Trang tĩnh: data:view.isPage
+ Trang 404: data:view.isError
Lưu ý: Trang 404 là một trang độc lập không thuộc nhóm trang nào cả, trang này sẽ hiển thị theo URL sai.
Tham khảo thêm: Cách sử dụng thẻ b:attr và b:class trong blogspot
Để viết điều kiện cho nhóm trang hoặc từng trang chúng ta sử dụng thẻ <b:if>, ví dụ:
<b:if cond='data:view.isHomepage'>
<!-- Nội dung chỉ hiển thị tại trang chủ -->
</b:if>
Ngoài viết điều kiện cho trang, chúng ta còn có thể viết điều kiện theo tên trang: data:blog.pageName hoặc điều kiện theo URL trang: data:view.url hoặc data:blog.url, ví dụ:
<b:if cond='data:blog.pageName == "Hỏi đáp Blogger"'>
<!-- Nội dung chỉ hiển thị tại trang có tên Hỏi đáp Blogger -->
</b:if>
<b:if cond='data:view.url == data:blog.canonicalHomepageUrl + "p/hoi-dap-blogger.html"'>
<!-- Nội dung chỉ hiển thị tại trang có URL bằng https://www.thietkeblogspot.com/p/hoi-dap-blogger.html -->
</b:if>
Vấn đề thứ hai là dạng bài đăng (posts) mà đã là bài đăng thì phải được xuất bản và nằm trang tiện ích Bài đăng trên Blog (Blog widget) và các bài đăng phải được đặt trong một mảng hay vòng lặp gọi chung là b:loop
<b:loop values='data:posts' var='post'>
<!-- Trích xuất thẻ dữ liệu bài đăng -->
</b:loop>
Nội dung cần nắm: Các thẻ dữ liệu sử dụng trong widget Blog version 2
Vấn đề thứ 3 nếu các bạn đã nắm được kiến thức của vấn đề 1+2 các bạn có thể căn thiệp vào vòng lặp bài đăng bằng bộ lọc. Nên áp dụng bộ lọc khi nào? Và sử dụng bộ lọc cho loại trang nào? là những yêu cầu mà bạn cần nắm để áp dụng trong Blogger.
Trong tất cả các loại trang thì trang chủ (data:view.isHomepage) luôn là trang quan trọng nhất hiển thị các bài đăng được xuất bản mới nhất, có thể cài đặt số bài hiển thị trong Cài đặt > Bài đăng, nhận xét và chia sẻ > Bài đăng > Hiển thị tối đa hoặc trong Bố cục > Chỉnh sửa Tiện ích Bài đăng trên Blog > Định cấu hình bài đăng trên Blog > Số bài đăng trên trang chính.
Lưu ý: Giới hạn số bài đăng của một trang không quá 500 hoặc kích thước trang không quá 1MB, để tìm hiểu thêm mời bạn đọc bài viết Tầm quan trọng của jumb break và số bài đăng tối đa hiển thị tại trang chỉ mục
Các bài đăng hiển thị tại nhóm trang chỉ mục luôn sắp xếp theo dạng tóm tắt để giảm tải kích thước trang. Bây giờ bạn sẽ áp dụng bộ lọc chỉ định hiển thị hoặc ẩn bài đăng nào đó tại một trang riêng biệt.
Giả sử trong một vòng lặp bài đăng tại một trang thuộc nhóm trang chỉ mục bạn cài đặt hiển thị 20 bài đăng và số bài đăng hiển thị đủ vì bạn đã thêm dấu ngắt nhảy cho từng bài đăng. Trong thẻ cấu hình <b:includable id='main'> của tiện ích Blog bạn có một vòng lặp chung cho các bài đăng như sau:
<b:loop values='data:posts' var='post'>
<b:include data='post' name='post'/>
</b:loop>
Để áp dụng bộ lọc cho posts trước tiên bạn sẽ sử dụng điều kiện cho trang trước, ví dụ bạn sẽ áp dụng bộ lọc posts tại trang chủ (data:view.isHomepage) hoặc trang lưu trữ (data:view.isArchive)
<!-- Điều kiện cho nhóm trang chỉ mục -->
<b:if cond='data:view.isMultipleItems'>
<!-- Điều kiện cho trang chủ hoặc trang lưu trữ -->
<b:if cond='data:view.isHomepage or data:view.isArchive'>
<!--Đặt b:loop với bộ lọc hoặc b:loop kèm điều kiện b:if -->
<b:include data='post' name='postFilter'/>
<!-- Điều kiện cho các trang còn lại thuộc nhóm trang chỉ mục -->
<b:else/>
<b:loop values='data:posts' var='post'>
<b:include data='post' name='postFilter'/>
</b:loop>
</b:if>
<!-- Điều kiện cho nhóm trang post và page -->
<b:else/>
<b:loop values='data:posts' var='post'>
<b:include data='post' name='post'/>
</b:loop>
</b:if>
Bài cần nắm: Cách sử dụng thẻ b:includable và b:include trong blogspot
Sử dụng bộ lọc where/filter
Áp dụng bộ lọc where/filter hiển thị các bài đăng có nhãn theo một hoặc một nhóm nhãn
+ Lọc hiển thị các bài đăng cho một nhãn
- Sử dụng bộ lọc where
<b:loop values='data:posts where (p => p.labels any (l => l.name == "Tên nhãn"))' var='post'>
<!-- Hiển thị các bài đăng có nhãn chỉ định -->
</b:loop>
Ví dụ
<b:loop values='data:posts where (p => p.labels any (l => l.name == "Thiết kế blogspot"))' var='post'>
<!-- Hiển thị các bài đăng có nhãn "Thiết kế blogspot" -->
</b:loop>
- Sử dụng bộ lọc filter
<b:loop values='data:posts filter (p => p.labels any (l => l.name == "Tên nhãn"))' var='post'>
<!-- Hiển thị các bài đăng có nhãn chỉ định -->
</b:loop>
Ví dụ
<b:loop values='data:posts where (p => p.labels any (l => l.name != "Thiết kế blogspot"))' var='post'>
<!-- Không hiển thị các bài đăng có nhãn "Thiết kế blogspot" -->
</b:loop>
Bài tham khảo: Sử dụng phép toán so sánh trong blogspot
+ Lọc hiển thị các bài đăng cho một nhóm nhãn
- Sử dụng bộ lọc where
<b:loop values='data:posts where (p => p.labels any (l => l.name in ["Nhãn 1","Nhãn 2","Nhãn n"]))' var='post'>
<!-- Hiển thị các bài đăng có nhãn "Nhãn 1","Nhãn 2","Nhãn n" -->
</b:loop>
Ví dụ
<b:loop values='data:posts where (p => p.labels any (l => l.name in ["Thiết kế blogspot","Thù thuật blogspot"]))' var='post'>
<!-- Hiển thị các bài đăng có nhãn "Thiết kế blogspot" ,"Thủ thuật blogspot" -->
</b:loop>
- Sử dụng bộ lọc filter
<b:loop values='data:posts filter (p => p.labels any (l => l.name in ["Nhãn 1","Nhãn 2","Nhãn n"]))' var='post'>
<!-- Hiển thị các bài đăng có nhãn "Nhãn 1","Nhãn 2","Nhãn n" -->
</b:loop>
Ví dụ
<b:loop values='data:posts where (p => p.labels any (l => l.name not in ["Thiết kế blogspot","Thù thuật blogspot"]))' var='post'>
<!-- Không hiển thị các bài đăng có nhãn "Thiết kế blogspot", "Thủ thuật blogspot" -->
</b:loop>
Sử dụng điều kiện <b:if> bên dưới <b:loop>
<b:loop values='data:posts' var='post'>
<!-- Đặt điều kiện b:if -->
</b:loop>
Một số ví dụ:
+ Hiển thị hoặc không hiển thị theo thứ tự bài đăng
<b:loop index='i' values='data:posts' var='post'>
<b:if cond='data:i not in [0,2,4]'>
<!-- Không hiển thị các bài đăng thứ tự 0,2,4 -->
</b:if>
</b:loop>
+ Hiển thị hoặc không hiển thị theo ID bài đăng
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.id not in [4837579377525016806,7789205810166521049]'>
<!-- Không hiển thị các bài đăng có id 4837579377525016806,7789205810166521049 -->
</b:if>
</b:loop>
Các bài viết tham khảo
- Cách làm ẩn bài đăng bất kỳ tại nhóm trang index và chặn công cụ tìm kiếm lập chỉ mục
- Cách làm ẩn một hoặc một số bài viết theo số thứ tự tại nhóm trang index
- Cách ghim một bài viết bất kỳ cố định đầu tiên tại trang chủ
- Hiển thị các bài viết tại trang chủ theo một nhãn hay một số nhãn cố định
- Tạo vòng lặp cho các nhóm bài viết tại một trang cố định
- Cách sử dụng điều kiện kết hợp 'AND' và 'OR' trong Blogspot
