Thành công!
TRUCBLOG JOURNAL GÓC ĐỌC • GÓC VIẾT
Bài viết / Góc chia sẻ

Tiện ích phân trang cho blogger

Đỗ Trực tháng 3 07, 2013 2 phút đọc 1 bình luận … Lượt xem
Đây là mãu phân trang mình sưu tầm với style đen rất dễ cài đặt và sử dụng. Khi cài đặt phân trang sẽ giúp blog của bạn nhìn rất chuyên nghiệp,đẹp mắt,thuận tiện theo dõi bài viết .Ngoài ra mình thấy thì tốc độ load trang cũng khá nhanh.Thôi bắt đầu thủ thuật nào !

Cách thực hiện :
B1- Đăng nhập vào blog
B2- Chọn Mẫu
B3- Chọn Chỉnh sửa HTML
B4- Chèn code bên dưới trước thẻ </body>
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<script type='text/javascript'>
var postperpage=10;
var numshowpage=4;
var upPageWord ='« Previous ';
var downPageWord ='Next »';
var urlactivepage=location.href;
var home_page="/";
</script>
<script type='text/javascript'>
//<![CDATA[
var nopage;var jenis;var nomerhal;var lblname1;halamanblogger();function loophalaman(banyakdata){var html='';nomerkiri=parseInt(numshowpage/2);if(nomerkiri==numshowpage-nomerkiri){numshowpage=nomerkiri*2+1}mulai=nomerhal-nomerkiri;if(mulai<1)mulai=1;maksimal=parseInt(banyakdata/postperpage)+1;if(maksimal-1==banyakdata/postperpage)maksimal=maksimal-1;akhir=mulai+numshowpage-1;if(akhir>maksimal)akhir=maksimal;html+="<span class='showpageOf'>Page "+nomerhal+' of '+maksimal+"</span>";var prevnomer=parseInt(nomerhal)-1;if(nomerhal>1){if(nomerhal==2){if(jenis=="page"){html+='<span class="showpage"><a href="'+home_page+'">'+upPageWord+'</a></span>'}else{html+='<span class="showpageNum"><a href="/search/label/'+lblname1+'?&max-results='+postperpage+'">'+upPageWord+'</a></span>'}}else{if(jenis=="page"){html+='<span class="showpageNum"><a href="#" onclick="redirectpage('+prevnomer+');return false">'+upPageWord+'</a></span>'}else{html+='<span class="showpageNum"><a href="#" onclick="redirectlabel('+prevnomer+');return false">'+upPageWord+'</a></span>'}}}if(mulai>1){if(jenis=="page"){html+='<span class="showpageNum"><a href="'+home_page+'">1</a></span>'}else{html+='<span class="showpageNum"><a href="/search/label/'+lblname1+'?&max-results='+postperpage+'">1</a></span>'}}if(mulai>2){html+=' ... '}for(var jj=mulai;jj<=akhir;jj++){if(nomerhal==jj){html+='<span class="showpagePoint">'+jj+'</span>'}else if(jj==1){if(jenis=="page"){html+='<span class="showpageNum"><a href="'+home_page+'">1</a></span>'}else{html+='<span class="showpageNum"><a href="/search/label/'+lblname1+'?&max-results='+postperpage+'">1</a></span>'}}else{if(jenis=="page"){html+='<span class="showpageNum"><a href="#" onclick="redirectpage('+jj+');return false">'+jj+'</a></span>'}else{html+='<span class="showpageNum"><a href="#" onclick="redirectlabel('+jj+');return false">'+jj+'</a></span>'}}}if(akhir<maksimal-1){html+='...'}if(akhir<maksimal){if(jenis=="page"){html+='<span class="showpageNum"><a href="#" onclick="redirectpage('+maksimal+');return false">'+maksimal+'</a></span>'}else{html+='<span class="showpageNum"><a href="#" onclick="redirectlabel('+maksimal+');return false">'+maksimal+'</a></span>'}}var nextnomer=parseInt(nomerhal)+1;if(nomerhal<maksimal){if(jenis=="page"){html+='<span class="showpageNum"><a href="#" onclick="redirectpage('+nextnomer+');return false">'+downPageWord+'</a></span>'}else{html+='<span class="showpageNum"><a href="#" onclick="redirectlabel('+nextnomer+');return false">'+downPageWord+'</a></span>'}}var pageArea=document.getElementsByName("pageArea");var blogPager=document.getElementById("blog-pager");for(var p=0;p<pageArea.length;p++){pageArea[p].innerHTML=html}if(pageArea&&pageArea.length>0){html=''}if(blogPager){blogPager.innerHTML=html}}function hitungtotaldata(root){var feed=root.feed;var totaldata=parseInt(feed.openSearch$totalResults.$t,10);loophalaman(totaldata)}function halamanblogger(){var thisUrl=urlactivepage;if(thisUrl.indexOf("/search/label/")!=-1){if(thisUrl.indexOf("?updated-max")!=-1){lblname1=thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?updated-max"))}else{lblname1=thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?&max"))}}if(thisUrl.indexOf("?q=")==-1&&thisUrl.indexOf(".html")==-1){if(thisUrl.indexOf("/search/label/")==-1){jenis="page";if(urlactivepage.indexOf("#PageNo=")!=-1){nomerhal=urlactivepage.substring(urlactivepage.indexOf("#PageNo=")+8,urlactivepage.length)}else{nomerhal=1}document.write("<script src=\""+home_page+"feeds/posts/summary?max-results=1&alt=json-in-script&callback=hitungtotaldata\"><\/script>")}else{jenis="label";if(thisUrl.indexOf("&max-results=")==-1){postperpage=20}if(urlactivepage.indexOf("#PageNo=")!=-1){nomerhal=urlactivepage.substring(urlactivepage.indexOf("#PageNo=")+8,urlactivepage.length)}else{nomerhal=1}document.write('<script src="'+home_page+'feeds/posts/summary/-/'+lblname1+'?alt=json-in-script&callback=hitungtotaldata&max-results=1" ><\/script>')}}}function redirectpage(numberpage){jsonstart=(numberpage-1)*postperpage;nopage=numberpage;var nBody=document.getElementsByTagName('head')[0];var newInclude=document.createElement('script');newInclude.type='text/javascript';newInclude.setAttribute("src",home_page+"feeds/posts/summary?start-index="+jsonstart+"&max-results=1&alt=json-in-script&callback=finddatepost");nBody.appendChild(newInclude)}function redirectlabel(numberpage){jsonstart=(numberpage-1)*postperpage;nopage=numberpage;var nBody=document.getElementsByTagName('head')[0];var newInclude=document.createElement('script');newInclude.type='text/javascript';newInclude.setAttribute("src",home_page+"feeds/posts/summary/-/"+lblname1+"?start-index="+jsonstart+"&max-results=1&alt=json-in-script&callback=finddatepost");nBody.appendChild(newInclude)}function finddatepost(root){post=root.feed.entry[0];var timestamp1=post.published.$t.substring(0,19)+post.published.$t.substring(23,29);var timestamp=encodeURIComponent(timestamp1);if(jenis=="page"){var alamat="/search?updated-max="+timestamp+"&max-results="+postperpage+"#PageNo="+nopage}else{var alamat="/search/label/"+lblname1+"?updated-max="+timestamp+"&max-results="+postperpage+"#PageNo="+nopage}location.href=alamat}
//]]>
</script>
</b:if>
</b:if>


