Recent Posts လန္းလန္းေလးပါ

ကၽြန္ေတာ့္ဘေလာ့ထဲမွာ ေလာေလာဆည္ သံုးထားတဲ့
Recent Posts Widgအet ေလးပါ ..

Posts ေတြထဲက update အျဖစ္ဆံုးပို႔စ္ေတြကိုကို
ေဖာ္ျပေပးတဲ့ Widget ေလးျဖစ္ပါတယ္

အခုေဖာ္ျပေပးမယ့္ Widget ေလးကေတာ့
အျမင္တစ္မ်ိဳးဆန္းပါတယ္ ..

Widget ထဲမွာရွိေနတဲ့ Thumbnail ေတြေပၚကို Mouse တင္လိုက္ရင္ သက္ဆိုင္ရာ Thumbnail ေလးဟာ
360 ဒီဂရီ လည္ပတ္သြားမွာျဖစ္ပါတယ္ ..



ကဲ .. စလိုက္ၾကစို႔ ...

အရင္ဆံုး Blogger ကို Log in ၀င္လိုက္ပါ

ၿပီးရင္ Layout ကိုသြားပါ

Add a gadget ကိုႏွိပ္ပါ

ပြင့္လာတဲ့ထဲက HTML/Java Scripts ကို ယူပါ

ပြင့္လာတဲ့ထဲက Title ေနရာမွာ ႀကိဳက္တာထည့္ပါ ( ဥပမာ - Recent Posts ေပါ့)

ကုဒ္ထည့္ရမယ့္အကြက္မွာ ေအာက္ကကုဒ္ေတြကို ေကာ္ပီကူးၿပီး ထည့္ေပးလိုက္ပါ


 <style type="text/css" media="screen">
<!--

/* ========== Scrolling Recent Posts Widget By santosh143.com ======== */


#santosh143-widget {
    overflow: hidden;
    margin-top: 5px;
    padding: 0px 0px;
    height: 385px;
}

#santosh143-widget ul {
    width: 285px;
    overflow: hidden;
    list-style-type: none;
    padding: 0px 0px;
    margin: 0px 0px;
}

#santosh143-widget li {
    width: 270px;
    padding: 5px 5px;
    margin: 0px 0px 5px 0px;
    list-style-type: none;
    float: none;
    height: 80px;
    overflow: hidden;
    background: #fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQHWIOj79Blck9lJqiAo9YTuYyH00gyIYitv_sweYVH9BFcN9Tg1olEuO3lss3i9z5qr7gFz86B9crUaqs_x8Q-FoYnFGDYBIQi627U-KYHDaFeYVHN1KsgqpJlsZukEhUUGQDAtA4Dig/s1600/itmotesoe.cm+post.jpg) repeat-x;
    border: 1px solid #ddd;
}

#santosh143-widget li a {
    text-decoration: none;
    color: #4B545B;
    font-size: 12px;
    height: 18px;
    overflow: hidden;
    margin: 0px 0px;
    padding: 0px 0px 2px 0px;
}

#santosh143-widget img {
    float: left;
    margin-top: 10px;
    margin-right: 15px;
    background: #EFEFEF;
    border: 0;
}

