12/30/12

Phân trang cho blogger - Numbered Page Navigation For Blogger

Theo mặc định, Blogger đã có phân trang nhưng phân trang đó khó hiểu và có vẻ không đáp ứng được nhu cầu của người sử dụng blogspot. Thủ thuật blogger của itviet360 giới thiệu tới cộng đồng blogger 1 mẫu phân trang được khá nhiều blogger sử dụng. Những thủ thuật phân trang cho bloggspot đã được khá nhiều bạn giới thiệu tới. Và đó là một thủ thuật tuyệt vời, chúng ta dùng blogger ghen tị với Wordpress vì sự phân trang hoàn chỉnh của họ, nhưng blogger cũng đang khẳng định thế mạnh và nói lên blogger không hề thua kém Wordpress, thậm chí blogger còn có những ưu điểm lớn hơn.
thu thuat phan trang cho blogger
Đối với thủ thuật phân trang cho blogger mình giới thiệu dưới đây theo 2 cách làm. Tuy nhiên mình khuyến khích cách 1 vì khi thêm trực tiếp vào template có những ưu điểm lớn hơn.
CÁCH 1: Chỉnh sửa trong Template blogger
- Đăng nhập vào bảng điều khiển blogger, lựa chọn Layout (Mẫu) -> Edit HTML (chỉnh sửa HTML) và chọn vào Expand Widget Templates (mở rộng mẫu HTML)
- Tìm đến ]]></b:skin>

Và dán code dưới đây ngay bên trên:

.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;
}

Đó là Code CSS và các bạn có thể chỉnh sửa theo ý muốn của các bạn.
Tiếp theo tìm tới Code
</body>
Và dán code dưới đây ngay trên nó:
 
<!-- Phân trang cho blogger -->
<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://itviet360.googlecode.com/files/blogger_pagenavi_min.js' type='text/javascript'/>
</b:if>
</b:if>
<!-- Kết thúc phân trang cho blogger -->

var pageCount=5; Số bài viết hiển thị trong 1 trang (lưu ý: nên trùng khớp với bài viết các bạn cài đặt hiển thị trên trang chủ trong CÀI ĐẶT - BÀI ĐĂNG VÀ NHẬN XÉT)
var displayPageNum=5; Số trang hiển thị. Ví dụ hiển thị từ 1->5

Đối với bài viết trong 1 nhãn chúng ta cũng có những chỉnh sửa như sau:
Vẫn ở "mở rộng mẫu HTML" và tìm tới đoạn code
'data:label.url'
Và thay thế nó bằng
'data:label.url + "?&max-results=5"'
Sau đó lưu mẫu lại và xem kết quả !

CÁCH 2: Thêm Widget (tiện ích) phân trang cho blogger. Tiện ích này được thêm ngay dưới tiện ích Post.
- Có thể Copy nguyên code ở trên dán vào tiện ích
- Thêm tiện ích tự động ở bằng cách Add Widget tự động
Add Wiget for blogger
Sau đó tự động tạo và lưu 1 widget
------------------
Chúc các bạn thành công !

0 nhận xét:

Post a Comment