Drop Down MenusCSS Drop Down MenuPure CSS Dropdown Menu
ကြ်န္ေတာ့ဆုိင့္သုိ႕အလည္လာအားေပးၾကေသာမိတ္ေဆြမ်ားကိုအထူးေက်းဇူးတင္လွ်က္ပါ ။ကြ်န္ေတာ္ဖတ္မိသမွ်ေသာ ေလ့လာမိသမွ်ေသာ post ျပန္လည္မွ်ေ၀ေပးေနျခင္းသာျဖစ္ပါသည္ နညး္ပညာေလ့လာေနေသာ ညီအကိုေမာင္ႏွမမ်ား တစ္ေနရာတည္းမွာ လုိခ်င္တာေလးေတြ ရွာဖြယ္နုိင္ေအာင္၇ည္ရြယ္ခ်က္ ဒီဘေလာ့ကို ဖန္းတီးထားရျခင္သာျဖစ္ပါသည္ ဆရာၾကီးတစ္ေယာက္မဟုတ္အတြက္ ေလ့လာေနဆဲ့ သူတစ္ေယာက္မုိ အမွားနဲ႕ မကင္းဘူးဆုိတာ နားလည္သေဘာေပါက္မိပါတယ္ ဒါေၾကာင္ အမွားရွိရင္လလညး္နားလည္ခြင့္လြတ္ေပးၾကပါ(ဘေလာ့ကာအားလုံးကို အစဥ္ေလးစားလွ်က္ ဆက္လက္ၾကိဳးစားပါအုံးမယ္)

ၾကိဳက္တဲ့ဘာသာေျပာင္းဖတ္နို္င္ပါတယ္

မန္ဘာ၀င္ျပီအားေပးခဲ့ပါအုံးေနာ့

Showing posts with label ဘေလာဆိုင္ရာ. Show all posts
Showing posts with label ဘေလာဆိုင္ရာ. Show all posts

Monday, May 11, 2015

မိမိဘေလာ့ Title ဆိုတဲ့ ေခါင္းစဥ္ေလးကို ေဘလာ့ရဲ႕ အလယ္တည့္တည့္မွာ ထားၾကမယ္


 မဂၤလာပါ ကြ်န္ေတာ္ သည္ေန႕ ေရးျဖစ္တာကေတာ့ ဘေလာ့ကာေတြအတြက္  မိမိဘေလာ့ရဲ႕ Post  Title
ေတြကို အလယ္ တည့္တည့္မွာ ေပၚျခင္လား  ညာဘက္မွာ ေပၚျခင္လား  ဘယ္ဘက္မွာ ေပၚျခင္လား
ၾကိဳက္သလို ထားလို႕ရတဲ့နည္းလမ္းေလးဘဲ ျဖစ္ပါတယ္...
သည္နည္းေလးကို ကြ်န္ေတာ္ အလယ္ တည့္တည့္ မွာထားတဲ့နည္းေလး တစ္ခု ဥပမာ လုပ္ျပရင္း
တင္လုိက္ပါမယ္ေနာ္..ေအာက္မွာ ေလ့လာလုိက္ပါ....
ပဖမဆုံးအေနနဲ႕  မိမိတို႕ ပို႕စ္တင္ တဲေ့နရာကို သြားလုိက္ပါေနာ္....
 မိိမိတို႕ ပို႕စ္ရဲ႕ေခါင္းစဥ္ကို Title ေနရာမွာ ေရးပါတယ္  သည္ခါေတာ့  အဲ ေခါင္းစဥ္ကို ကုဒ္ေလးနဲ႕ ထည့္
ေရးၾကမယ္ဗ်ာ ဒါဆို  အလည္တည့္တည့္  ကိုေရာက္ေနမယ္....ေနာ္.... အသုံးူျပဳဖို႕ကုဒ္နဲ႕
က်ေနာ္ နမူနာျပထားတဲ့  အလယ္တည့္တည္ ထားတာေလးကို ေအာက္မွာ ၾကည့္လုိက္ပါေနာ္...
အသုံးျပဳရန္ ကုဒ္မ်ား
===========
 ၁။အလည္မွာထားခ်င္ရင္ေအာက္က Code ကိုသံုးပါ။
<div align="center">ေခါင္းစဥ္ေရးရန္</div>



၂။ဘယ္ဘက္မွာထားခ်င္ရင္ေအာက္က Code ကိုသံုးပါ။
<div align="left">ေခါင္းစဥ္ေရးရန္</div>



၃။ညာဘက္မွာထားခ်င္ရင္ေအာက္က Code ကိုသံုးပါ။
<div align="right">ေခါင္းစဥ္ေရးရန္</div>


