March 25, 2014

Code phân trang cho blogspot

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 :

Code phân trang cho blogspot


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



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é !


Biểu tượng cảm xúcBiểu tượng cảm xúc