Phân trang
thì có rất nhiều kiểu loại mẫu mã.Nhiều cách bố trí cài đặt ví dụ như áp dụng
theo cách chỉnh sửa HTML trong template hay là thêm một tiện ích.Để đơn giản
cho việc cài đặt cũng như dỡ bỏ khi cần thiết ở đây ta chỉ cần thêm một tiện
ích và dán code vào là xong.
Trong ảnh có tất cả 10 mẫu phân trang có đánh số thứ tự bên cạnh bạn thích loại nào thì lấy code tương ứng ở bên dưới
Trong ảnh có tất cả 10 mẫu phân trang có đánh số thứ tự bên cạnh bạn thích loại nào thì lấy code tương ứng ở bên dưới
Mẫu 1
<style
type='text/css'>
.blog-pager,#blog-pager{font-size:normal}
.showpageArea{font-family:verdana,arial,helvetica;color:#000;font-size:11px;margin:10px}
.showpageArea
a{color:#000;text-shadow:0 1px 2px #fff;font-weight:bold}
.showpageNum
a{color:#000;padding:3px 8px;margin:0 4px;text-decoration:none;border:1px solid
#999;-webkit-border-radius:3px;-moz-border-radius:3px;background:#f8b5a4
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJ7pZ_s652PDzO5rKqMWeLPqGEm4n3rUtpvo29fyEYeuUqmvVK6UYP80MCz2ldYxU26xpN0ntboQ5yKJnm_7g6p4M_ShPHKFyQXfFtfF_jxKXUdQgNICotflIpJkD4E6AOhlArvSajEfne/s90/pagenav1.png)
0 -60px repeat-x}
.showpageNum
a:hover{border:1px solid #888;background:#f7cac9
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJ7pZ_s652PDzO5rKqMWeLPqGEm4n3rUtpvo29fyEYeuUqmvVK6UYP80MCz2ldYxU26xpN0ntboQ5yKJnm_7g6p4M_ShPHKFyQXfFtfF_jxKXUdQgNICotflIpJkD4E6AOhlArvSajEfne/s90/pagenav1.png)
0 -30px repeat-x}.showpageOf{margin:0 4px 0 0}
.showpagePoint{color:#666;padding:3px
8px;margin:2px;font-weight:bold;-webkit-border-radius:3px;-moz-border-radius:3px;border:1px
solid #999;background:#f2f0f0
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJ7pZ_s652PDzO5rKqMWeLPqGEm4n3rUtpvo29fyEYeuUqmvVK6UYP80MCz2ldYxU26xpN0ntboQ5yKJnm_7g6p4M_ShPHKFyQXfFtfF_jxKXUdQgNICotflIpJkD4E6AOhlArvSajEfne/s90/pagenav1.png)
0 -5px repeat-x;text-decoration:none}"
</style>
<script
type='text/javascript'>
var
postperpage=5;//Số bài viết mỗi lần phân
trang
var
numshowpage=5;//Số nút phân trang
var
upPageWord="Prev";
var
downPageWord="Next";
var
home_page="/";
var
urlactivepage=location.href;
</script>
<script
type='text/javascript'
src='https://googledrive.com/host/0B7dsLzZ8KnJmWDFyelBrOTJfa0U/'></script>
Mẫu 2
<style
type='text/css'>
.blog-pager,#blog-pager{font-size:normal}.showpageArea{font-family:verdana,arial,helvetica;color:#000;font-size:11px;margin:10px}.showpageArea
a{color:#000;text-shadow:0 1px 2px #fff;font-weight:normal}.showpageNum
a{padding:3px 8px;margin:0 4px;text-decoration:none;border:1px solid
#999;-webkit-border-radius:3px;-moz-border-radius:3px;background:#b1a7c3
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiddkMbxhC8cvtVKrgRKagUsTq4x47bcqk53qbQuc3Gxtw0J44VGYOb0Px55MQYMDEmk7F3AMdDAmhtgYRKZwW3AcsdA8ahRVb4Yr3CRVFUBDIVqZWbSxL0FCZ6lDla63RRxrrYh_FTG3Wy/s90/pagenav2.png)
0 -60px repeat-x}.showpageNum a:hover{border:1px solid #888;background:#f7b36a
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiddkMbxhC8cvtVKrgRKagUsTq4x47bcqk53qbQuc3Gxtw0J44VGYOb0Px55MQYMDEmk7F3AMdDAmhtgYRKZwW3AcsdA8ahRVb4Yr3CRVFUBDIVqZWbSxL0FCZ6lDla63RRxrrYh_FTG3Wy/s90/pagenav2.png)
0 -30px repeat-x}.showpageOf{margin:0 4px 0
0}.showpagePoint{color:#444;text-shadow:0 1px 2px #333;padding:3px
8px;margin:2px;font-weight:700;-webkit-border-radius:3px;-moz-border-radius:3px;border:1px
solid #999;background:#f7d5b0
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiddkMbxhC8cvtVKrgRKagUsTq4x47bcqk53qbQuc3Gxtw0J44VGYOb0Px55MQYMDEmk7F3AMdDAmhtgYRKZwW3AcsdA8ahRVb4Yr3CRVFUBDIVqZWbSxL0FCZ6lDla63RRxrrYh_FTG3Wy/s90/pagenav2.png)
0 0 repeat-x;text-decoration:none}
</style>
<script>
var
postperpage=5;
var
numshowpage=5;
var
upPageWord="Prev";
var
downPageWord="Next";
var
home_page="/";
var
urlactivepage=location.href;
</script>
<script
src="https://googledrive.com/host/0B7dsLzZ8KnJmWDFyelBrOTJfa0U/"></script>
Mẫu 3
<style
type='text/css'>
.blog-pager,#blog-pager{font-size:normal}.showpageArea{font-family:verdana,arial,helvetica;color:#000;font-size:11px;margin:10px}.showpageArea
a{color:#000;text-shadow:0 1px 2px #fff;font-weight:normal}.showpageNum
a{padding:3px 8px;margin:0 4px;text-decoration:none;border-bottom:3px solid
#fe9a2e;background:#f7f8e0}.showpageNum a:hover{border-bottom:3px solid
#df01d7;background:#f6cee3}.showpageOf{margin:0 4px 0
0}.showpagePoint{color:#333;text-shadow:0 1px 2px #333;padding:3px
8px;margin:2px;font-weight:700;border-bottom:3px solid
#fe9a2e;background:#f8e0f7;text-decoration:none}
</style>
<script>
var
postperpage=5;
var
numshowpage=5;
var
upPageWord="Prev";
var
downPageWord="Next";
var
home_page="/";
var
urlactivepage=location.href;
</script>
<script
src="https://googledrive.com/host/0B7dsLzZ8KnJmWDFyelBrOTJfa0U/"></script>
Mẫu 4
<style
type='text/css'>
.blog-pager,#blog-pager{font-size:normal}.showpageArea{font-family:verdana,arial,helvetica;color:#000;font-size:11px;margin:10px}.showpageArea
a{color:#000;text-shadow:0 1px 2px #fff;font-weight:normal}.showpageNum
a{padding:2px 8px;margin:0 4px;text-decoration:none;border-bottom:2px solid
#5fb404;border-top:2px solid #5fb404;background:#effbf5}.showpageNum
a:hover{border-bottom:2px solid #df01d7;background:#a9f5f2;border-top:2px solid
#df01d7}.showpageOf{margin:0 4px 0 0}.showpagePoint{color:#fff;text-shadow:0
1px 2px #333;padding:2px 8px;margin:2px;font-weight:700;border-bottom:2px solid
#5e610b;border-top:2px solid #5e610b;background:#5e610b;text-decoration:none}
</style>
<script>
var
postperpage=5;
var
numshowpage=5;
var
upPageWord="Prev";
var
downPageWord="Next";
var
home_page="/";
var
urlactivepage=location.href;
</script>
<script
src="https://googledrive.com/host/0B7dsLzZ8KnJmWDFyelBrOTJfa0U/"></script>
Mẫu 5
<style
type='text/css'>
.blog-pager,#blog-pager{font-size:normal}.showpageArea{font-family:verdana,arial,helvetica;color:#000;font-size:11px;margin:10px}.showpageArea
a{color:#000;text-shadow:0 1px 2px #fff;font-weight:700}.showpageNum
a{padding:3px 8px;margin:0 4px;text-decoration:none;border:1px solid
#999;-webkit-border-radius:3px;-moz-border-radius:3px;background:#ddd
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimzIwSvk7SKtl5G-FA_T6CAPz-wMwQoGtK1NqptOiW_LB6xox5CtZn1fzNhxl6_sXgONzoq-trrgf10oENc-Qv_IeJdiAjA62NKVrXvI3rT8NhZ6_0khwLUmFJq-8W0pynQq2TaQYdtcQf/s75/wp1.jpg)
0 -50px repeat-x}.showpageNum a:hover{border:1px solid #888;background:#ccc
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimzIwSvk7SKtl5G-FA_T6CAPz-wMwQoGtK1NqptOiW_LB6xox5CtZn1fzNhxl6_sXgONzoq-trrgf10oENc-Qv_IeJdiAjA62NKVrXvI3rT8NhZ6_0khwLUmFJq-8W0pynQq2TaQYdtcQf/s75/wp1.jpg)
0 -25px repeat-x}.showpageOf{margin:0 4px 0
0}.showpagePoint{color:#fff;text-shadow:0 1px 2px #333;padding:3px
8px;margin:2px;font-weight:700;-webkit-border-radius:3px;-moz-border-radius:3px;border:1px
solid #999;background:#666
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimzIwSvk7SKtl5G-FA_T6CAPz-wMwQoGtK1NqptOiW_LB6xox5CtZn1fzNhxl6_sXgONzoq-trrgf10oENc-Qv_IeJdiAjA62NKVrXvI3rT8NhZ6_0khwLUmFJq-8W0pynQq2TaQYdtcQf/s75/wp1.jpg)
0 0 repeat-x;text-decoration:none}
</style>
<script>
var
postperpage=5;
var
numshowpage=5;
var
upPageWord="Prev";
var
downPageWord="Next";
var
home_page="/";
var
urlactivepage=location.href;
</script>
<script
src="https://googledrive.com/host/0B7dsLzZ8KnJmWDFyelBrOTJfa0U/"></script>
Mẫu 6
<style
type='text/css'>
.blog-pager,#blog-pager{font-size:normal}.showpageArea{font-family:verdana,arial,helvetica;color:#000;font-size:11px;margin:10px}.showpageArea
a{color:#000;text-shadow:0 1px 2px #fff;font-weight:700}.showpageNum
a{padding:3px 8px;margin:0 4px;text-decoration:none;border:1px solid
#919106;-webkit-border-radius:3px;-moz-border-radius:3px;background:#ddd
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVcrks17AVx0QS7gVY6wqm9gSsFKzyJ976P4vs1Z8EISVHdd3-uCMgNXb1R4m4gwaEpzmgFO9ptJPjUd-MZUm4jQLwS4Tt6aH2tlCCNgMQyflYutL05OoBYUEIOYzb2w2RZUGtW1lvZ6WW/s75/wp2.jpg)
0 -50px repeat-x}.showpageNum a:hover{border:1px solid #aeae0a;background:#ccc
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVcrks17AVx0QS7gVY6wqm9gSsFKzyJ976P4vs1Z8EISVHdd3-uCMgNXb1R4m4gwaEpzmgFO9ptJPjUd-MZUm4jQLwS4Tt6aH2tlCCNgMQyflYutL05OoBYUEIOYzb2w2RZUGtW1lvZ6WW/s75/wp2.jpg)
0 -25px repeat-x}.showpageOf{margin:0 5px 0
0}.showpagePoint{color:#fff;text-shadow:0 1px 2px #333;padding:3px
8px;margin:2px;font-weight:bold;-webkit-border-radius:3px;-moz-border-radius:3px;border:1px
solid #919106;background:#666
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVcrks17AVx0QS7gVY6wqm9gSsFKzyJ976P4vs1Z8EISVHdd3-uCMgNXb1R4m4gwaEpzmgFO9ptJPjUd-MZUm4jQLwS4Tt6aH2tlCCNgMQyflYutL05OoBYUEIOYzb2w2RZUGtW1lvZ6WW/s75/wp2.jpg)
0 0 repeat-x;text-decoration:none}
</style>
<script>
var postperpage=5;
var
numshowpage=5;
var
upPageWord="Prev";
var
downPageWord="Next";
var
home_page="/";
var
urlactivepage=location.href;
</script>
<script
src="https://googledrive.com/host/0B7dsLzZ8KnJmWDFyelBrOTJfa0U/"></script>
Mẫu 7
<style
type='text/css'>
.blog-pager,#blog-pager{font-size:normal}.showpageArea{font-family:verdana,arial,helvetica;color:#000;font-size:11px;margin:10px}.showpageArea
a{color:#fff}.showpageNum a{padding:3px 8px;margin:0
4px;text-decoration:none;background:#363636 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2dP7TBCmZvAmEcBstWy0TWc1-PBT2yHWrDET2kp-nexo9c9nN50AOL749afNL57aUI-Cz2-9X47ExaU_CyOEw1jI71GTaqLjsrdwHXvaAIRGKyRaJOQNg3u20VTFngl3VlFZiNu3DFlhI/s75/wp3.jpg)
0 -25px repeat-x}.showpageNum a:hover{background:#044697
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2dP7TBCmZvAmEcBstWy0TWc1-PBT2yHWrDET2kp-nexo9c9nN50AOL749afNL57aUI-Cz2-9X47ExaU_CyOEw1jI71GTaqLjsrdwHXvaAIRGKyRaJOQNg3u20VTFngl3VlFZiNu3DFlhI/s75/wp3.jpg)
0 -50px repeat-x}.showpagePoint{color:#fff;padding:3px
8px;margin:2px;font-weight:700;background:#e30000
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2dP7TBCmZvAmEcBstWy0TWc1-PBT2yHWrDET2kp-nexo9c9nN50AOL749afNL57aUI-Cz2-9X47ExaU_CyOEw1jI71GTaqLjsrdwHXvaAIRGKyRaJOQNg3u20VTFngl3VlFZiNu3DFlhI/s75/wp3.jpg)
0 0 repeat-x;text-decoration:none}.showpageOf{margin:0 5px 0 0}
</style>
<script>
var
postperpage=5;
var
numshowpage=5;
var
upPageWord="Prev";
var
downPageWord="Next";
var
home_page="/";
var
urlactivepage=location.href;
</script>
<script
src="https://googledrive.com/host/0B7dsLzZ8KnJmWDFyelBrOTJfa0U/"></script>
Mẫu 8
<style
type='text/css'>
.blog-pager,#blog-pager{font-size:normal}.showpageArea{font-family:verdana,arial,helvetica;color:#000;font-size:11px;margin:10px}.showpageArea
a{color:#fff}.showpageNum a{padding:3px 8px;margin:0
4px;text-decoration:none;border-top:2px solid #000;border-left:1px solid
#000;border-right:1px solid #000;border-bottom:1px solid #000;background:#666
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipPFQ-lF6Z95IO2vjWRncbxHeUD1cxQ8_ZD9AhcW4oLN0l7PbZEEekO5QN-SndwOLRSfXL8aqbXGJjDQcsEhbVh7Q0Buqajw4jt7Wsyx7ukQL4NGl66AS2-GjjLu5yu8YFyuyZ8ZIlKTBf/s75/wp4.jpg)
0 -25px repeat-x}.showpageNum a:hover{border-top:1px solid #999;border-left:1px
solid #999;border-right:1px solid #999;border-bottom:2px solid
#999;background:#999
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipPFQ-lF6Z95IO2vjWRncbxHeUD1cxQ8_ZD9AhcW4oLN0l7PbZEEekO5QN-SndwOLRSfXL8aqbXGJjDQcsEhbVh7Q0Buqajw4jt7Wsyx7ukQL4NGl66AS2-GjjLu5yu8YFyuyZ8ZIlKTBf/s75/wp4.jpg)
0 -50px repeat-x}.showpagePoint{color:#fff;padding:3px
8px;margin:2px;font-weight:700;border-top:2px solid #000;border-left:1px solid
#000;border-right:1px solid #000;border-bottom:1px solid #000;background:#000
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipPFQ-lF6Z95IO2vjWRncbxHeUD1cxQ8_ZD9AhcW4oLN0l7PbZEEekO5QN-SndwOLRSfXL8aqbXGJjDQcsEhbVh7Q0Buqajw4jt7Wsyx7ukQL4NGl66AS2-GjjLu5yu8YFyuyZ8ZIlKTBf/s75/wp4.jpg)
0 0 repeat-x;text-decoration:none}.showpageOf{margin:0 5px 0 0}
</style>
<script>
var
postperpage=5;
var
numshowpage=5;
var
upPageWord="Prev";
var
downPageWord="Next";
var
home_page="/";
var
urlactivepage=location.href;
</script>
<script
src="https://googledrive.com/host/0B7dsLzZ8KnJmWDFyelBrOTJfa0U/"></script>
Mẫu 9
<style
type='text/css'>
.blog-pager,#blog-pager{font-size:normal}.showpageArea{font-family:verdana,arial,helvetica;color:#000;font-size:11px;margin:10px}.showpageArea
a{color:#fff}.showpageNum a{padding:3px 8px;margin:0
4px;text-decoration:none;background:#333
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4XLkFn1LDCyAKlW9KpblkUTDpKZBxJKSFXTjNzR8pqTgWjswkVDDdyETHR9ujHeE0BNSo7vJ4gYZwcd1jB1BIeKhb5MgqmyduNfnYsfdWZLIxCIa92kWLgzsHbEhLcnRukLQls_nakqxo/s75/wp5.jpg)
0 -50px repeat-x}.showpageNum a:hover{background:#666 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4XLkFn1LDCyAKlW9KpblkUTDpKZBxJKSFXTjNzR8pqTgWjswkVDDdyETHR9ujHeE0BNSo7vJ4gYZwcd1jB1BIeKhb5MgqmyduNfnYsfdWZLIxCIa92kWLgzsHbEhLcnRukLQls_nakqxo/s75/wp5.jpg)
0 -25px repeat-x}.showpagePoint{color:#fff;padding:3px
8px;margin:2px;font-weight:700;background:#06a2b9
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4XLkFn1LDCyAKlW9KpblkUTDpKZBxJKSFXTjNzR8pqTgWjswkVDDdyETHR9ujHeE0BNSo7vJ4gYZwcd1jB1BIeKhb5MgqmyduNfnYsfdWZLIxCIa92kWLgzsHbEhLcnRukLQls_nakqxo/s75/wp5.jpg)
0 0 repeat-x;text-decoration:none}.showpageOf{margin:0 5px 0 0}
</style>
<script>
var
postperpage=5;
var
numshowpage=5;
var
upPageWord="Prev";
var
downPageWord="Next";
var
home_page="/";
var
urlactivepage=location.href;
</script>
<script
src="https://googledrive.com/host/0B7dsLzZ8KnJmWDFyelBrOTJfa0U/"></script>
Mẫu 10
<style
type='text/css'>
.blog-pager,#blog-pager{font-size:normal}.showpageArea{font-family:verdana,arial,helvetica;color:#fff;font-size:11px;margin:10px;padding:8px
20px;background:#333}.showpageArea a{color:#fff}.showpageNum a{padding:3px
8px;margin:0 4px;text-decoration:none;background:#666}.showpageNum
a:hover{background:#aeb404}.showpagePoint{color:#fff;padding:3px 8px;margin:2px;font-weight:700;background:#da6100;text-decoration:none}.showpageOf{margin:0
5px 0 0}
</style>
<script>
var
postperpage=5;
var
numshowpage=5;
var
upPageWord="Prev";
var
downPageWord="Next";
var
home_page="/";
var
urlactivepage=location.href;
</script>
<script
src="https://googledrive.com/host/0B7dsLzZ8KnJmWDFyelBrOTJfa0U/"></script>
Lưu ý
Để tiện ích phân trang chạy mượt mà không những tại trang chủ mà khi vào trang nhãn không bị hiện tượng liệt kê 1 dãy bài(20 bài)và có khi còn không thấy tiện ích phân trang đâu nữa.Các bạn cần làm thêm công việc sau:
Các bạn vào chỉnh sửa mẫu tìm tới những đoạn code có dạng:
Để tiện ích phân trang chạy mượt mà không những tại trang chủ mà khi vào trang nhãn không bị hiện tượng liệt kê 1 dãy bài(20 bài)và có khi còn không thấy tiện ích phân trang đâu nữa.Các bạn cần làm thêm công việc sau:
Các bạn vào chỉnh sửa mẫu tìm tới những đoạn code có dạng:
expr:href='data:label.url'
Và sửa nó thành:
expr:href='data:label.url + "?&max-results=5"'
Tiếp đến bạn đặt đoạn javascript dưới đây vào ngay sau thẻ <head>
<script type='text/javascript'>
//<![CDATA[
if(!location.href.match('max-results=')){if(location.href.match('/search/label/')){location.href = location.href + '?&max-results=5' ;}}
//]]>
</script>
//<![CDATA[
if(!location.href.match('max-results=')){if(location.href.match('/search/label/')){location.href = location.href + '?&max-results=5' ;}}
//]]>
</script>
Ở đây ta thống nhất mỗi lần phân trang trên mỗi trang hiển thị 5 bài và cài đặt
số bài ở trang chủ cũng là 5 và số nút phân trang(numshowpage) hiển thị cũng là
5 số nút này tùy thuộc vào độ rộng của khung post bài mà bạn có thể thay đổi
cho hợp lý.
Thế là xong, chúc các bạn thành công.
Theo: kartriderdautocrazy01.blogspot.com/
0 nhận xét:
Post a Comment