မိမိ Blog မွာ စာမ်က္ႏွာနံပါတ္ေလးေတြေပးနည္း

ဒီနည္းေလးကုိေတာ ့ဒီေနရာေလး ကေန သင့္ေတာ္သလို ဘာသာျပန္ ကူးယူထားျခင္းျဖစ္ပါတယ္။
ပထမဆုံးအေနနဲ႕ကေတာ့ ထုံးစံအတုိင္း Sign In  လုပ္ပါ။
ျပီးရင္…..Layout  Section ကုိသြားပါ။
Add a page Element ဆုိတဲ့ Link ကုိ Click လုပ္ပါ။

ျပီးရင္ေတာ့ HTML / JAVASCRIPT ဆိုတဲ့ Box ကေလးကုိ Click လုပ္ပါ။
window ေလးတစ္ခုေပၚလာပါလိမ့္မယ္။
အဲဒီ window ေလးေပၚလာရင္ ေအာက္ေဖာ္ျပပါ code ေလးေတြကုိ အဲဒီ window မွာ Copy & Paste  လုပ္ပါ။

.showpageArea {padding: 0 2px;margin-top:10px;margin-bottom:10px;
}
.showpageArea a {border: 1px solid #505050;
color: #000000;font-weight:normal;
padding: 3px 6px !important;
padding: 1px 4px ;margin:0px 4px;
text-decoration: none;
}
.showpageArea a:hover {
font-size:11px;
border: 1px solid #333;
color: #000000;
background-color: #FFFFFF;
}

.showpageNum a {border: 1px solid #505050;
color: #000000;font-weight:normal;
padding: 3px 6px !important;
padding: 1px 4px ;margin:0px 4px;
text-decoration: none;

}
.showpageNum a:hover {
font-size:11px;
border: 1px solid #333;
color: #000000;
background-color: #FFFFFF;

}
.showpagePoint {font-size:11px;
padding: 2px 4px 2px 4px;
margin: 2px;
font-weight: bold;
border: 1px solid #333;
color: #fff;
background-color: #000000;

}

.showpage a:hover {font-size:11px;
border: 1px solid #333;
color: #000000;
background-color: #FFFFFF;

}
.showpageNum a:link,.showpage a:link {
font-size:11px;
padding: 2px 4px 2px 4px;
margin: 2px;
text-decoration: none;
border: 1px solid #0066cc;
color: #0066cc;
background-color: #FFFFFF;}

.showpageNum a:hover {font-size:11px;
border: 1px solid #333;
color: #000000;
background-color: #FFFFFF;
}

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

var pageCount=5;
var displayPageNum=3;
var firstPageWord = ‘First’;
var endPageWord = ‘Last’;
var upPageWord =’Previous’;
var downPageWord =’Next’;

var labelHtml = ‘’;

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

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

itemCount++;
}

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

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

for(var p =0;p=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
if(fFlag ==0 && p == thisNum-2){
if(thisNum==2){
if(isLablePage){
upPageHtml = labelHtml + upPageWord +’’;
}else{
upPageHtml = ‘’+ upPageWord +’’;
}
}else{
upPageHtml = ‘’+ upPageWord +’’;
}

fFlag++;
}

if(p==(thisNum-1)){
html += ‘ ’+thisNum+’’;
}else{
if(p==0){
if(isLablePage){
html = labelHtml+’1’;
}else{
html += ‘1’;
}
}else{
html += ‘’+ (p+1) +’ ’;
}
}

if(eFlag ==0 && p == thisNum){
downPageHtml = ‘ ’+ downPageWord +’’;
eFlag++;
}
}//end if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
}//end for(var p =0;p< htmlMap.length;p++){

if(thisNum>1){
if(!isLablePage){
html = ‘’+ firstPageWord +’ ’+upPageHtml+’ ‘+html +’ ‘;
}else{
html = ”+labelHtml + firstPageWord +’ ’+upPageHtml+’ ‘+html +’ ‘;
}
}

