Code phân trang cho blogspot

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 :




Hướng dẫn phân trang cho blogspot

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>


Thêm trước đoạn đó mẫ Css



.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ước 4 : Tìm đoạn code: </body>

Và thêm đằng trước bằng đoạn code sau

Code phân trang cho blogspot


<!--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 =&#39;Previous&#39;;
var downPageWord =&#39;Next&#39;;
</script>
<script src='http://www.thuthuatweb.net/download/blogger_pagenavi_min.js' type='text/javascript'/>
</b:if>
</b:if>
<!--Page Navigation Ends -->




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 ý.


Chúc Bạn Thành Công.!