အဆင္ေျပပါေစ
ခုလိုအားေပးတဲ့အတြက္ အထူးေက်းဇဴးတင္ပါေၾကာင္း ေျပာၾကားပါရေစ..ဘေလာ့ခရီးသည္မွ နည္းပညာမ်ားအား မည္သူမဆို လြတ္လပ္စြာ ကူးယူသုံးစြဲနိဳင္ပါတယ္.. ကြ်န္ေတာ္ ပိုင္ဆိုင္ေသာေနရာေလးမ်ားအား ဆက္လက္ လည္ပါတ္လိုပါက ***************************************
ဘေလာ့ခရီးသည္သို႕ { ဒီမွာ } သြားလိုက္ပါ
လယ္တီေျမသားသို႕{ ဒီမွာ } သြားလိုက္ပါ
စာေပနန္းေတာ္သို႕{ ဒီမွာ } သြားလိုက္ပါ


မွတ္ခ်က္ ...တင္ခဲ့မိေသာpostမ်ားမွာ ကြ်န္ေတာ္ေတြ႕မိေသာဖတ္မိေသာ အရာမ်ားကိုျပန္လည္မွ်ေ၀ေပးျခင္သာျဖစ္ပါသည္/လာလည္ေသာမိတ္ေဆြမ်ားကိုအထူးေက်းဇူးတင္ပါတယ္။(ဘေလာ့ကာအားလုံးကို အစဥ္ေလးစားလွ်က္)
Posted by at No comments:
Labels:

ဖိုင္ေတြ-ပုံေတြတင္ဖို႕ Hosting ဆိုဒ္မ်ား


 ဖိုင္ေတြ-ပုံေတြတင္ဖို႕ Hosting ဆိုဒ္မ်ား
 ဒါေလးးကေတာ့ မိတ္ေဆြတို႕ မရွိမျဖစ္လိုအပ္တဲ့ ဆိုဒ္ေလးေတြမို႕ လိုအပ္ရင္ သုံးနိဳင္ေအာင္
တင္ျပေပးလုိ္ကတာပါ... ဖိုင္ေတြ  ပုံေတြ ကို HOSTING တင္လိုပါက  သည္ဆိုဒ္ေတြမွာတင္လုိ္ကပါ...

ဒါကေတာ့ FILE HOSTING အတြက္ဆိုဒ္ေတြပါ ....
 ဒါကေတာ့  IMAGE HOSTING အတြက္ ဆိုဒ္ေတြပါ.....
ေအာင္ေအာင္(မကစ) ရဲ႕ ဘေလာ့ခရီးသည္ေလးအား အားေပးေနၾကတဲ့အတြက္ ေက်းဇဴးအထူးတင္ပါတယ္.. တုန္႕ျပန္မွဳအေနနဲ႕ fb like ေလးေတာ့ လုပ္ေပးခဲ့ၾကပါေနာ္.. တတ္စြမ္းသမွ် ေတြ႕ ရွိသမွ်ေလးေတြကို ျပန္လည္ မွ်ေ၀ေနပါ့မယ္...။
www.aungsanmks.com 


Posted by at No comments:
Labels:

Thursday, April 30, 2015

ဘေလာမွာ facebook like box အလြယ္ေလးထည့္မယ္

Style 1:
How To Add a Custom Facebook Like Box to Your Site ဘာေလာ့မွာ facebook like box  အလြယ္ေလးထည့္ၾကည့္ရေအာင္ ကြ်န္ေတာ္လုိ မသိေသးတဲ့ ဘေလာကာအသစ္မ်ားအတြက္ ရည္ရြယ္ပါတယ္ သိျပီသား တတ္ျပီသား ဆရာ့ဆရာၾကီးမ်ား ေက်ာ္ခြသြားပါေနာ့
ေလပြါးေနတာမ်ားေနျပီ ကဲစလုိက္ၾကရေအာင္ ကြ်န္ေတာ္ေအာက္ ပုံေတြနဲ ကုတ္ေတြကို ေပးထားပါတယ္ မိမိၾကိဳက္ႏွစ္သက္ရာ like box  ေလးကို ေရြးျပီ HAML/jave script မွာထည့္ေပးလုိ္ပါေနာ့
 မိမိဘေလာ့ကိုေတာ့ sign in ၀င္ထားပါ
လုပ္နညး္မသိရင္ ဒီမွာၾကည္ပါ ဆုိတာႏွိပ္ျပီ သြားၾကည့္လုိက္ပါေနာ့
 

   ►1.  Login လုပ္လုိက္ပါ ဘေလာ့ကာကို
   ►2.  Layout ကိုကလစ္ရပါ့မယ္ မိမိတို႕  Dashboard ကေနေပါ့
   ►3.  Add a Gadget ကိုကလစ္ေပးလုိက္ပါ
   ►4.  HTML/Javascript. ကိုကလစ္ျပီး က်လာတဲ့ ေဘာက္ေလးထဲမွာဘဲ
   ►5.  ေအာက္ကေပးထားတဲ့ ကုဒ္ေတြကို ေကာ္ပီယူ ထည့္လိုက္ပါ

မွတ္ခ်က္  pages%2FBlogspot-tutorial%2F220888831260608အနီေရာင္နဲ႕ ျပထားတဲ့

