Saturday, February 25, 2012

Blog မွာ Page Navigation Bar ထည္႕မယ္ ..

WRITTEN BY © MOHPHA

ေအာက္ပါ ပံုအတိုင္း Blogger နဲ႕ Blogspot ေအာက္ေျခမွာ .. Home တို႕ Older Posts တို႕ ရဲ႕ေနရာမွာ Page Number ေတြနဲ႕ Page Navigation Bar နဲ႕ အစားထိုးၾကည္႕ပါမယ္ ...


Blogger Dashboard ထဲက Edit HTML ကိုသြားပါ ...
“Expand Widget Templates” ကို အမွန္ျခစ္ေပးထားလိုက္ပါ ...

CTRL+F ကိုႏွိပ္ျပီး  ]]></b:skin> ကိုရွာပါ .. ျပီးရင္ ေအာက္ပါ Code ေတြနဲ႕ အစားထိုးေပးျပီး SAVE TEMPLATE ျပဳလုပ္ေပးပါ ..



.paginator {
margin-top:60px;
font-size:1em;
}
.paginator table {
border-collapse:collapse;
table-layout:fixed;
width:100%;
}
.paginator table td {
padding:0;
white-space:nowrap;
text-align:center;
}
.paginator span {
display:block;
padding:3px 0;
color:#fff;
}
.paginator span strong,
.paginator span a {
padding:2px 6px;
}
.paginator span strong {
background:#ff6c24;
font-style:normal;
font-weight:normal;
}
.paginator .scroll_bar {
width:100%; height:20px;
position:relative;
margin-top:10px;
}
.paginator .scroll_trough {
width:100%; height:3px;
background:#ccc;
overflow:hidden;
}
.paginator .scroll_thumb {
position:absolute;
z-index:2;
width:0; height:3px;
top:0; left:0;
font-size:1px;
background:#363636;
}
.paginator .scroll_knob {
position:absolute;
top:-5px; left:50%;
margin-left:-10px;
width:20px; height:20px;
overflow:hidden;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhm7ygfZD-3zFy43GyX2RG-4Pr1rb0649PT97iAFHGOpp4oY2TyyOrV1sFQBsmR0fskW4QGtNI6W0H9GUFw0dPGddWCvAsQdmdM2V68Y4cYTd8pKGJBRskgm7RyYWsFPeREIxQlVia2yC0/s1600/slider_knob.gif) no-repeat 50% 50%;
cursor:pointer; cursor:hand;
}
.paginator .current_page_mark {
position:absolute;
z-index:1;
top:0; left:0;
width:0; height:3px;
overflow:hidden;
background:#ff6c24;
}

.fullsize .scroll_thumb {
display:none;
}

.paginator_pages {
width:600px;
text-align:right;
font-size:0.8em;
color:#808080;
margin-top:-10px;
}
]]></b:skin>

</body> ကို ရွာပါ ... ျပီးရင္ ဒီ Code ေတြနဲ႕ အစားထုိးေပးပါ ..

<script src='http://scriptabufarhan.googlecode.com/svn/trunk/paginator3000.js' type='text/javascript'></script>
<script type='text/javascript'>
var home_page=&quot;/&quot;;
var urlactivepage=location.href;
var postperpage=7;
var numshowpage=6;
</script>
<script src='http://scriptabufarhan.googlecode.com/svn/trunk/paginator3000-forblogger-v1.0.0.js' type='text/javascript'/>
</body>

var postperpage=7;
var numshowpage=6;
တို႕ကေတာ႔ မိမိ လိုသလိုျပင္ေပးပါ .. post per page ေတာ႔ Blog Home  ေပၚခ်င္တဲ႔ Post အေရအတြက္ျဖစ္ပါတယ္ ... Navigation Bar မွာ ေပၚခ်င္တဲ႔ Page အေရအတြက္ကို ေတာ႔ numshowpage မွာျပင္ေပးလို႕ရပါတယ္ ...
“Expand Widget Templates” ကို အမွန္ျခစ္ျပီး 'data:label.url' ကိုရွာျပီး ေအာက္ပါ Code နဲ႕အစားထိုး ပါ...

'data:label.url + &quot;?&amp;max-results=7&quot;' 7 ကို မိမိ လိုအပ္သလို ျပင္ေပးႏိုင္ပါတယ္ ..


0 ေ၀ဖန္ခ်က္မ်ား:

Post a Comment