html = ‘

Page ‘+thisNum+’ of
‘+(postNum-1)+’: ’+html;

if(thisNum<(postNum-1)){
html += downPageHtml;
html += ‘ ‘+endPageWord+’’;
}

if(postNum==1) postNum++;
html += ‘

’;

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

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

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

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

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

}

Grab this Widget ~ Blogger Accessories

 အထက္ေဖာ္ျပပါ code မ်ားမွ အနီေရာင္နဲ႔ ေရးထားတဲ့ နံပါတ္ေတြကေတာ့  စာရႈသူတုိ႔စိတ္ၾကိဳက္ ျပဳျပင္ႏိုင္
ပါတယ္။

ဥပမာအေနနဲ႕
var displayPageNum = 3; မွာ ၂ ထည့္လုိက္မယ္ဆုိရင္ စာရႈသူ Blog ရဲ႕ Page မွာ Post (၂)ခုေပၚမွာျဖစ္ပါတယ္။

အားလုံးျပီးျပီဆုိရင္ေတာ့ save လုပ္လုိက္ပါ။
အဲဒီေနာက္…

ပုံမွာျပထားတဲ့အတိုင္း ေနရာေျပာင္းေပးပါ။
အဲဒီေနာက္မွာေတာ့ Preview ျဖင့္ၾကည့္ျပီး save လုပ္ပါ။

မိမိရဲ႕ Blog က navbar ေလးျဖဳတ္နည္း

ကၽြန္ေတာ့ရဲ႕ Blog မွာပထမဆုံး Blogging နဲ႔ဆုိင္တဲ့ Post အျဖစ္နဲ႔ ဒီ navbar ျဖဳတ္နည္းကုိတင္ျပလုိက္ပါတယ္။တကယ္ေတာ့ဒီနည္းဟာ Blogger တုိင္းနီးနီး သိရွိျပီးၾကျပီးျဖစ္ပါတယ္။

navbar ျဖဳတ္နည္းကုိမသိေသးေသာ ညီအစ္ကုိေမာင္ႏွမမ်ားအတြက္တင္ျပလုိက္ပါတယ္။
တကယ္ေတာ႔ navbar ဆုိတာဟာ Blog ဖြင့္တုိင္း Blog page ရဲ႕အေပၚဆုံးမွာေတြ႔ရတဲ့ bar တစ္ခုျဖစ္ပါတယ္။

အဲဒီဘာေလးကုိေပ်ာက္ခ်င္ရင္ေတာ့အရင္ဆုံး………..Sign in လုပ္ပါ။ျပီးရင္….. Layout ကုိဝင္ပါ။Layout  မွတဆင့္ Edit  HTML ကုိဝင္ပါ။ျပီးရင္ေတာ႔ Expand Widget Templates ကုိ Mark လုပ္လုိက္ပါ။အဲဒီအဆင့္ေတြျပီးရင္ေတာ႔…../* Variable definitions ဆိုတဲ႔စာလုံးကုိရွာလုိက္ပါ။ယခုလုိေတြ႔ျမင္ရမွာျဖစ္ပါတယ္။

အဲဒီစာေၾကာင္းကုိေတြ႕ျပီဆုိရင္ေတာ့…အဲဒီစာေၾကာင္းအေပၚမွာေအာက္ေဖာ္ျပပါစာ
ေၾကာင္းေလးကုိ Copy and Paste လုပ္လုိက္ပါ။

#navbar-iframe {
display: none !important;
}

ျပီးရင္ Preview မွာ ၾကည့္ပါ။ navbar ေပ်ာက္သြားတာေတြ႕ျမင္ရပါလိမ့္မယ္။
ျပီးရင္ေတာ႔ေနာက္ဆုံးအဆင့္အေနနဲ႔ Save Template လုပ္ႏုိင္ပါျပီ။