ေနရာမွာ မိမိရဲ facebook page link ကိုထည့္ေပးလုိက္ပါ

Style 1:-

 Customize Facebook Like Box

<div style="background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAuDY5fK3Mgrx9Oo7_VwXW9SWEUXBYVtAONV4Ilb1o9DeX_-Muf4sABKxJSPEEsdtcynuQLMr_x3EVvrFmmHhY7p0WdNDU5pFK9igyeMMWeMKzihL8xyPOvcipsRqNiwrdmGyOT_SNWzA0/s1600/fan-01-pic.png');overflow:hidden;border-radius: 110px;.height:250px;width: 238px;border-radius: 0px 13px 0px 0px;overflow: hidden;"><div style="height: 250px; overflow: hidden;"><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2FBlogspot-tutorial%2F220888831260608&amp;width=250&amp;height=258&amp;show_faces=true&amp;header=false&amp;stream=false&amp;show_border=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:250px; height:258px;" allowTransparency="true"></iframe>
</div>
</div>







  Style 2:-
Customize Facebook Like Box




<div style="background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRl0nd-qNzmI2ebO_8i13pXaOl29xl36tVYSV4Y0MPoFYDV-u7Pon0SCO8Xblh-AgP5E96Yh7JmhVsEP78RkTunVOGIoLSEYDJ4Kvzo60vch8Z9OanQF39j7DVCwki_JjYM0l3Or5Modyz/s1600/fan-02-pic.png');overflow:hidden;border-radius: 110px;.height:250px;width: 238px;border-radius: 0px 13px 0px 0px;overflow: hidden;"><div style="height: 250px; overflow: hidden;"><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2FBlogspot-tutorial%2F220888831260608&amp;width=250&amp;height=258&amp;show_faces=true&amp;header=false&amp;stream=false&amp;show_border=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:250px; height:258px;" allowTransparency="true"></iframe>
</div>
</div>



 Style 3:-
 Customize Facebook Like Box



<div style="background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-pw_tNuZaCyAXSUVo3N-doYrwL2hjmIXmJW6_CkZzLZKaCNG6RRu-JAtjB_-quNyoi51EAxb4Yv6eDZerORLJQGAhYDsB59eWupXJmz7qJnDSpy1KKomkd6bgGf43v57U2CqOz2Ss3sP3/s1600/fan-03-pic.png');overflow:hidden;border-radius: 110px;.height:250px;width: 238px;border-radius: 0px 13px 0px 0px;overflow: hidden;"><div style="height: 250px; overflow: hidden;"><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2FBlogspot-tutorial%2F220888831260608&amp;width=250&amp;height=258&amp;show_faces=true&amp;header=false&amp;stream=false&amp;show_border=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:250px; height:258px;" allowTransparency="true"></iframe>
</div>
</div>









 Style 4:-
Customize Facebook Like Box



<div style="background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfHlMmeqiJWwYIKDH5f3TAInojL7LQdf9DmkUwFW-ys8o9O0URIH0lFPZcnmAp9pyjSW9uAFhGCKDWJikynWkhoK6SudGcHZsLD8kDKYfUBMIoHlrWhPOCVDcasu-_a-bUrMmx__eMLDq3/s1600/fan-04-pic.png');overflow:hidden;border-radius: 110px;.height:250px;width: 238px;border-radius: 0px 13px 0px 0px;overflow: hidden;"><div style="height: 250px; overflow: hidden;"><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2FBlogspot-tutorial%2F220888831260608&amp;width=250&amp;height=258&amp;show_faces=true&amp;header=false&amp;stream=false&amp;show_border=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:250px; height:258px;" allowTransparency="true"></iframe>
</div>
</div>

 Style 5:-
 Customize Facebook Like Box

<div style="-moz-box-shadow: 0px 15px 20px 0px #777777; -webkit-box-shadow: 0px 15px 20px 0px #777777; background-color: #f4f4f4; border-radius: 15px; border: 1px solid #CCCCCC; box-shadow: 0px 15px 20px 0px #777777; height: 270px; margin: 30px; padding: 10px 0 10px 10px; width: 250px;"><div style="height: 250px; overflow: hidden;"><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2FBlogspot-tutorial%2F220888831260608&amp;width=250&amp;height=258&amp;show_faces=true&amp;header=false&amp;stream=false&amp;show_border=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:250px; height:258px;" allowTransparency="true"></iframe>
</div>
</div>

 Style 6:-
 Customize Facebook Like Box

