Lên đầu trang
Xuống cuối trang

Blogspot theo mặc định sẽ chỉ hiển thị phần "Bài đăng cũ hơn" ở dưới bài viết. Nhưng ta có thể hack một chút để biến nó thành các phân trang 1/2/3/4/.... như hình
CHOIBLOG.TK -Tạo phân trang cho Blogspot
Đầu tiên, ta chèn đoạn code CSS sau vào ngay trên dòng ]]> trong phần chỉnh sửa HTML của Blog:

/* CSS THEM: Tạo phân trang cho Blogspot
-------------------*/
.showpageArea {padding: 0; margin:0;
}

.showpageArea a {border: 1px solid #000;
color: #fff;font-weight:normal;
padding: 3px 6px ;
margin:0px 4px;
text-decoration: none;
background-color: #6f6f6f;
}

.showpageArea a:hover {
font-size:11px;
border: 1px solid #00558f;
color: #575757;
background-color: #3D3D3D;
}

.showpageNum a {border: 1px solid #000;
color: #fff;font-weight:normal;
padding: 3px 6px ;
margin:0px 4px;
text-decoration: none;
}

.showpageNum a:hover {
font-size:11px;
border: 1px solid #00558f;
color: #575757;
background-color: #5D5D5D;
}

.showpagePoint {font-size:11px;
padding: 2px 4px 2px 4px;
margin: 2px;
font-weight: bold;
border: 1px solid #00558f;
color: #fff;
background-color: #1589a2;
}

.showpage a:hover {font-size:11px;
border: 1px solid #00558f;
color: #fff;
background-color: #1589a2;
}

.showpageNum a:link,.showpage a:link {
font-size:11px;
padding: 2px 4px 2px 4px;
margin: 2px;
text-decoration: none;
border: 1px solid #000;
color: #fff;
background-color: #6f6f6f;}
.showpageNum a:hover {font-size:11px;
border: 1px solid #00558f;
color: #fff;
background-color: #1589a2;
}

Tiếp theo, tạo một tiện ích HTML/javascript rồi dán đoạn code sau vào:

<script type="text/javascript">

var home_page_url = location.href;

var pageCount=5;
var displayPageNum=8;
var upPageWord ='Trang trước';
var downPageWord ='Trang sau';

function showpageCount(json) {
var thisUrl = home_page_url;
var htmlMap = new Array();
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';

for(var i=0, post; post = json.feed.entry[i]; i++) {

var timestamp1 = post.published.$t.substring(0,19)+post.published.$t.substring(23,29);
timestamp = encodeURIComponent(timestamp1);

var title = post.title.$t;

if(title!=''){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}

if(title!='') postNum++;
htmlMap[htmlMap.length] = '/search?updated-max='+timestamp+'&max-results='+pageCount;
}
}
itemCount++;

}

for(var p =0;p< htmlMap.length;p++){
if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
if(fFlag ==0 && p == thisNum-2){
if(thisNum==2){
upPageHtml = '<span class="showpage"><a href="/">'+ upPageWord +'</a></span>';
}else{
upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';
}

fFlag++;
}

if(p==(thisNum-1)){
html += '<span class="showpagePoint">'+thisNum+'</span>';
}else{
if(p==0){
html += '<span class="showpageNum"><a href="/">1</a></span>';
}
else{
html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +'</a></span>';
}
}
if(eFlag ==0 && p == thisNum){
downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';
eFlag++;
}
}
}
if(thisNum>1){
html = ''+upPageHtml+' '+html +' ';
}

html = '<div class="showpageArea">'+html;

if(thisNum<(postNum-1)){
html += downPageHtml;
}

if(postNum==1) postNum++;
html += '</div>';

var pageArea = document.getElementsByName("pageArea");
var blogPager = document.getElementById("blog-pager");

if(postNum <= 2){
html ='';
}

for(var p =0;p< pageArea.length;p++){
pageArea[p].innerHTML = html;
}

if(pageArea&&pageArea.length>0){
html ='';
}

if(blogPager){
blogPager.innerHTML = html;
}
}
</script>
<script src="/feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" type="text/javascript"></script>

Rồi kéo và thả nó vào dưới phần bài đăng trên blog như thế này:
CHOIBLOG.TK - Tạo phân trang cho BlogspotBlogspot

Ở đây "var pageCount=5;" là số bài viết sẽ hiển thị ở mỗi phân trang, còn var "displayPageNum=8;" là số phân trang. Lưu ý là thủ thuật này chỉ hoạt động khi số bài đăng trên blog bạn đủ nhiều, trong ví dụ này thì số bài viết mà blog của tôi cần phải nhiều hơn 5x9 = 45 bài thì tiện ích phân trang mới hoạt động. Bạn có thể điều chỉnh lại cho phù hợp. Save lại và kiểm tra kết quả. Chúc thành công.

Posted by ChoiBlogs.blogspot.com Thứ Hai, 11 tháng 1, 2010

0 comments

Đăng nhận xét

_ Khi nhận xét không phải xác minh từ.
_ Bạn nhận xét xong sẽ được quản lý duyệt.
_ Spam link vào nhận xét xem như bạn đã chưa nhận xét !
_ Ghé thăm tôi vào những lúc bạn vui hoặc buồn và khi cần hổ trợ gì đó !
_ Khi bài viết nào có lỗi: xin vui lòng góp ý chân thành! cảm ơn!!!

Nhãn Đám Mây

