Phân trang là một tính năng cần thiết cho blog của bạn khi mà danh sách bài viết của bạn trở nên đồ sộ, nó giúp khách viếng thăm blog của bạn dễ dàng điều hướng đến những trang kế tiếp hoặc trước đó. Hôm nay mình và các bạn sẽ lần lượt tạo phân trang cho blog của mình với các trang được đánh số thứ tự như hình bên dưới :

Nào chúng ta cùng từng bước thực hiện nhá :
Bước 1 : Đăng nhập vào Blogger : Dashboard > Design > Edit Html
Bước 2 : Sao lưu lại toàn bộ template trước khi tiến hành
Bước 3 : Tìm kiếm đoạn code sau :

]]></b:skin>

và thay thế bằng :

.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
text-decoration:none;
border: 1px solid #cccccc;
margin:0 3px;
padding:3px;
}
.showpageNum a:hover {
border: 1px solid #cccccc;
background-color:#cccccc;
}
.showpagePoint {
color:#333;
text-decoration:none;
border: 1px solid #cccccc;
background: #cccccc;
margin:0 3px;
padding:3px;
}
.showpageOf {
text-decoration:none;
padding:3px;
margin: 0 3px 0 0;
}
.showpage a {
text-decoration:none;
border: 1px solid #cccccc;
padding:3px;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#333333;
}
]]></b:skin>

Đây chỉ là phần css dùng để định dạng phân trang, bạn có thể chỉnh sửa lại tùy theo ý muốn của mình.

Bước 4 : Tìm đoạn code:

</body>

Và thay thế với :

<!--Page Navigation Starts-->
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord ='Previous';
var downPageWord ='Next';
</script>
<script src='https://www.thuthuatweb.net/download/blogger_pagenavi_min.js' type='text/javascript'/>
</b:if>
</b:if>
<!--Page Navigation Ends -->
</body>

Mình xin giải thích một số tham số ở đoạn code trên :
– pageCount : Số lượng bài viết hiển thị trên trang
– displayPageNum : Số lượng trang được đánh dấu sẽ hiển thị trên trang
– upPageWord và downPageWord được dùng để hiển thị trang trước và trang sau, các bạn có thể thay thế bằng những dòng chữ hay kí tự tùy ý.
Bước 5 : Bây giờ chúng ta sẽ chỉnh sửa thêm một vài thứ, mặc định thì blogger label sẽ hiển thị 20 bài viết trên một trang, chúng ta sẽ phải cắt giảm số lượng này xuống bằng 5 cho phù hợp với đoạn script phân trang mà chúng ta đã làm ở phía trên.
Các bạn tìm :

'data:label.url'

Và thay thế bằng :

'data:label.url + "?&max-results=5"'

Ở đây 5 là số lượng bài viết hiển thị trên một trang.
Bây giờ bạn đã có phân trang như ý muốn của bạn cho blog của mình rồi đấy.

Chúc các bạn thành công !

Chuyên Mục: Blogspot

Bài viết được đăng bởi webmaster