.
<div style=".width:248px; padding:10px 0px 10px 10px;height:230px;border-top:5px solid #CCCCCC;border-right:5px solid #CCCCCC;border-bottom:5px solid #cccccc;border-left:5px solid tomato;border-radius: 0px 30px 0px 0px;background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqtjrxhfdXvwP9hL0HMlO1MtWkcpLC9AckPd5W1EuhU9DgcgD5EbX0LMlhyphenhyphenc7Ht09zU3Tz2qj-l33l7mwC5db9GHvSchxYe54u-MKxBM7oyiPjEV_u8kZ8CmheoznehD55Gp-fVgIARBAK/s320/3783098647_fb208001b5.jpg');overflow:hidden;.height:250px;width: 238px;border: 5px outset #f2f2f2;border-radius: 0px 13px 0px 0px;overflow: hidden;"><div style="height: 250px; overflow: hidden;"><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2FBlogspot-tutorial%2F220888831260608&amp;width=250&amp;height=258&amp;show_faces=true&amp;header=false&amp;stream=false&amp;show_border=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:250px; height:258px;" allowTransparency="true"></iframe>
</div>
</div>

 Style 7:-
 Customize Facebook Like Box

<div style=".width:248px;padding:10px 0px 10px 10px;height:230px;border-top:5px solid #CCCCCC;border-right:5px solid tomato;border-bottom:5px solid #cccccc;border-left:5px solid tomato;border-radius: 0px 30px 0px 0px;background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgU0nOn7QXaZlh9pb-ofYivFwLyHPmnG6Pavx7NdA8IqPA_WAn_ngV5KjX2tmHmBQgP9JWKKaRgjy-jpu0P583ivc5H8mrtPzNDJ4NlEqxrJmw6P5iv-IRZDBHd8oS51xauR3LcrsF9DrDg/s1600/image4.png');overflow:hidden;border-radius: 110px;.height:250px;width: 238px;border-radius: 0px 13px 0px 0px;overflow: hidden;"><div style="height: 250px; overflow: hidden;"><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2FBlogspot-tutorial%2F220888831260608&amp;width=250&amp;height=258&amp;show_faces=true&amp;header=false&amp;stream=false&amp;show_border=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:250px; height:258px;" allowTransparency="true"></iframe>
</div>
</div>






အဲေနရာမွာ ေအာက္ကကုဒ္ေတြ ကို ထည့္ေပးလိုက္ပါေနာ္....
<div style="background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRl0nd-qNzmI2ebO_8i13pXaOl29xl36tVYSV4Y0MPoFYDV-u7Pon0SCO8Xblh-AgP5E96Yh7JmhVsEP78RkTunVOGIoLSEYDJ4Kvzo60vch8Z9OanQF39j7DVCwki_JjYM0l3Or5Modyz/s1600/fan-02-pic.png');overflow:hidden;border-radius: 110px;.height:250px;width: 238px;border-radius: 0px 13px 0px 0px;overflow: hidden;"><div style="height: 250px; overflow: hidden;"><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2FBlogspot-tutorial%2F220888831260608&amp;width=250&amp;height=258&amp;show_faces=true&amp;header=false&amp;stream=false&amp;show_border=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:250px; height:258px;" allowTransparency="true"></iframe>
</div>
</div>


 Style 8:-

 Customize Facebook Like Box


<div style=".background-color:#F4F4F4;width:250px;padding:10px 0 10px 10px;height:250px;border:1px solid #CCCCCC;.height:250px;overflow:hidden;"><div style="height: 250px; overflow: hidden;"><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2FBlogspot-tutorial%2F220888831260608&amp;width=250&amp;height=258&amp;show_faces=true&amp;header=false&amp;stream=false&amp;show_border=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:250px; height:258px;" allowTransparency="true"></iframe>
</div>
</div>


 မၾကိဳက္လုိ႕ ေနာက္ထပ္ေရြးခ်င္ေသးတယ္ဆုိရင္ေတာ့ ေအာက္ကlink ကိုသာ၀င္သြားလုိက္ေနာ့
ဒီဇုိင္းဆန္းေလးေတြအမ်ားၾကီးက်န္ေသးတယ္
သြားရန္ အတြက္

မွတ္ခ်က္ ...တင္ခဲ့မိေသာpostမ်ားမွာ ကြ်န္ေတာ္ေတြ႕မိေသာဖတ္မိေသာ အရာမ်ားကိုျပန္လည္မွ်ေ၀ေပးျခင္သာျဖစ္ပါသည္/လာလည္ေသာမိတ္ေဆြမ်ားကိုအထူးေက်းဇူးတင္ပါတယ္။(ဘေလာ့ကာအားလုံးကို အစဥ္ေလးစားလွ်က္)
Posted by at No comments:
Labels:

ဘေလာမွာ နာရီလွလွေလးေတြထားၾကရေအာင္


 ကဲခုလုိမ်ိဳးးနာရီလွလွေတြေတြထားခ်င္တဲ့ ဘာေလာ့ကာညီအစ္ကိုမ်ားအတြက္ သိျပီသား တတ္ျပီသား ဆရာ့ ဆရာၾကီးမ်ား ေက်ာ္ခြသြားပါေတာ့ မသိေသးေတာ့ ဘေလာ့၀ါသနာ ပါတဲ ့ကြ်န္ေတာ္လုိ ဘေလာ့ကာအသစ္ေလးမ်ား ရည္ရြယ္ပါ