Software (755) Video (582) Video-Fun (227) Thủ Thuật Blog (211) System tools (184) Hài Kịch (182) Video-Pro (179) Pictures-Fun (161) Tin gì (156) Tin gì ? (154) THỦ THUẬT INTETNET (136) Wallpaper (123) Pictures-Girl Xinh (117) Gift of life (110) Internet Tools (105) Games (75) Template PTS (67) Skin-Gaw2 (66) Giải Trí (65) Others (60) Video-Shock (58) Thủ Thuật Máy Tính (48) Design Tools (46) Download Tools (43) Music (43) CSS ChoiBlogs (41) Anti-Virus (39) Sức Khoẻ (32) Kỹ Năng Sống (30) MultiMedia (28) Video-Tools (28) Cosplay (25) USB Tools (24) Browsers (22) Desktop (22) PDF Tools (22) Phim (22) Rar-Zip-Tool (22) Video-Animals (21) Burning- Convert (19) Thơ và Nhạc (19) Drivers (18) Hoài Linh (18) Media Player (18) Pictures-Pro (18) Rao Bán (18) Registry Tool (18) Thủ Thuật Yahoo (18) Khóa Thư Mục-WebĐen-EXE (15) Virus (15) Add or Remove Programs (14) Thơ (14) Video-SHOW (14) Phong Lee (13) Game-Web (12) Video-Tài Liệu (12) Hide-IP Tools (11) List Xem Nhanh ChoiBlogs (11) Photos -pictures tools (11) Video-Thể Thao (11) Free Licence (10) Office Tools (10) Task Manager Tool (10) Thủ Thuật Facebook (10) Thủ Thuật Photoshop (10) Thủ Thuật Youtube (10) Vietnam's Got Talent (10) WiFi Tools (10) -Cổ tích Việt Nam- (9) DVD-Tools (9) HDD Tool (9) Thủ Thuật Android (Thiết Bị Di Động) (9) Video- Sao Nối Ngôi (9) Video-Bình Tinh (9) Video-Music (9) Video-VÕ HẠ TRÂM (9) Video-Thời Sự (8) Video-Thủ Thuật Đời Sống (8) Defrag tools (7) Flash Tools (7) HTML Tool (7) Hacker Tool (7) MP3 Tools (7) Thuý Nga (7) Từ Khóa Google (7) Icon Tools (6) Kiếm Tiền Online (6) Music-Girl Xinh (6) Tình Yêu (6) Video-Gương Mặt Thân Quen 2016 (6) Chí Tài (5) Game Flash (5) Game Tools (5) Góc nhìn (5) Mobile Tools (5) Nguyen Thi Anh Vien (5) Translate Tools (5) Webcam Tool (5) skin-blog (5) Firewalls (4) Game-mini (4) Screensaver Tools (4) Video-Cờ Cá Ngựa (4) Video-Kim Tử Long (4) Video-Thể Hình (4) Font View (3) Templates (3) Windows 7 (3) Windows Tools (3) Actions PTS (2) Audio tools (2) Editing tools (2) Event-Online (2) Font (2) Game-DOWNLOAD (2) Game-MU Đại Thiên Sứ (2) Ghost WINDOWN (2) Host Free (2) Infographic (2) Keylogger Tools (2) Nghệ Sĩ Minh Béo (2) Nhật Cường (2) PTS Brush (2) PTS Style (2) Sống Đẹp (2) Video-Game (2) Video-Quân Sự (2) Đạo Đời (2) CPU-Tools (1) Camera (1) Camera giao thông (1) Chính Sách Mới - Pháp Luật (1) Coppy Tools (1) Công Nghệ (1) Cảnh Giác (1) Dương Thúy Vi-Wuhsu (1) File Hệ Thống (1) Files Manager (1) Game-Gaw2 (1) Ghost XP (1) Hack Blog (1) Hệ Điều Hành (1) Icon Cảm Xúc (1) Iphone-Tools (1) Khám Phá (1) Music- Pic-Pro (1) PDS PhoToShop (1) Phần Cứng (1) Portable (1) Soft-Test (1) Soft-Việt Hóa (1) Sách Nói (1) TIVI Online (1) Thủ Thuật - Proshow Producer (1) Thủ Thuật Mobile (1) Thủ Thuật-Cốc Cốc (1) Thủ Thuật Di Động (1) Thủ Thuật FireFox (1) Thủ Thuật Phần Cứng (1) Thủ Thuật office (1) Thủ Thuật Điện (1) Thủ Thuật Đời Sống (1) Tin-Bảo Mật (1) Tình Yêu và Cuộc Sống (1) Tiện Ích FireFox (1) Tiện Ích Mouse (1) Tuyển THành Viên (1) Tài Liệu - Biểu Mẫu (1) Tình Yêu Giới Tính (1) Tự Kỷ (1) Video Tools (1) Video-Công Nghệ (1) Video-Cảnh Giác (1) Video-Giao Thông (1) Video-Hướng Dẫn Làm (1) Video-Movie (1) Video-NSƯT Bạch Long (1) Video-Sáng Tạo (1) Video-Thủ Thuật - Proshow Producer (1) Video-Vietnam's Got Talent 2014 (1) Video-Đời Sống (1) Video-Ơn Trời Cậu Đây Rồi (1) Yahoo Chat (1) [Danh Sách] Karaoke MrChoiBlog (Karaoke-Beat-Chuẩn) (1)

Đăng ký nhận bài viết mới

Bài đăng phổ biến

New Commets