widget navigasi halaman

Widget navigasi halaman ini adalah alternatif bagi bagi recent posts,older post dan home . Terletak dibahagian bawah blog. Cara ini lebih mudah sebab tidak perlu salin kod pada template, cuma letak kod pada add gadget sahaja. 

Kalau letak kat template, susah sedikit hendak mencari kod tempat dimana ia perlu diletakkan dan ada setengah tidak SESUAI dengan template yang ada.

Untuk membuatnya ikuti langkah langkah berikut:-

Login ke blogger klik Layout, pilih page elements >kemudian pilih Add Gadget

1. Masuk ke akaun blogger Anda dan pergi ke Design> Page Element
2. kemudian klik pada Add a Gadget
3. kemudian pilih HTML/JavaScript

kemudian paparan Add a gadget muncul-pilih basic.Dalam senarai tersebut pilih HTML/Javascript kemudian copy/paste script/kod berikut ini di dalam ruangan content.

Pada widget HTML/Javascript tersebut masukkan kod di bawah :-

---

 <style type="text/CSS">
. ShowpageArea a ( .showpageArea a {
text-decoration: underline; text-decoration:underline;
) }
showpageNum sebuah. ( .showpageNum a {
text-decoration: none; text-decoration:none;
border: 1px solid # 7AA1C3; border: 1px solid #7AA1C3;
margin: 0 3px; margin:0 3px;
padding: 3px; padding:3px;
) }
showpageNum sebuah hover: (. .showpageNum a:hover {
border: 1px solid # 7AA1C3; border: 1px solid #7AA1C3;
background-color: # F6F6F6; background-color:#F6F6F6;
) }
. ShowpagePoint ( .showpagePoint {
color: # 333; color:#333;
text-decoration: none; text-decoration:none;
border: 1px solid # 7AA1C3; border: 1px solid #7AA1C3;
background: # F6F6F6; background: #F6F6F6;
margin: 0 3px; margin:0 3px;
padding: 3px; padding:3px;
) }
. ShowpageOf ( .showpageOf {
text-decoration: none; text-decoration:none;
padding: 3px; padding:3px;
margin: 0 3px 0 0; margin: 0 3px 0 0;
) }
showpage a. ( .showpage a {
text-decoration: none; text-decoration:none;
border: 1px solid # 7AA1C3; border: 1px solid #7AA1C3;
padding: 3px; padding:3px;
) }
showpage a hover: (. .showpage a:hover {
text-decoration: none; text-decoration:none;
) }
showpageNum link:,.. showpage link: ( .showpageNum a:link,.showpage a:link {
text-decoration: none; text-decoration:none;
warna: 7AA1C3 #; color:#7AA1C3;
) }
</ Style> </style>

<script type="text/javascript"> <script type="text/JavaScript">

fungsi showpageCount (json) ( function showpageCount(json) {
var thisUrl = location.href; var thisUrl = location.href;
var htmlMap = Array baru (); var htmlMap = new Array();
= IsFirstPage thisUrl.substring var (thisUrl.length-5, thisUrl.length) == ". Com /"; var isFirstPage = thisUrl.substring(thisUrl.length-5,thisUrl.length)==" .com /";
var isLablePage = thisUrl.indexOf ("/ search / label /")!=- 1; var isLablePage = thisUrl.indexOf("/search/label/")!=-1;
var isPage = thisUrl.indexOf ("/ search? diperbaharui ")!=- 1; var isPage = thisUrl.indexOf("/search?updated")!=-1;
thisLable var = isLablePage? var thisLable = isLablePage ? thisUrl.substr (thisUrl.indexOf ("/ search / label /") 14, thisUrl.length): ""; thisUrl.substr(thisUrl.indexOf("/search/label/")+14,thisUrl.length) : "";
thisLable = thisLable.indexOf ("?")!=- 1? thisLable = thisLable.indexOf("?")!=-1 ? thisLable.substr (0, thisLable.indexOf ("?")): thisLable; thisLable.substr(0,thisLable.indexOf("?")) : thisLable;
thisNum var = 1; var thisNum = 1;
postNum var = 1; var postNum=1;
var itemCount = 0; var itemCount = 0;
var fFlag = 0; var fFlag = 0;
var eFlag = 0; var eFlag = 0;
var html =''; var html= '';
upPageHtml var =''; var upPageHtml ='';
downPageHtml var =''; var downPageHtml ='';

pageCount var = 2; var pageCount = 2;
var displayPageNum = 5; var displayPageNum = 5;
upPageWord var = 'Sebelumnya'; var upPageWord = 'Previous';
downPageWord var = 'Berikutnya'; var downPageWord = 'Next';

var labelHtml = '<span class="showpageNum"> <a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">'; var labelHtml = '<span class="showpageNum"><a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">';

for (var i = 0, post; post = json.feed.entry i []; i + +) ( for(var i=0, post; post = json.feed.entry[i]; i++) {
var timestamp = post.published. $ t.substr (0,10); var timestamp = post.published.$t.substr(0,10);
var title = post.title. $ t; var title = post.title.$t;
if (isLablePage) ( if(isLablePage){
if (!=''){ judul if(title!=''){
if (post.category) ( if(post.category){
for (var c = 0 post_category; post_category = [post.category c] c + +) ( for(var c=0, post_category; post_category = post.category[c]; c++) {
if (encodeURIComponent (post_category.term) == thisLable) ( if(encodeURIComponent(post_category.term)==thisLable){
if (itemCount == 0 | | (% pageCount itemCount == (pageCount-1))) ( if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if (thisUrl.indexOf (timestamp)! =- 1) ( if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum; thisNum = postNum;
) }

postNum + +; postNum++;
[HtmlMap htmlMap.length] = '/ search / label + + thisLable /' '? Diperbarui-max =' + timestamp + 'T00% 3A00% 3A00% 2B08% 3A00 & max-hasil =' pageCount +; htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;
) }
) }
) }
) / / End if (post.category) ( }//end if(post.category){

itemCount + +; itemCount++;
) }

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

if (judul !='') postNum + +; if(title!='') postNum++;
[HtmlMap htmlMap.length] = '/ search? Diperbarui-max =' + timestamp + 'T00% 3A00% 3A00% 2B08% 3A00 & max-hasil =' pageCount +; htmlMap[htmlMap.length] = '/search?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;
) }
) }
itemCount + +; itemCount++;
) }
) }

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