ဘေလာမွာနာရီလွလွေလးေတြ ထည့္ထားခ်င္ရင္ေတာ္ ဒီမွာဆုိတာေလးကို ႏွိပ္ျပီ သြားလုိပါေနာ့
ကိုယ္ၾကိဳက္တဲ့နာရီေလးကို ေရြးျပီ ရလာတဲ code ေလးေလး  HTMl /jave scrpt ကိုရွာျပီ ထည့္လိုက္ပါ ထည့္နညး္မသိရင္ ဒီေနရာ ကၾကည့္ပါ ဆုိတာေလးကိုႏွိပ္ျပီသြား ၾကည့္လုိက္ပါ

 Step 1. Add a Gadeet

Blogger Tips And Tricks|Latest Tips For Bloggers

 Step 2. HTMl /jave scrpt

 Blogger Tips And Tricks|Latest Tips For Bloggers


Step 3. code ထည့္ပါ


 Step 4. Save ႏွိပ္ပါ

အဆင္ေျပၾကပါေစ


မွတ္ခ်က္ ...တင္ခဲ့မိေသာpostမ်ားမွာ ကြ်န္ေတာ္ေတြ႕မိေသာဖတ္မိေသာ အရာမ်ားကိုျပန္လည္မွ်ေ၀ေပးျခင္သာျဖစ္ပါသည္/လာလည္ေသာမိတ္ေဆြမ်ားကိုအထူးေက်းဇူးတင္ပါတယ္။(ဘေလာ့ကာအားလုံးကို အစဥ္ေလးစားလွ်က္)
Posted by at No comments:
Labels:

ဘေလာ့ေပၚမွာ HTML/Jave script ထည့္နညး္

 ဘေလာ့ကို ၀ါသနာပါတဲ့ ညီအစ္ကိုမ်ားအတြက္(ဘေလာ့ကာအသစ္ေလးေတြအတြက္ရည္ရြယ္ပါတယ္)
သိျပီးသား တတ္ျပီသား ဆရာ့ ဆရာၾကီးမ်ား ေက်ာ္ခြသြားပါလုိ႕
ကြ်န္ေတ္ာဒီေန႕ ဘေလာ့မွာHTML/Jave script  ထည့္ေလးေလးကို ေရးသြားပါမယ္ ကြ်န္ေတာ္ပုံေလးနဲ႕ ေသခ်ာျပေပးထားပါထည္ ့တဆင့္ျခင္း လုိက္လုပ္သြားပါ  အဆင္ေျပပါလိမ့္မယ္
ပထဆုံးေတာ့ မိမိရဲ႕ ဘေလာ့ကို sign in ေတာ့၀င္ထားပါေနာ့
1 .ညာဘက္က အေပၚေထာင့္မွာရွိတဲ့ Desin ကို ကလိပါ




 2. layout  ကိုကလိပါ
3.Add a Gadget ကို ကလိပါ   (မိမိထားခ်င္တဲ့ေနရာေပါ့)

4.box ေလးတစ္ကို က်လာပါမည္ အဲဒီboxေလးထဲက HTML/Jave script ကိုရွာျပီေတာ့ကလိပါ

5. Trtle မွာသက္ဆုိင္တဲ့ ေခါင္းစီအလုိက္ကို ေရးပါ
Content ေအာက္က လပ္ေနတဲ့ေနရာမွာေတာ့ မိမိ copy ယူလာတဲ code ကို ထည့္လုိက္ပါ
ျပီေတာ့ Save ဆိုတာေလးကို ႏွိပ္လုိက္ပါ အားလံုးအဆင္ေျပပါျပီ
အဆင္ေျပၾကပါေစ


မွတ္ခ်က္ ...တင္ခဲ့မိေသာpostမ်ားမွာ ကြ်န္ေတာ္ေတြ႕မိေသာဖတ္မိေသာ အရာမ်ားကိုျပန္လည္မွ်ေ၀ေပးျခင္သာျဖစ္ပါသည္/လာလည္ေသာမိတ္ေဆြမ်ားကိုအထူးေက်းဇူးတင္ပါတယ္။(ဘေလာ့ကာအားလုံးကို အစဥ္ေလးစားလွ်က္)
Posted by at No comments:
Labels:

Monday, April 27, 2015

