Popular Post Style လွလွေလးဖန္တီးၾကမယ္ေနာ္

မဂၤလာပါ ေအာင္ဟိန္း (နည္းပညာ)မွ ႀကိဳဆိုပါတယ္....

 

မဂၤလာပါ  သည္ေန႕ေရးျဖစ္တာေလးကေတာ့ မိမိတို႕ဘေလာ့မွာ POPULAR POST ေလးေတြကို

စတိုင္ က်က်လွလွ  ပပကာလာခြျေလးေတြနဲ႕  အလွဆင္ျခင္သေူတြအတြက္ပါ  အရင္ကလည္း သည္နည္းကိုဘဲ တင္ေပးခဲ့ဘူးပါတယ္.. ဒါကေတာ့ ေနာက္ တၾကိမ္ ဆိုပါေတာ့ စမ္းသတ္ ေအာင္ျမင္

ထားျပီး ျဖစ္ပါတယ္ေနာ္... စိတ္တိုင္းက် သုံးဆြဲ လိုက္ပါေနာ္

လုပ္နည္းနဲ႕ လိုအပ္ေသာ ကုဒ္ေတြကေတာ့
======================

ပထမဆုံးအေနနဲ႕
=========
   ►1.  Login လုပ္လုိက္ပါ ဘေလာ့ကာကို
   ►2.  Layout ကိုကလစ္ရပါ့မယ္ မိမိတို႕  Dashboard ကေနေပါ့
   ►3.  Add a Gadget ကိုကလစ္ေပးလုိက္ပါ
 အဲမွာ က်လာတဲ့ ဇယားထဲမွာဘဲ... popular post ဆိုတာရွိပါတယ္.. ေနာ္ အဲတာကိုကလစ္ပါ
ေအာက္က ပုံေလးမွာ ျပထားသလိုေပါ့ေနာ္..ဆက္လုပ္လိုက္ပါ...

ဒုတိယ အဆင့္အေနနဲ႕ကေတာ့
================