fFlag + +; fFlag++;
) }

if (p == (thisNum-1)) ( if(p==(thisNum-1)){
<+ ThisNum + html = '<span class="showpagePoint">' + 'span> /'; html += '<span class="showpagePoint">'+thisNum+'</span>';
) Else ( }else{
if (p == 0) ( if(p==0){
if (isLablePage) ( if(isLablePage){
html = labelHtml + '1 </ a> </ span> '; html = labelHtml+'1</a></span>';
) Else ( }else{
html + = '<span' class="showpageNum"> <a href="/"> 1 </ a> </ span>; html += '<span class="showpageNum"><a href="/">1</a></span>';
) }
) Else ( }else{
html + = '<span class="showpageNum"> <a href="'+htmlMap[p]+'">' + (p +1) <+ '/ a> </ span>'; html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +'</a></span>';
) }
) }

if (eFlag == 0 & & p == thisNum) ( if(eFlag ==0 && p == thisNum){
downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">' + downPageWord <+ '/ a> </ span>'; downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';
eFlag + +; eFlag++;
) }
) / / End if (p> = (thisNum-displayPageNum-1) & & <p (thisNum + displayPageNum)) ( }//end if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
) / / End for (var p = 0; htmlMap.length <p; p + +) ( }//end for(var p =0;p< htmlMap.length;p++){

if (thisNum> 1) ( if(thisNum>1){
if (! isLablePage) ( if(!isLablePage){
html =''+ upPageHtml + '' + html + ''; html = ''+upPageHtml+' '+html +' ';
) Else ( }else{
html =''+ upPageHtml + '' + html + ''; html = ''+upPageHtml+' '+html +' ';
) }
) }

html = '<div class="showpageArea"> <span style="COLOR: #000;" class="showpageOf"> Pages (' + (postNum-1 )+')</ span> '+ html; html = '<div class="showpageArea"><span style="COLOR: #000;" class="showpageOf"> Pages ('+(postNum-1)+')</span>'+html;

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

) }

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

if (isPage | | isFirstPage | | isLablePage) ( if(isPage || isFirstPage || isLablePage){
var pageArea = document.getElementsByName ("pageArea"); var pageArea = document.getElementsByName("pageArea");
blogPager var = document.getElementById ("blog-pager"); var blogPager = document.getElementById("blog-pager");

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

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

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

if (blogPager) ( if(blogPager){
blogPager.innerHTML = html; blogPager.innerHTML = html;
) }
) }

) }
</ Script> </script>

<script src="/feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999"; type="text/javascript"> </ script> <script src="/feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" ; type="text/javascript"></script>

---

Jika anda menggunakan domain selain daripada blogspot.com atau .com, perkataan .com yang berwarna perlu ditukarkan kepada domain anda. 

= Contohnya jika domain anda seperti .info atau.biz, tukarkan .com kepada .info atau .biz

Sesudah memasukkan kod tadi pada widget, Cari dan tarik widget HTML/Javascript tadi pada kedudukan dibawah blog post anda. 

Reminder --> Paste/Tarik dekat bawah blog Post tu okay

P/s : Selamat Berjaya. Siapa yang tak jadi tu, Icha tak boleh nak bantu la ea :)