ဘေလာ့မွာ Slider တစ္ခုျပဳလုပ္ျခင္း (၅)

 မဂၤလာပါ  သည္နည္းပညာေလးကေတာ့ မိမိတို႕ဘေလာ့မွာ ကိုယ္ညႊန္ျခင္ အေရးၾကီး ပို႕စ္ေနရာေလးေတြကို စလုိက္တာ ပုံစံေလးနဲ႕ လွလွပပ  ညႊန္ျပလိုတဲ့နည္းလမ္းေလးျဖစ္ပါတယ္... သည္လို နည္းလမ္းေလးေတြကို ပုံစံအမ်ိဳးမ်ိဳးနဲ႕ တင္ျပေပးသြားမွာ ျဖစ္ပါတယ္ ေအာက္မွာ နည္းလမ္းနဲ႕လိုအပ္တဲ့ကုဒ္ေတြ ေပးထားပါတယ္... ေလ့လာျပီး ကလိလုိက္ေနာ္....လန္းးးတယ္..သူကေတာ့ အရင္ပို႕ ေတြလို သိပ္ထည့္ရတာ မရွဳပ္ဘူးးး ပိုျပီးွရင္းတယ္ေလ.... ပိုလြယ္တာေပါ့...ကစ္လုိက္ဗ်ာ



   ►1.  Login လုပ္လုိက္ပါ ဘေလာ့ကာကို
   ►2.  Layout ကိုကလစ္ရပါ့မယ္ မိမိတို႕  Dashboard ကေနေပါ့
   ►3.  Add a Gadget ကိုကလစ္ေပးလုိက္ပါ
   ►4.  HTML/Javascript. ကိုကလစ္ျပီး က်လာတဲ့ ေဘာက္ေလးထဲမွာဘဲ
   ►5.  ေအာက္ကေပးထားတဲ့ ကုဒ္ေတြကို ေကာ္ပီယူ ထည့္လိုက္ပါ

အဲေနရာမွာ ေအာက္ကကုဒ္ေတြ ကို ထည့္ေပးလိုက္ပါေနာ္....
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/javascript"></script>
<script src="http://24work.webs.com/24work-blogspot/featured-post/17-content-code/yourjavascript-56841175202.js" type="text/javascript"></script>
<a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Latest Tips For Bloggers"><img src="https://bitly.com/24workpng1" alt="Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a>
<style type="text/css">


*{

margin:0;

padding:0;

}

html{

height:100%;

}





a img{

border:0;

}

div.wrap{

width:540px;

margin:0 auto;

text-align:left;

}

div#top div#nav{

float:left;

clear:both;

width:540px;

height:52px;

margin:22px 0 0;

background:url url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_SYVa5ISbJALKLHyXa3sV4pDfeVSLb8oQuJ2mZFnx5C3CrxXbZbUOdbvbm7J31ENWc5u42FhZlE-SI-79P7wIh4CRrsEWCUNQbMRD3HvjNVaUPrrqjG_DZb7yscEEyZpZdG-UbACDKKbv/s1600/navbgq.png) 0 0 no-repeat;

}

div#top div#nav ul{

float:left;

width:700px;

height:52px;

list-style-type:none;

}

div#nav ul li{

float:left;

height:52px;

}

div#nav ul li a{

border:0;

height:52px;

display:block;

line-height:52px;

text-indent:-9999px;

}

div#header{

margin:-1px 0 0;

}

div#video-header{

height:683px;

margin:-1px 0 0;

}



div#header div#slide-holder{

z-index:40;

width:540px;

height:299px;

position:absolute;

}

div#header div#slide-holder div#slide-runner{

top:9px;

left:9px;

width:540px;

height:278px;

overflow:hidden;

position:absolute;

}

div#header div#slide-holder img{

margin:0;

display:none;

position:absolute;

}

div#header div#slide-holder div#slide-controls{

left:0;

bottom:228px;

width:540px;

height:46px;

display:none;

position:absolute;

background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfhH-qADya_SyZuiLSLTwC_VkO640qgmnfA1VS5c2UdOukQDrBHYVJqQGJbtn6OLtGQGV2XRiaYPTk9z18OteDRqVXw6oUo3fiEjptRddn31ehQ1W2I7n1DhImp1gnhTe5rL58UXCnefx6/s1600/slidebg.png) 0 0;

}

div#header div#slide-holder div#slide-controls p.text{

float:left;

color:#fff;

display:inline;

font-size:10px;

line-height:16px;

margin:15px 0 0 20px;

text-transform:uppercase;

}

div#header div#slide-holder div#slide-controls p#slide-nav{

float:right;

height:24px;

display:inline;

margin:11px 15px 0 0;

}

div#header div#slide-holder div#slide-controls p#slide-nav a{

float:left;

width:24px;

height:24px;

display:inline;

font-size:11px;

margin:0 5px 0 0;

line-height:24px;

font-weight:bold;

text-align:center;

text-decoration:none;

background-position:0 0;

background-repeat:no-repeat;

color:#fff;

}

div#header div#slide-holder div#slide-controls p#slide-nav a.on{

background-position:0 -24px;

}

div#header div#slide-holder div#slide-controls p#slide-nav a{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjc3-EjZX_CvuUXceqzt-8yG28WaMNi4r87gjFyR2HLoJvHABJSKasICKx8LsOso99ZOolmtMS_n0qMVAmTqTklRYIqMhoJg7EJu90ddAFZLdpJugqZUg55mgcjCmwZoHk7xMtxdt7r9SA_/s1600/sildenav.png);}