►1-  Blogger Singin ၀င္လိုက္ပါ။
►2-  Dashboard  ကိုသြားလိုက္ပါ။
►3-  Template    ကိုကလစ္ပါ..။
►4-  Edit  Html   ကို၀င္ပါ..
►5- Ctrl+F  (သို႕မဟုတ္) F3  အကူညီျဖင့္ ေပးထားတဲ့ ကုဒ္ကို ရွာလိုက္ပါ။

]]></b:skin>  ကုဒ္ကိုရွာပါ ေတြ႕ျပီဆိုတာနဲ႕  ေအာက္မွာ ေပးထားတဲ့ကုဒ္ေတြကို
သူ႕အေပၚကေန ကပ္လွ်က္  ထည့္ေပးလိုက္ရံုပါဘဲေနာ္

              <!-- Popular posts multi colored UI theme -->#PopularPosts1 ul{margin:0;padding:5px 0;list-style-type:none} #PopularPosts1 ul li{position:relative;margin:5px 0;border:0;padding:10px} #PopularPosts1 ul li:first-child{background:#ff4c54;width:97%} #PopularPosts1 ul li:first-child:after{content:"1"} #PopularPosts1 ul li:first-child + li{background:#ff764c;width:87%} #PopularPosts1 ul li:first-child + li:after{content:"2"} #PopularPosts1 ul li:first-child + li + li{background:#ffde4c;width:84%} #PopularPosts1 ul li:first-child + li + li:after{content:"3"} #PopularPosts1 ul li:first-child + li + li + li{background:#c7f25f;width:81%} #PopularPosts1 ul li:first-child + li + li + li:after{content:"4"} #PopularPosts1 ul li:first-child + li + li + li + li{background:#33c9f7;width:78%} #PopularPosts1 ul li:first-child + li + li + li + li:after{content:"5"} #PopularPosts1 ul li:first-child + li + li + li + li +li{background:#7ee3c7;width:75%} #PopularPosts1 ul li:first-child + li + li + li + li + li:after{content:"6"} #PopularPosts1 ul li:first-child + li + li + li + li + li +li{background:#f6993d;width:72%} #PopularPosts1 ul li:first-child + li + li + li + li + li + li:after{content:"7"} #PopularPosts1 ul li:first-child + li + li + li + li + li + li +li{background:#f59095;width:69%} #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after{content:"8"} #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li +li{background:#c7f25f;width:66%} #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after{content:"9"} #PopularPosts1 ul li:first-child:after, #PopularPosts1 ul li:first-child + li:after, #PopularPosts1 ul li:first-child + li + li:after, #PopularPosts1 ul li:first-child + li + li + li:after, #PopularPosts1 ul li:first-child + li + li + li + li:after, #PopularPosts1 ul li:first-child + li + li + li + li + li:after, #PopularPosts1 ul li:first-child + li + li + li + li + li + li:after, #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after, #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after{position:absolute;top:20px;right:-15px;border-radius:50%;background:#353535;width:30px;height:30px;text-align:center;font-size:28px;color:#fff} #PopularPosts1 ul li .item-thumbnail{float:left;border:0;margin-right:10px;background:transparent;padding:0;width:70px;height:70px;} #PopularPosts1 ul li a{font-size:13px;color:#444;text-decoration:none} #PopularPosts1 ul li a:hover{color:#222;text-decoration:none} #PopularPosts1 img{ -moz-border-radius: 130px; -webkit-border-radius: 130px; border-radius: 130px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; padding:4px; border:1px solid #fff !important; } #PopularPosts1 img:hover { border-radius: 0 0 0 0; -moz-transform: scale(1.2) rotate(-711deg) ; -webkit-transform: scale(1.2) rotate(-711deg) ; -o-transform: scale(1.2) rotate(-711deg) ; -ms-transform: scale(1.2) rotate(-711deg) ; transform: scale(1.2) rotate(-711deg) ; } <!-- popular posts multicolored UI theme -->

ကဲ  မိမိတို႕ တက္ပလက္ကို စိတ္ခ်ယုံၾကည္စြာ  ေဆ့လိုက္ပါေတာ့ေနာ္... မေဆ့ဘဲ preview နဲ႕ျပန္စစ္မယ္ဆိုလည္း ေသျခာေအာင္စစ္ေဆးၾကည့္လုိက္ပါေနာ္...ေသျခာျပီဆုိတာနဲံ႕ ေဆ့လိုက္ေပါ့..

 အိုေက... လွပေသသပ္ေသာ ေပၚပ်ဴလာပို႕စ္ေလးေတြ ပိုင္ဆိုင္ေနပါျပီ...

အခုလို၀င္ေရာက္ဖက္ရွဳေပးတာေက်းဇူးတင္ပါတယ္....
အခုလို၀င္ေရာက္ဖက္ရွဳေပးတာေက်းဇူးတင္ပါတယ္....

စာဖက္သူမ်ားနားမလည္တာရိွရင္ ကြန္မန္းမွာစာခ်န္းေပးခဲ့ပါ

 တစ္ေန႔ေန႔တစ္ခ်ိန္ခ်ိန္ ကြ်န္ေတာ္လူ႔ေလာကၾကီးထဲက နွုတ္ဆက္ထြက္ခြာသြားခဲ့တဲ့အခါ ကြ်န္ေတာ္တို႔ရဲ႕ပညာေလးေတြဟာ အျမဲက်န္ရိွေနေစခ်င္ေသာစိတ္ျဖင့္ နည္းပညာေလးေတြမွ်ေ၀ေပးရင္း အားလံုးပဲ စိတ္ဆင္းရဲျခင္းကင္းေ၀းၾကပါေစဗ်ာ။

  ေအာင္ဟိန္း (အေျခခံနည္းပညာ)