Hướng dẫn tạo phân trang cho trang Label blogger – Blogspot 2017

Chia sẻ cách tạo phân trang mới nhất cho blogspot – blogger 

Hiện nay Blogger rất là phổ biến , vì tính chất của nó đơn giản dễ thiết kế web, nên người mới bắt đầu cũng có thể tự thiết kế web , blog cho chính mình, trong bài viết này kenhshare.net xin được hướng dẫn khắc phục 1 lỗi, mà rất có thể bạn đang khó khăn với nó, đó là lỗi phân trang cho blogspot bài viết này được cập nhật mới nhất 2017
loi phan trang
Lỗi phân trang blogger 2017
Thường lỗi phân trang trong blogspot sẽ không gặp phải khi bạn sử dụng với các template, mẫu thiết web/blog mà do blogger cung cấp, nhưng đối với các mẫu thiết kế blog của Bloger thì hầu hết đều rất cơ bản, chỉ làm blog cá nhân thì được nhưng để làm blog chuyên nghiệp hơn thì chúng ta cần tự thiết kế web hoặc là có thể sử dụng các bản thiết kế web để cho web được đẹp hơn, nhưng lỗi phân trang này thì chúng ta không thể bỏ qua nhé.

Hướng dẫn khắc phục lỗi phân trang cho blogspot

Khắc phục lỗi phân trang blogspot
Hình ảnh về cách đánh số phân trang cho blogspot
Hướng dẫn tạo phân trang cho Blogspot, Blogger, một cách tạo phân trang có đánh số cho Blogspot. Tiện ích còn được gọi với tên khác là Page Navigation, từ việc thay thế bộ điều hướng cũ của Blogger  “Older Posts” (Bài đăng cũ hơn) hay “Newer Posts” (Bài đăng mới hơn), tiện ích giúp tăng trải nghiệm người dùng. Bên cạnh đó, một phần nào tiện ích giúp blog của bạn trở nên chuyên nghiệp hơn.
Chúng ta bắt đầu :” hướng dẫn tạo phân trang cho blogspot – blogger 2017 ”

Các bước thực hiện

Bước 1: Bạn chèn đoạn CSS sau vào trên thẻ đóng </head>


<b:if cond=’data:blog.pageType != &quot;item&quot;’>
<b:if cond=’data:blog.pageType != &quot;static_page&quot;’>
<style type=’text/css’>
#blog-pager{background:#fff;clear:both;width:auto;padding:22px;line-height:normal;position:relative;display:block;text-align:left;overflow:visible;margin:20px 0 5px 0}
.showpage a,.showpageNum a,.showpagePoint,.showpageOf{position:relative;background:#fff;display:inline-block;font-size:13px;color:rgba(0,0,0,.8);padding:5px 8px;margin:0 4px 0 0;box-shadow:0 1px 4px 1px rgba(0,0,0,0.1);border-radius:2px;transition:all .3s}
.showpageNum a:before{content:”;position:absolute;top:0;bottom:0;left:0;right:0;box-shadow:inset 0 -2px 2px rgba(0,0,0,0.02);transition:box-shadow 0.5s}
.showpage a:hover,.showpageNum a:hover,.showpagePoint:hover{background:rgba(0,0,0,0.03);color:#333;position:relative;}
.showpagePoint{background:#2980b9;color:#fff;}
@media screen and (max-width:640px) {
#blog-pager {padding:12px;}
.showpage a,.showpageNum a,.showpagePoint,.showpageOf{margin:0 2px 2px 0;box-shadow:0 1px 2px 1px rgba(0,0,0,0.1);}}
@media screen and (max-width:320px) {
.showpage a,.showpageNum a,.showpagePoint,.showpageOf{padding:3px 6px}}
</style>
</b:if>
</b:if>

Bước 2: Chèn đoạn code sau lên trước thẻ đóng </body>

<script type=’text/javascript’>
var postperpage=7;
var numshowpage=3;
var upPageWord =’Prev’;
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>

Ghi chú: 7 là số bài viết hiển thị trên 1 trang ; 3 là số trang hiển thị trên phân trang ; Prev, Next:Các từ bạn có thể thay đổi: Trở lại – Tiếp theo.

Bước 3: Bạn tìm đoạn <b:includable id=’main’ var=’top’>, bên trong hàm này bạn sẽ thấy đoạn này

<!– navigation –>
    <b:include name=’nextprev’/>

Bước 4: Thay đoạn code trên bằng đoạn code sau:

<!– navigation –>
    <b:if cond=’data:blog.pageType == &quot;index&quot;’>
        <b:include name=’nextprev’/>
    <b:else/>
    <b:if cond=’data:blog.pageType == &quot;archive&quot;’>
        <b:include name=’nextprev’/>
    <b:else/>
        <b:if cond=’data:blog.homepageUrl != data:blog.url’>
<!– navigation –>
<b:include name=’nextprev’/>
</b:if>
    </b:if>
    </b:if> 



Lời kết
Đây là một thủ thuật rất bổ ích, cần thiết cho các bạn nào thiết kế website , Hãy lưu hướng dẫn tạo, fix lỗi phân trang cho blogspot này về máy vì rất có thể một ngày nào đó bạn sẽ cần.

Rate this post
Tags: ,

CÓ THỂ BẠN QUAN TÂM

Cách tạo apps facebook developer facebook
Cách tạo apps facebook developer facebook  Facebook apps 1 kho ứng dụng của facebook , chúng ta chưa thể tìm hiểu ...
Hướng dẫn sử dụng pixel quảng cáo Facebook mới cập nhật
Hướng dẫn sử dụng pixel quảng cáo Facebook  Facebook đã chính thức giới thiệu hệ thống pixel mới cho các tài ...
Chính sách & Quy định chung
Quy trình làm việc ( thiết kế website theo yêu cầu ) : + Bước 1 : Nhận yêu cầu của ...
Hướng dẫn đăng tin tự động lên facebook miễn phí mới nhất 06/2016
Thủ thuật đăng tin lên facebook tự động miễn phí mới nhất 2016 Chào mừng các bạn đến với kenhshare.net , ...