Trong khi lập blog mới, các blogger đau đầu đối mặt đó là việc lựa chọn các chủ đề phù hợp với blog. Theme Right là những gì có chứa một số tính năng quan trọng. Giao diện người sử dụng dễ dàng là một trong những tính năng quan trọng nhất mà tất cả các blogger muốn trong blog của họ. Nó thực sự giúp người dùng duyệt các blog một cách dễ dàng Next & Previous. Nếu chủ đề blog của bạn có chứa các nút Next post và Previous post tồi tệ nhất hoặc bạn muốn thực hiện một số nút mới hơn trong bài viết này, mình sẽ chia sẻ một số nút Next post và Previous post đánh số tiếp theo và trước đó cho blogger.
Bước 1:
Nhấn Save để lưu lại
Bước 2:
Màu Đỏ
Màu Xanh
Màu Lục
Màu Tối
Xong lưu template lại. Bạn sẽ cảm thấy rất hài lòng khi làm xong chức năng Next post và Previous post cho blog của mình.
Hướng dẫn tạo Next post và Previous post đẹp cho blogspot
Bước 1:
- Đăng nhập Blogger => Template => Sao lưu mẫu lại đề phòng làm sai nhé
- Nhấp vào Chỉnh sửa HTML => Tìm đến </ body>
- Bây giờ dán code phía trên </ body>
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<script type='text/javascript'>
/*<![CDATA[*/
var postperpage=5;
var numshowpage=2;
var upPageWord ='« Previous Page';
var downPageWord ='Next Page »';
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> Nhấn Save để lưu lại
Bước 2:
- Đi tới Blogger => Template => Edit HTML
- Ấn Ctrl +F tìm kiếm ]]> </ b: skin>
- Copy 1 trong 4 code dưới đây đặt phía trên ]]> </ b: skin>
Màu Đỏ
//* Red Style ---------------------------------------- *//
#blog-pager{float:left;font-size:16px;line-height:normal;margin:0 20px;padding:2em 0}
.showpageNum a,.showpage
a,.showpagePoint{background:#e74c3c;border:none;border-bottom:3px solid
#862B20;color:#FFF;font-size:15px;font-family:open
sans;font-weight:700;margin-left:10px;border-radius:5px 5px 5px
5px;-webkit-border-radius:5px 5px 5px
5px;-moz-border-radius:5px;-o-border-radius:5px 5px 5px
5px;transition:background 400ms;-webkit-transition:background
400ms;-moz-transition:background 400ms;-o-transition:background
400ms;padding:10px 20px}
.showpageNum a:hover,.showpage
a:hover,.showpagePoint,.blog-pager-newer-link,.blog-pager-older-link,.home-link{background:#c0392b;color:#FFF}
.showpageOf{display:none!important}
@font-face{font-family:'font-style:normal;font-weight:700;src:local('OpenSansBold'),
local('OpenSans-Bold'),
url(http://themes.googleusercontent.com/static/fonts/opensans/v8/k3k702ZOKiLJc3WVjuplzHhCUOGz7vYGh680lGh-uXM.woff)
format('woff')}Màu Xanh
#blog-pager{float:left;font-size:16px;line-height:normal;margin:0 20px;padding:2em 0}
.showpageNum a,.showpage
a,.showpagePoint{background:#3498db;border:none;border-bottom:3px solid
#246EA0;color:#FFF;font-size:15px;font-family:open
sans;font-weight:700;margin-left:10px;border-radius:5px 5px 5px
5px;-webkit-border-radius:5px 5px 5px
5px;-moz-border-radius:5px;-o-border-radius:5px 5px 5px
5px;transition:background 400ms;-webkit-transition:background
400ms;-moz-transition:background 400ms;-o-transition:background
400ms;padding:10px 20px}
.showpageNum a:hover,.showpage
a:hover,.showpagePoint,.blog-pager-newer-link,.blog-pager-older-link,.home-link{background:#2980b9;color:#FFF}
.showpageOf{display:none!important}
@font-face{font-family:'font-style:normal;font-weight:700;src:local('OpenSansBold'),
local('OpenSans-Bold'),
url(http://themes.googleusercontent.com/static/fonts/opensans/v8/k3k702ZOKiLJc3WVjuplzHhCUOGz7vYGh680lGh-uXM.woff)
format('woff')}Màu Lục
#blog-pager{float:left;font-size:16px;line-height:normal;margin:0 20px;padding:2em 0}
.showpageNum a,.showpage
a,.showpagePoint{background:#2ecc71;border:none;border-bottom:3px solid
#208C4D;color:#FFF;font-size:15px;font-family:open
sans;font-weight:700;margin-left:10px;border-radius:5px 5px 5px
5px;-webkit-border-radius:5px 5px 5px
5px;-moz-border-radius:5px;-o-border-radius:5px 5px 5px
5px;transition:background 400ms;-webkit-transition:background
400ms;-moz-transition:background 400ms;-o-transition:background
400ms;padding:10px 20px}
.showpageNum a:hover,.showpage
a:hover,.showpagePoint,.blog-pager-newer-link,.blog-pager-older-link,.home-link{background:#27ae60;color:#FFF}
.showpageOf{display:none!important}
@font-face{font-family:'font-style:normal;font-weight:700;src:local('OpenSansBold'),
local('OpenSans-Bold'),
url(http://themes.googleusercontent.com/static/fonts/opensans/v8/k3k702ZOKiLJc3WVjuplzHhCUOGz7vYGh680lGh-uXM.woff)
format('woff')}Màu Tối
#blog-pager{float:left;font-size:16px;line-height:normal;margin:0 20px;padding:2em 0}
.showpageNum a,.showpage
a,.showpagePoint{background:#34495e;border:none;border-bottom:3px solid
#202D3A;color:#FFF;font-size:15px;font-family:open
sans;font-weight:700;margin-left:10px;border-radius:5px 5px 5px
5px;-webkit-border-radius:5px 5px 5px
5px;-moz-border-radius:5px;-o-border-radius:5px 5px 5px
5px;transition:background 400ms;-webkit-transition:background
400ms;-moz-transition:background 400ms;-o-transition:background
400ms;padding:10px 20px}
.showpageNum a:hover,.showpage
a:hover,.showpagePoint,.blog-pager-newer-link,.blog-pager-older-link,.home-link{background:#2c3e50;color:#FFF}
.showpageOf{display:none!important}
@font-face{font-family:'font-style:normal;font-weight:700;src:local('OpenSansBold'),
local('OpenSans-Bold'),
url(http://themes.googleusercontent.com/static/fonts/opensans/v8/k3k702ZOKiLJc3WVjuplzHhCUOGz7vYGh680lGh-uXM.woff)
format('woff')}Xong lưu template lại. Bạn sẽ cảm thấy rất hài lòng khi làm xong chức năng Next post và Previous post cho blog của mình.
Xuất thân là Quản Trị Kinh Doanh. Yêu thích Marketing Online và trở thành Blogger với gần 1000 bài viết về nhiều lĩnh vực. Blog cá nhân http://toilaquantri.com
ConversionConversion EmoticonEmoticon