#santosh143-widget img {
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
    padding: 4px;
    background: #eee;
    background: -webkit-gradient(linear, left top, left bottom, from(#eee), color-stop(0.5, #ddd), color-stop(0.5, #c0c0c0), to(#aaa));
    background: -moz-linear-gradient(top, #eee, #ddd 50%, #c0c0c0 50%, #aaa);
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 0 3px rgba(0,0,0,.7);
    -moz-box-shadow: 0 0 3px rgba(0,0,0,.7);
    box-shadow: 0 0 3px rgba(0,0,0,.7);
}

#santosh143-widget img:hover {
    -moz-transform: scale(1.2) rotate(-350deg);
    -webkit-transform: scale(1.2) rotate(-350deg);
    -o-transform: scale(1.2) rotate(-350deg);
    -ms-transform: scale(1.2) rotate(-350deg);
    transform: scale(1.2) rotate(-350deg);
    -webkit-box-shadow: 0 0 20px rgba(255,0,0,.4), inset 0 0 20px rgba(255,255,255,1);
    -moz-box-shadow: 0 0 20px rgba(255,0,0,.4), inset 0 0 20px rgba(255,255,255,1);
    box-shadow: 0 0 20px rgba(255,0,0,.4), inset 0 0 20px rgba(255,255,255,1);
}

.spydate {
    overflow: hidden;
    font-size: 10px;
    color: #0284C2;
    padding: 2px 0px;
    margin: 1px 0px 0px 0px;
    height: 15px;
    font-family: Tahoma,Arial,verdana, sans-serif;
}

.spycomment {
    overflow: hidden;
    font-family: Tahoma,Arial,verdana, sans-serif;
    font-size: 10px;
    color: #262B2F;
    padding: 0px 0px;
    margin: 0px 0px;
}

/* ========== Scrolling Recent Posts Widget By santosh143.com ======== */

-->

</style>

<script language='JavaScript'>
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfBt3Wfg4hIaoKM7i7dkgfoqU8KkQ3NdkEwItvBbSRtyHQ6W37GhDM8B9n_GGzHP6lNvaYpGZt_7RhgrAds0ppLztfqSCfkhyphenhyphenTCILtDIlO84B8ixkCBsxm70cUJ6CVx8ZA16B53gsDyzk/s1600/itmotesoe.com+no-thumbnail.png";
imgr[1] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfBt3Wfg4hIaoKM7i7dkgfoqU8KkQ3NdkEwItvBbSRtyHQ6W37GhDM8B9n_GGzHP6lNvaYpGZt_7RhgrAds0ppLztfqSCfkhyphenhyphenTCILtDIlO84B8ixkCBsxm70cUJ6CVx8ZA16B53gsDyzk/s1600/itmotesoe.com+no-thumbnail.png";
imgr[2] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfBt3Wfg4hIaoKM7i7dkgfoqU8KkQ3NdkEwItvBbSRtyHQ6W37GhDM8B9n_GGzHP6lNvaYpGZt_7RhgrAds0ppLztfqSCfkhyphenhyphenTCILtDIlO84B8ixkCBsxm70cUJ6CVx8ZA16B53gsDyzk/s1600/itmotesoe.com+no-thumbnail.png";
imgr[3] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfBt3Wfg4hIaoKM7i7dkgfoqU8KkQ3NdkEwItvBbSRtyHQ6W37GhDM8B9n_GGzHP6lNvaYpGZt_7RhgrAds0ppLztfqSCfkhyphenhyphenTCILtDIlO84B8ixkCBsxm70cUJ6CVx8ZA16B53gsDyzk/s1600/itmotesoe.com+no-thumbnail.png";
imgr[4] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfBt3Wfg4hIaoKM7i7dkgfoqU8KkQ3NdkEwItvBbSRtyHQ6W37GhDM8B9n_GGzHP6lNvaYpGZt_7RhgrAds0ppLztfqSCfkhyphenhyphenTCILtDIlO84B8ixkCBsxm70cUJ6CVx8ZA16B53gsDyzk/s1600/itmotesoe.com+no-thumbnail.png";
showRandomImg = true;
boxwidth = 250;
cellspacing = 6;
borderColor = "#232c35";
bgTD = "#000000";
thumbwidth = 50;
thumbheight = 50;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = true;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 10;
home_page = "http://itmotesoeway.blogspot.com/";
limitspy=4;
intervalspy=4000;
</script>

<div id="santosh143-widget">
<script type='text/javascript'>
jQuery(function(){jQuery("ul.spy").simpleSpy(limitspy,intervalspy).bind("mouseenter",function(){jQuery(this).trigger("stop")}).bind("mouseleave",function(){jQuery(this).trigger("start")})});(function(e){e.fn.simpleSpy=function(f,g){f=f||4;g=g||5000;return this.each(function(){var l=e(this),k=true,i=[],m=f,o=0,h=l.find("> li:first").height();l.find("> li").each(function(){i.push("<li>"+e(this).html()+"</li>")});o=i.length;l.wrap('<div class="spyWrapper" />').parent().css({height:h*f});l.find("> li").filter(":gt("+(f-1)+")").remove();l.bind("stop",function(){k=false}).bind("start",function(){k=true});function n(){if(k){var p=e(i[m]).css({height:0,opacity:0,display:"none"}).prependTo(l);l.find("> li:last").animate({opacity:0},1000,function(){p.animate({height:h},1000).animate({opacity:1},1000);e(this).remove()});m++;if(m>=o){m=0}}setTimeout(n,g)}n()})}})(jQuery);function showrecentposts(z){document.write('<ul class="spy">');j=(showRandomImg)?Math.floor((imgr.length+1)*Math.random()):0;img=new Array();for(var o=0;o<numposts;o++){var w=z.feed.entry[o];var g=w.title.$t;var f;var p;if(o==z.feed.entry.length){break}for(var l=0;l<w.link.length;l++){if(w.link[l].rel=="alternate"){p=w.link[l].href;break}}for(var l=0;l<w.link.length;l++){if(w.link[l].rel=="replies"&&w.link[l].type=="text/html"){f=w.link[l].title.split(" ")[0];break}}if("content" in w){var r=w.content.$t}else{if("summary" in w){var r=w.summary.$t}else{var r=""}}postdate=w.published.$t;if(j>imgr.length-1){j=0}img[o]=imgr[j];s=r;a=s.indexOf("<img");b=s.indexOf('src="',a);c=s.indexOf('"',b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")){img[o]=d}cmtext=(text!="no")?'<i><font color="'+acolor+'">('+f+" "+text+")</font></i>":"";var q=[1,2,3,4,5,6,7,8,9,10,11,12];var x=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];var u=postdate.split("-")[2].substring(0,2);var h=postdate.split("-")[1];var t=postdate.split("-")[0];for(var e=0;e<q.length;e++){if(parseInt(h)==q[e]){h=x[e];break}}var n=(showPostDate)?'<i><font color="'+acolor+'"> ('+u+" "+h+" "+t+")</font></i>":"";g=(aBold)?"<b>"+g+"</b>":g;var v='<li><a href="'+p+'"><img src="'+img[o]+'" width="'+thumbwidth+'" height="'+thumbheight+'" class="recent-thumb"/></a><a href="'+p+'" class="recent-link">'+g+'</a><div class="spydate">'+n+'</div><div class="spycomment">'+cmtext+"</div>";document.write(v);j++}document.write("</ul>")}document.write('<script src="'+home_page+"feeds/posts/default?max-results="+numposts+'&orderby=published&alt=json-in-script&callback=showrecentposts"><\/script>');
</script>
</div>


ကုဒ္ေတြထဲက အျပာေရာင္နဲ႔ ျပထားတဲ့ကုဒ္ေတြကို ဖယ္ပစ္လိုက္လို႔ရပါတယ္
ကၽြန္ေတာ္ကေတာ့ မူရင္း ကုဒ္ပိုင္ရွင္ကို Credit ေပးရာေရာက္ေအာင္ ထည့္ေပးထာတာပါ

အ၀ါေရာင္နဲ႔ျပထားတဲ့ Home page url ေနရာမွာေတာ့ ကိုယ့္ရဲ႕ home page url ကို အစားထိုးေပးရမွာ ျဖစ္ပါတယ္ ..

ၿပီးရင္ေတာ့ Save ကိုႏွိပ္လိုက္ေပါ့ ...

ဘေလာ့ကို ျပန္၀င္ၾကည့္ပါ ..
အဆင္မေျပေသးဘူးဆိုရင္ Blogger ကေန Log out ျပန္ထြက္ၿပီး history ေတြ cookies ေတြကို ရွင္းၿပီးမွ ျပန္၀င္ၿပီးၾကည့္ပါ

အဆင္ေျပတယ္ဆိုရင္ေတာ့ ၿပီးပါၿပီ ..
တခ်ိဳ႕ဘေလာ့ Template ေတြမွာ အဆင္မေျပတာေတြ ရွိတတ္ပါတယ္ ..
အဲဒီလို အဆင္မေျပခဲ့ရင္ေတာ့ အေပၚမွာသံုးခဲ့တဲ့ ကုဒ္ေတြအားလံုးရဲ႕ အေပၚဆံုးမွာ

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>

အဲဒီကုဒ္ေတြကို ေကာ္ပီကူးၿပီး ထည့္ေပးၾကည့္လိုက္ပါ
အဆင္ေျပသြားတာမ်ားပါတယ္ ..
ဒါမွ အဆင္မေျပရင္ေတာ့ comment ခ်န္ထားေပးခဲ့ပါ ..
Template ထဲမွာ ကုဒ္အခ်ိဳ႕ထပ္ျဖည့္ေပးရမွာမို႔ ဒီပို႔စ္ကို ျပန္ၿပီး update လုပ္ေပးပါ့မယ္
အခု တစ္ခါတည္း မေျပာလိုက္တာက အဲဒီထပ္ျဖည့္လိုက္တဲ့ ကုဒ္ေတြေၾကာင့္ လက္ရွိသံုးထားတဲ့ Widget အခ်ိဳ႕ အလုပ္မလုပ္ေတာ့တာမ်ိဳး ျဖစ္သြားတတ္လို႔ပါ ..

ကဲ .. အဆင္ေျပပါေစဗ်ာ

နည္းပညာလမ္းေၾကာင္းေပၚကသူငယ္ခ်င္းအားလံုးကို ေလးစားခင္မင္လွ်က္
အိုင္တီမုဆိုး

0 comments:

Post a Comment