div#nav ul li a{background:url(images/nav.png) no-repeat;}


</style>



<div style="float:left;">

<div id="header"><div class="wrap">
<div id="slide-holder">
<div id="slide-runner">

<a href="မိမိပို႕စ္လင့္ထည့္ပါ"><img id="slide-img-1" src="ပုံလင့္ထည့္ရန္" class="slide" alt="" /></a>

<a href="မိမိပို႕စ္လင့္ထည့္ပါ"><img id="slide-img-2" src="ပုံလင့္ထည့္ရန္" class="slide" alt="" /></a>

<a href="မိမိပို႕စ္လင့္ထည့္ပါ"><img id="slide-img-3" src="ပုံလင့္ထည့္ရန္" class="slide" alt="Your image title here" /></a>

<a href="မိမိပို႕စ္လင့္ထည့္ပါ"><img id="slide-img-4" src="ပုံလင့္ထည့္ရန္" class="slide" alt="" /></a>

<a href="မိမိပို႕စ္လင့္ထည့္ပါ"><img id="slide-img-5" src="ပုံလင့္ထည့္ရန္" class="slide" alt="" /></a>

<a href="မိမိပို႕စ္လင့္ထည့္ပါ"><img id="slide-img-6" src="ပုံလင့္ထည့္ရန္" class="slide" alt="" /></a>




<div id="slide-controls">
<p id="slide-client" class="text"><strong>post: </strong><span></span></p>
<p id="slide-desc" class="text"></p>
<p id="slide-nav"></p>
</div>
</div>

<!--content featured gallery here -->
</div>
<script type="text/javascript">
if(!window.slider) var slider={};slider.data=[{"id":"slide-img-1","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-2","client":"nature beauty","desc":"add your description here"},{"id":"slide-img-3","client":"nature beauty","desc":"add your description here"},{"id":"slide-img-4","client":"nature beauty","desc":"add your description here"},{"id":"slide-img-5","client":"nature beauty","desc":"add your description here"},{"id":"slide-img-6","client":"nature beauty","desc":"add your description here"},{"id":"slide-img-7","client":"nature beauty","desc":"add your description here"}];
</script></div></div></div>



 မွတ္ခ်က္    ။                ။  မိမိတို႕ ကုဒ္ေတြ ေကာ္ပီယူ ထည့္တာနဲ႕ ျပဳျပင္စရာေတြ ရွိလာမွာပါေနာ္
(၁) "ပုံလင့္ထည့္ရန္" ဆိုတဲ့ေနရာမွာ မိမိတို႕ ျပလိုတဲ့ပုံရဲ႕ လင့္ကိုပါ။
(၂) "မိမိပို႕စ္လင့္ထည့္ပါ"  ဆိုတဲ့ေနရာမွာ ညႊန္ျပတဲ့ ေနရာရဲ႕ လင့္ကို ထည့္ေပးပါ။


ဒါဆိုရင္ ျပည့္စုံပါျပီ  မိမိတို႕ဘေလာ့ေပၚမွာ ေအာ္တို သြားေနတဲ့ စလိုက္ေလးကိုပိုင္ဆိုင္ပါျပီ သူကေတာ့

၅   ခုတိတိပါ၀င္တာျဖစ္ပါတယ္.. မိမိလမ္းညႊန္လိုေသာ ေနရာ ၅ ခုကိုထည့္လုိက္ပါေနာ္...



ဆက္ေလ့လာလိုပါက .
  အဆင္ေျပၾကပါေစ... မေျပတာ မရွင္းတာ ရွိပါက ခ်က္ေဘာက္မွာ ေအာ္ခဲ့ၾကပါေနာ္...
ခုလိုအားေပးတဲ့အတြက္ အထူးေက်းဇဴးတင္ပါေၾကာင္း ေျပာၾကားပါရေစ..ဘေလာ့ခရီးသည္မွ နည္းပညာမ်ားအား မည္သူမဆို လြတ္လပ္စြာ ကူးယူသုံးစြဲနိဳင္ပါတယ္.. ကြ်န္ေတာ္ ပိုင္ဆိုင္ေသာေနရာေလးမ်ားအား ဆက္လက္ လည္ပါတ္လိုပါက ***************************************

ဘေလာ့ခရီးသည္သို႕ { ဒီမွာ } သြားလိုက္ပါ


လယ္တီေျမသားသို႕{ ဒီမွာ } သြားလိုက္ပါ


စာေပနန္းေတာ္သို႕{ ဒီမွာ } သြားလိုက္ပါ
Posted by at No comments:
Labels:

Simple Recent Posts Widget ေလးထည့္ၾကမယ္

ေအာက္ကေခါင္းစဥ္အလိုက္ လုပ္ေဆာင္နိဳင္တာေလးေတြပါ...
  • display post titles only
  • change the number of posts
  • change the number of characters of the post snippet/excerpt
  • show the post dates


ထည့္နည္းေလးကေတာ့  ရွင္းပါတယ္....

