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 :
Thêm trước đoạn đó mẫ Css
Bước 4 : Tìm đoạn code:
Và thêm đằng trước bằng đoạn code sau
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 ý.
Mọi thắc mắc và cần giúp đỡ vui lòng comment phía dưới nhé !
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 != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord ='Previous';
var downPageWord ='Next';
</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 ý.
Mọi thắc mắc và cần giúp đỡ vui lòng comment phía dưới nhé !