B5- Chèn trước ]]></b:skin>

#blog-pager-older-link a,#blog-pager-newer-link a,a.home-link{width:80px;text-align:center;display:inline-block;color:#fff;font:bold 12px Arial;text-transform:none;margin:0;padding:5px 5px;background:#555;border:1px solid #111}
.blog-pager,#blog-pager{clear:both;font:bold 12px Arial;text-align:center;padding:15px 10px}
.showpageNum a,.showpage a{background:#fff;text-decoration:none;white-space:nowrap;color:#222;margin:10px 3px;padding:5px 10px;border:1px solid #999}
.showpageNum a:hover,.showpage a:hover{color:#fff;text-decoration:none;background-color:#444;border:1px solid #000}
.showpageOf{display:none;margin:0}
.showpagePoint{color:#fff;text-decoration:none;background-color:#444;font-size:12px;margin:10px 3px;padding:5px 10px;border:1px solid #000}



Chúc các bạn thành công !
Chia sẻ bài viết:
Ảnh đại diện tác giả

Đỗ Trực Tác giả / Admin

Chia sẻ kiến thức lập trình, phát triển web, công nghệ và các thủ thuật thực tế. Cảm ơn bạn đã ghé thăm Truc Blog.

Thảo Luận & Nhận Xét (1)

Công cụ bình luận nâng cao:
Nội quy bình luận của blog

Hãy cùng giữ phần thảo luận thân thiện, hữu ích và an toàn cho mọi người.

  1. Trao đổi lịch sự, tôn trọng người khác; góp ý vào nội dung, không công kích cá nhân.
  2. Bình luận đúng chủ đề bài viết; tránh spam, quảng cáo lặp lại hoặc đường dẫn đáng ngờ.
  3. Không đăng mật khẩu, số giấy tờ, thông tin liên hệ riêng tư hay dữ liệu nhạy cảm.
  4. Khi chia sẻ mã nguồn, hãy dùng công cụ mã hóa code để giữ nguyên ký tự và dễ đọc.
  5. Chỉ chia sẻ hình ảnh, video và tài liệu mà bạn có quyền sử dụng; không đăng nội dung vi phạm pháp luật.
  6. Quản trị viên có thể ẩn hoặc xóa nội dung spam, xúc phạm, không an toàn hoặc không phù hợp.
Biểu tượng cảm xúc nổi bậtChạm để sao chép
Công cụ Mã hóa HTML & Chèn Code vào Bình luận
* Nhấn Chèn Ảnh/Video, dán liên kết công khai rồi sao chép URL vào bình luận. Sau khi bình luận được đăng, mẫu sẽ tự hiển thị ảnh trực tiếp, video MP4/WebM hoặc video YouTube nếu URL thuộc định dạng được hỗ trợ. Blogger không cho tải tệp trực tiếp lên bình luận.

Nhận xét

  1. Site này của mình dùng code phân trang này nhưng kết quả ko giống hoàn toàn demo là sao nhỉ :(

    ==> http://font.vietdesigner.net/

    Trả lờiXóa