1. Log in to your Blogger Dashboard >> go to Design >> Add a Gadget >> choose HTML/JavaScript  မွာ ကုဒ္ေတြ ထည့္ေပးလိုက္ပါ

Option 1: သည္ကုဒ္ကေတာ့ post  snippets ပုံစံနဲ႕႔ပါ...

<div id="hlrpsa">
<script src="http://helplogger.googlecode.com/svn/trunk/recent-posts-with-snippets.js">
</script>
<script>
var numposts = 5;var showpostdate = false;var showpostsummary = true;var numchars = 100;var standardstyling = true;
</script>
<script src="http://your-blog.blogspot.com/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts">
</script></div>
<div id="rpdr" style="font-family: arial, sans-serif; font-size: 9px;">
<a href="http://helplogger.blogspot.com/2012/04/recent-posts-widget-for-bloggerblogspot.html" target="_blank" title="Grab this Recent Posts Widget">Recent Posts Widget</a> by <a href="http://helplogger.blogspot.com" title="Recent Posts Widget">Helplogger</a></div>
<noscript>Your browser does not support JavaScript!</noscript>
<style type="text/css">
#rpdr {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5uOWMaDcu5QqAGf_CH8XZ3GW-HP0r0BBT3Tws4DBH-Ug1MgfwR8MQIJ7ZcOVy9v5w3ZDUAnwaOxltSb40HztWBCxQR5sfzaPCevB9vBSV_N62fVeqzUr05T6l7UUU3At4aBOhd0JKsiDN/s1600/blogger.png) 0px 0px no-repeat; padding: 1px 0px 0px 19px; height:14px; margin: 5px 0px 0px 0px;line-height:14px;}
#rpdr, #rpdr a {color:#808080;}
#hlrpsa { border-bottom:1px #cccccc dotted; margin-top:-10px; padding-bottom:10px;}
.hlrps a {font-weight:bold; }
.hlrpssumm {}
</style>

Option 2: သည္ကုဒ္ကေတာ့ Post Titles ေလးသာ ျပတဲ့  ကုဒ္ပါ။

<div id="hlrpsb">
<script style="text/javascript" src="http://helplogger.googlecode.com/svn/trunk/recent-posts-with-titles-only.js"></script>
<script style="text/javascript">var numposts = 10;var showpostdate = false;var showpostsummary = false;var numchars = 100;var standardstyling = true;</script>
<script src="http://your-blog.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts"></script></div>
<div style="font-family: arial, sans-serif; font-size: 9px;" id="rpdr"><a href="http://helplogger.blogspot.com/2012/04/recent-posts-widget-for-bloggerblogspot.html" title="Grab this Recent Posts Widget" target="_blank">Recent Posts Widget</a> by <a href="http://helplogger.blogspot.com" title="Recent Posts Widget">Helplogger</a></div><noscript>Oops! Make sure JavaScript is enabled in your browser.</noscript>
<style type=text/css>
#rpdr {background: url( https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5uOWMaDcu5QqAGf_CH8XZ3GW-HP0r0BBT3Tws4DBH-Ug1MgfwR8MQIJ7ZcOVy9v5w3ZDUAnwaOxltSb40HztWBCxQR5sfzaPCevB9vBSV_N62fVeqzUr05T6l7UUU3At4aBOhd0JKsiDN/s1600/blogger.png ) 0px 0px no-repeat; padding: 1px 0px 0px 19px; height:14px; margin: 5px 0px 0px 0px;line-height:14px;}
#rpdr, #rpdr a {color:#808080;}
#hlrpsb { }
.bbrecpost2 {
padding-top:6px;
padding-bottom:6px;
border-bottom: 1px #cccccc dotted; }
</style>

3. ေျပာင္းလဲေပးနိဳင္တာေလးေတြကေတာ့ 5 (option 1) နဲ႕  10 (option 2) တို႕ကို မိမိတို႕ ပို႕အေရအတြက္ လိုသလို ေျပာင္းနိဳင္ပါတယ္.. ေနာက္ထပ္ false to true if you want the posts dates to appear, and change 100 (option 1) if you want more characters to be displayed.
မိမိတို႕ဘေလာ့ခ်ပ္သာ ကို your-blog ေနရာမွာ အစားထိုးေပးပါ။ ဒိုမိန္း အပါ၀င္ေပါ့
ဥပမာ.............။.............
http://www.your-site.com/feeds/posts/default....

4. Saveလိုက္ရင္ ရပါျပီဗ်ာ.... အဆင္ေျပပါေစ
သည္ေနရာ  ကေန အဆင္ေျပသလို ဘာသာျပန္သည္။
ေအာင္ေအာင္(မကစ)
www.ledimyethar.com
www.depelyin.co.cc
 www.aungkyaw.com
Posted by at No comments:
Labels:
Subscribe to: Posts (Atom)
Related Posts Plugin for WordPress, Blogger...
Related Posts Plugin for WordPress, Blogger...