Làm thanh công cụ phân trang (PageNavi) cho bài viết

Trong blogger không có phân trang tự động nên ta phải tự tạo cho mình thanh công cụ này (PageNavi).Để thực hiện việc này cần phải làm các bước sau :
Đăng nhập Blogger Dashboard \ Design \ Edit HTML \Proceed\ Expand Widget Templates.
1: Tìm dòng code có dạng tương tự sau:

<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'>

Đặt đoạn code sau đây vào sau nó:

<b:includable id='page-navi'> <!-- Tiện ích phân trang PageNavi (1)--><br />     <div class="pagenavi"> <br />         <script type="text/javascript"><br />         var pageNaviConf = {<br />             perPage: 8, // Số bài viết hiển thị trên một trang<br />             numPages: 7, // Số trang hiển thị<br />             firstText: "First",<br />             lastText: "Last",<br />             nextText: "Next",<br />             prevText: "Prev"<br />         }<br />         </script><br /> <script type='text/javascript'><br /> //<![CDATA[<br /> function pageNavi(o){var m=location.href,l=m.indexOf("/search/label/")!=-1,a=l?m.substr(m.indexOf("/search/label/")+14,m.length):"";a=a.indexOf("?")!=-1?a.substr(0,a.indexOf("?")):a;var g=l?"/search/label/"+a+"?updated-<br /> <br /> max=":"/search?updated-max=",k=o.feed.entry.length,e=Math.ceil(k/pageNaviConf.perPage);if(e<=1){return}var n=1,h=[""];l?h.push("/search/label/"+a+"?max-results="+pageNaviConf.perPage):h.push("/?max-<br /> <br /> results="+pageNaviConf.perPage);for(var d=2;d<=e;d++){var c=(d-1)*pageNaviConf.perPage-1,b=o.feed.entry[c].published.$t,f=b.substring(0,19)+b.substring(23,29);f=encodeURIComponent(f);if(m.indexOf(f)!=-1){n=d}h.push(g+f<br /> <br /> +"&max-results="+pageNaviConf.perPage)}pageNavi.show(h,n,e)}pageNavi.show=function(f,e,a){var d=Math.floor((pageNaviConf.numPages-1)/2),g=pageNaviConf.numPages-1-d,c=e-d;if(c<=0){c=1}endPage=e+g;if((endPage-<br /> <br /> c)<pageNaviConf.numPages){endPage=c+pageNaviConf.numPages-1}if(endPage>a){endPage=a;c=a-pageNaviConf.numPages+1}if(c<=0){c=1}var b='<span class="pages">Pages '+e+' of '+a+"</span> ";if(c>1){b+='<a href="'+f<br /> <br /> [1]+'">'+pageNaviConf.firstText+"</a>"}if(e>1){b+='<a href="'+f[e-1]+'">'+pageNaviConf.prevText+"</a>"}for(i=c;i<=endPage;++i){if(i==e){b+='<span class="current">'+i+"</span>"}else{b+='<a href="'+f[i]+'">'+i+"</a>"}}if(e<a){b+='<a <br /> <br /> href="'+f[e+1]+'">'+pageNaviConf.nextText+"</a>"}if(endPage<a){b+='<a href="'+f[a]+'">'+pageNaviConf.lastText+"</a>"}document.write(b)};(function(){var b=location.href;if(b.indexOf("?q=")!=-1||b.indexOf(".html")!=-1){return}var <br /> <br /> d=b.indexOf("/search/label/")+14;if(d!=13){var c=b.indexOf("?"),a=(c==-1)?b.substring(d):b.substring(d,c);document.write('<script type="text/javascript" src="/feeds/posts/summary/-/'+a+'?alt=json-in-script&callback=pageNavi&max-<br /> <br /> results=99999"><\/script>')}else{document.write('<script type="text/javascript" src="/feeds/posts/summary?alt=json-in-script&callback=pageNavi&max-results=99999"><\/script>')}})();<br /> //]]><br /> </script><br /> <div class="clear" /> <br /> </div> <br /> </b:includable>

Tiếp tục tìm một trong các code sau:

<b:include name='nextprev'/>

Thay vào chính nó code sau

<!-- Tiện ích phân trang PageNavi (2)--><br /> <b:if cond='data:blog.pageType == "index"'><br /> <b:include name='page-navi'/><br /> <b:else/><br /> <b:if cond='data:blog.pageType == "archive"'><br /> <b:include name='page-navi'/><br /> </b:if><br /> </b:if>

Tìm dòng code sau : ]]></b:skin>
Thay vào trước nó code sau:

/* Tiện ích phân trang PageNavi (3)*/<br /> /*Thanh phân trang*/<br /> .pagenavi{<br />     clear:both;<br />     text-align:right;<br />     margin:25px 0 10px 0;<br />     font-size:.714em;<br />     font-weight:600;<br />     line-height:1.4em;<br /> }<br /> <br /> /*Màu link, nền các nút phân trang*/<br /> .pagenavi span,.pagenavi a{<br />     background:#e1e1e1;<br />     color:#555;<br />     border:1px solid #555;<br />     -moz-border-radius:3px;<br />     -webkit-border-radius:3px;<br />     border-radius:3px;<br />     -moz-box-shadow:0 1px 0 #FFF;<br />     -webkit-box-shadow:0 1px 0 #FFF;<br />     box-shadow:0 1px 0 #FFF;<br />     margin-left:5px;<br />     padding:4px 6px 3px;<br />     text-shadow:0 1px 0 #C2C2C2;<br /> }<br /> <br /> /*Màu link và nền khi rê chuột*/<br /> .pagenavi a:hover,.pagenavi .current{<br />     background:#29A07C;<br />     border:1px solid #00203B;<br />     text-shadow:0 -1px 0 #00203B;<br />     color:#fff;<br />     text-decoration:none;<br /> }<br /> <br /> .pagenavi .pages{background:none;border:none}

 Tự tạo nút Read More theo ý riêng trong Blogspot