Blog Post Slider လုပ္နည္း (၁)

 

မိတ္ေဆြမ်ားဟာ ကၽြန္ေတာ့္လိုပဲ Blog ကိုစတင္ေလ့လာခါစဆိုရင္ ဘေလာ့မွာ ကိုယ္တင္တဲ့ ပို႔စ္ေတြကို Slide ေလးနဲ႔ ၾကည့္လို႔ရေအာင္ ကၽြန္ေတာ္ ေလ့လာစုေဆာင္းစမ္းသပ္ထားတဲ့ Slid လုပ္နည္း (၂)နည္းထဲက ပထမ တစ္နည္းကို တင္ျပလိုပါတယ္...
1. Blogger ကို Sign in ၀င္ပါ
2.Edit html ကို သြားပါ(စ၀င္တာမေျပာေတာ့ဘူးေႏွာ္)... Proceed ကိုႏွိပ္ .... Expend Widget ကို အမွန္ျခစ္ခဲ့ဦး...
3.အဲဒီထဲမွာ ကလစ္တစ္ခ်က္ခ်ၿပီး.. Control+F ကိုႏွိပ္လိုက္ၿပီး က်လာတဲ့ ေဘာက္ကေလး ထဲမွာ
   <div id='main-wrapper'> ကိုထည့္ၿပီး Find နဲ႔ရွာလိုက္ပါ...
4.ေတြ႕ရင္ အဲဒီ <div id='main-wrapper'> ရဲ႕ေအာက္က ကပ္လ်က္ ေအာက္မွာေဖၚျပထားတဲ့ ကုဒ္ကို ထည့္ေပးလိုက္ပါ....

<!-- Featured Content Slider Started -->

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>

<script type='text/javascript'>
function startGallery() {
var myGallery = new gallery($(&#39;myGallery&#39;), {
timed: true,
delay: 6000,
slideInfoZoneOpacity: 0.8,
showCarousel: false,
slideInfoZoneSlide: false
});
}
window.addEvent(&#39;domready&#39;, startGallery);
</script>

<div class='fullbox_excerpt'>
<div class='fullbox_content'>
<div class='smooth_gallery'>
<div id='myGallery'>

<div class='imageElement'>
<h3> ေခါင္းစဥ္ႀကီး 1</h3>
<p>ဒီမွာ ကိုယ္ေရးခ်င္တဲ့အေၾကာင္းအရာအက်ဥ္း</p>
<a class='open' href=' ေခါင္းစဥ္ႀကီး 1 ႏွင့္ပတ္သက္လို႔ လင့္ ' title=' ဒါေခါင္းစဥ္နာမည္ 1'/>
<img alt='' class='full' src='ဒီမွာ ေခါင္းစဥ္ 1 နဲ႔သက္ဆိုင္တဲ့ ဓါတ္ပံုရဲ႕လင့္'/>
</div>

<div class='imageElement'>
<h3> ေခါင္းစဥ္ႀကီး 2</h3>
<p>ဒီမွာ ကိုယ္ေရးခ်င္တဲ့အေၾကာင္းအရာအက်ဥ္း</p>
<a class='open' href=' ေခါင္းစဥ္ႀကီး 2 ႏွင့္ပတ္သက္လို႔ လင့္' title='ဒါေခါင္းစဥ္နာမည္ 2'/>
<img alt='' class='full' src='ဒီမွာ ေခါင္းစဥ္ 2 နဲ႔သက္ဆိုင္တဲ့ ဓါတ္ပံုရဲ႕လင့္'/>
</div>

<div class='imageElement'>
<h3> ေခါင္းစဥ္ႀကီး 3</h3>
<p>ဒီမွာ ကိုယ္ေရးခ်င္တဲ့အေၾကာင္းအရာအက်ဥ္း</p>
<a class='open' href=' ေခါင္းစဥ္ႀကီး 3 ႏွင့္ပတ္သက္လို႔ လင့္' title='ဒါေခါင္းစဥ္နာမည္ 3'/>
<img alt='' class='full' src='ဒီမွာ ေခါင္းစဥ္ 3 နဲ႔သက္ဆိုင္တဲ့ ဓါတ္ပံုရဲ႕လင့္'/>
</div>

<div class='imageElement'>
<h3>ဒါကအဂၤလိပ္လို This is featured post 4 title</h3>
<p>Replace these every slider sentences with your featured post descriptions.Go to Blogger edit html and find these sentences.Now replace these with your own descriptions.</p>
<a class='open' href='SLIDER-4-URL-HERE' title='This is featured post 4'/>
<img alt='' class='full' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWnqbGvqeqWBiD28hcdtmBVPV44etRuQOqmZLxEo10bU9Do17RpTj_yz0_f608vrk9-I-Oxsn0eGC6jwATKiD2iAWCl9nraYB4GnjcHL-EDjJnUclhle0WPNwZqKRkslQSFf2fwmCQUDw/s0/4.jpg'/>
</div>

<div class='imageElement'>
<h3>This is featured post 5 title</h3>
<p>Replace these every slider sentences with your featured post descriptions.Go to Blogger edit html and find these sentences.Now replace these with your own descriptions.</p>
<a class='open' href='SLIDER-5-URL-HERE' title='This is featured post 5'/>
<img alt='' class='full' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdhC2C0L28ypjpqr05RV0A6L6BcLv0r4qVyMy4SMpt2fW6iSXfvdTeOQiXy7ywR-86zbeKRlRbvRE6Y397s6-V7vD1Uzay37EW2u9pO7exbmIgIDYi-eD88gPlc_kdJyPoG-ncp0IMQxQ/s0/5.jpg'/>
</div>

</div></div></div></div></b:if></b:if>

<!-- Featured Content Slider End -->

မွတ္ခ်က္  =     အနီေရာင္ နဲ႔ျပထားတာေတြက ကိုယ္ႀကိဳက္သလုိ စနစ္တက် အစားထိုးဖို႔ျဖစ္ပါတယ္...

 ဒီပို႔စ္ကို တင္ခ်ိန္မွာ ဒီနည္းနဲ႔ ကၽြန္ေတာ္လုပ္ထားတာပါ....

အဆင္ေျပပါေစ....

        ေလးစားလ်က္
                              ေမာင္ေပါက္