အဆင့္လိုက္ထပ္ထားေသာ Menu  

Posted by မိုးအိမ့္ျဖဴ

ဒါကေတာ့ ပထမဆံုးျမင္ရေသာ ပံုေလးပါ....။ "သင္ထည့္ခ်င္ေသာလင့္နာမည္" ကိုႏွိပ္လုိက္ရင္ ေတာ့ ေနာက္ထပ္ တဆင့္ေျပာင္းသြားပါလိမ့္မယ္...။


"သင္ထည့္ခ်င္ေသာလင့္နာမည္" ကိုႏွိပ္လိုက္လို႕ အခုလိုေျပာင္းသြားတဲ့ပံုစံေလးပါ...။ "လင့္ေနာက္တစ္ခု" ကို ထပ္ႏွိပ္လိုက္ရင္ေတာ့ ေနာက္ထပ္ တဆင့္ကို ေရာက္သြားပါလိမ့္မယ္...။ အဲဒီလို အဆင့္လိုက္ထပ္ထားတဲ့ Menu ဘားတန္းပါ....။ သင္လိုခ်င္ေတာ့ အရင္ဆံုး Blog ကို ၀င္လိုက္ပါ...။

ပထမဆံုး ေအာက္က လင့္ေတြကို ေဒါင္းလုဒ္ လုပ္လုိက္ပါ....။

MEP.js
drilldownmenu.css
drilldownmenu.js

ေဒါင္းလုပ္ယူထားတဲ့ လင့္ကို ေအာက္ကေနရာက တစ္ခုခုမွာ အေကာင့္ဖြင့္ၿပီး Upload တင္လိုက္ပါ...။ အခုလို ကိုယ္ပိုင္ လင့္နဲ႕လုပ္ခိုင္းတာကလဲ အသံုးျပဳသူမ်ားရင္ လင့္မနိုင္မွာ စိုးလို႕ ကုိယ္ပိုင္လင့္နဲတင္ခိုင္းလိုက္တာပါ ..။ ကၽြန္ေတာ္ ေပးထားေသာ Code ကို ကူးၿပီးတင္လို႕မရပါဘူး...။ ဘာေၾကာင့္လဲဆိုေတာ့ လင့္ ကိုအျပည့္ေဖၚထားတာ မဟုတ္ေသာ ေၾကာင့္ အေပၚကလို မ်ိဳးေပၚမွာမဟုတ္ပါဘူး.....။


ၿပီးသြားရင္ေတာ့ ေအာက္ အေရာင္လိုက္ ျပထားတဲ့လင့္ေနရာအလိုက္မွာသြင္းလိုက္ပါ ....။အားလံုး ၿပီးလွ်င္ေတာ့ သင္ရဲ႕ Blog ထဲက Layout -> Edit HTML ထဲက ေအာက္က Code ကို႐ွာလိုက္ပါ...။

<head>


အေပၚက Code ကိုေတြ႕ရင္ ေအာက္မွာ႐ွိတဲ့ Code ကို ကူးၿပီး အဲဒီ Code ေအာက္မွာထည့္လိုက္ပါ....။


<!--Make sure your page contains a valid doctype at the very top-->

<script src='http://sites.google.com/site/moeeaintphyu/Home/MEP.js' type='text/javascript'/>

<link href='http://sites.google.com/site/moeeaintphyu/Home/drilldownmenu.css' rel='stylesheet' type='text/css'/>

<script src='http://sites.google.com/site/moeeaintphyu/Home/drilldownmenu.js' type='text/javascript'>

</script>

<script type='text/javascript'>

var mymenu=new drilldownmenu({
menuid: &#39;drillmenu1&#39;,
menuheight: &#39;auto&#39;,
breadcrumbid: &#39;drillcrumb&#39;,
persist: {enable: true, overrideselectedul: true}
})

</script>



ဲျပီးရင္ Save မွတ္လိုက္ပါ ...။ ေနာက္တဆင့္အေနနဲ႕ သင္ Layout >> Page element >> Add a Gadget>> Javascript/html ကိုေ႐ြးၿပီး ေအာက္က Code ေတြကို ကူးထည့္ၿပီး Save မွတ္လိုက္ပါ...။


<div id="drillcrumb"></div>

<div id="drillmenu1" class="drillmenu">
<ul>
<li><a href="http://www.moeeaintphyu.net/">မိုးအိမ့္ျဖဴ</a></li>
<li><a href="http://www.eainmathlaing.com/">အိမ္မက္လွိဳင္း</a></li>
<li><a href="#">သင့္ထည့္ခ်င္ေသာလင့္နာမည္</a>
<ul>
<li><a href="#">လင့္နာမည္ ၁</a></li>
<li><a href="#">လင့္နာမည္ ၂</a></li>
<li><a href="#">လင့္နာမည္ ၃</a></li>
<li><a href="#">လင့္ေနာက္တစ္ခု</a>
<ul>
<li><a href="#">အားကစားလင့္နာမည္ ၁</a></li>
<li><a href="#">အားကစားလင့္နာမည္ ၂</a></li>
<li><a href="#">လင့္ေနာက္တစ္ခု</a>
<ul>
<li><a href="#">လင့္နာမည္ ၁</a></li>
<li><a href="#">လင့္နာမည္ ၂</a></li>
<li><a href="#">လင့္နာမည္ ၃</a></li>
<li><a href="#">လင့္နာမည္ ၄</a></li>
<li><a href="#">လင့္နာမည္ ၅</a></li>
</ul>
</li>
<li><a href="#">အားကစားလင့္နာမည္ ၃</a></li>
</ul>
</li>
<li><a href="#">လင့္နာမည္ ၄</a></li>
<li><a href="#">လင့္နာမည္ ၅</a></li>
<li><a href="#">လင့္နာမည္ ၆</a></li>
<li><a href="#">လင့္နာမည္ ၇</a></li>
<li><a href="#">လင့္နာမည္ ၈</a></li>
</ul>
</li>
<li><a href="#">ေဖ်ာ္ေျဖေရးလင့္</a>
<ul>
<li><a href="#">ေဖ်ာ္ေျဖေရးလင့္ ၁</a></li>
<li><a href="#">ေဖ်ာ္ေျဖေရးလင့္ ၂</a></li>
<li><a href="#">ေဖ်ာ္ေျဖေရးလင့္ ၃</a></li>
<li><a href="#">ေဖ်ာ္ေျဖေရးလင့္ ၄</a></li>
<li><a href="#">ေဖ်ာ္ေျဖေရးလင့္ ၅</a></li>
<li><a href="#">ေဖ်ာ္ေျဖေရးလင့္ ၆</a></li>
<li><a href="#">ေဖ်ာ္ေျဖေရးလင့္ ၇</a></li>
<li><a href="#">ေဖ်ာ္ေျဖေရးလင့္ ၈</a></li>
<li><a href="#">ေဖ်ာ္ေျဖေရးလင့္ ၉</a></li>
<li><a href="#">ေဖ်ာ္ေျဖေရးလင့္ ၁၀</a></li>
</ul>
</li>
<li><a href="http://www.zaung.net/">ေဇာင္း</a></li>
<li><a href="#">သြားေနက်ေနရာမ်ား</a>
<ul>
<li><a href="#">Blog နာမည္ ၁</a></li>
<li><a href="#">Blog နာမည္ ၂</a></li>
<li><a href="#">Blog နာမည္ ၃</a></li>
<li><a href="#">သင္ႀကိဳက္ရာမ်ား</a>
<ul>
<li><a href="#">သင္ႀကိဳက္ရာမ်ား ၁</a></li>
<li><a href="#">သင္ႀကိဳက္ရာမ်ား ၂</a></li>
<li><a href="#">သင္မႀကိဳက္တဲ့အရာမ်ား</a>
<ul>
<li><a href="#">သင္မႀကိဳက္တဲ့အရာမ်ား ၁</a></li>
<li><a href="#">သင္မႀကိဳက္တဲ့အရာမ်ား ၂</a></li>
<li><a href="#">သင္မႀကိဳက္တဲ့အရာမ်ား ၃</a></li>
<li><a href="#">သင္မႀကိဳက္တဲ့အရာမ်ား ၄</a></li>
<li><a href="#">သင္မႀကိဳက္တဲ့အရာမ်ား ၅</a></li>
</ul>
</li>
<li><a href="#">သင္ႀကိဳက္ရာမ်ား ၃</a></li>
<li><a href="#">သင္ႀကိဳက္ရာမ်ား ၄</a></li>
<li><a href="#">သင္ႀကိဳက္ရာမ်ား ၅</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="http://www.nweyoe.net/">ႏြယ္႐ိုး (လင္းထက္)</a></li>
</ul>
<br style="clear: left" />
</div>

<a href="#" rel="drillback-drillmenu1"><img src="backbutton.jpg" style="border-width:0; margin:10px 0 10px 17px" /></a>


ၿပီးသြားရင္ Save မွတ္လိုက္ပါ...။ ေအာက္မွာျပထားတာကေတာ့ သင္လင့္ထည့္ရမည့္ ေနရာပါ...။

#ဆိုတဲ့ ေနရာမွာ သင္ထည့္ခ်င္ေသာလင့္ကို သြင္းရမွာပါ


အားလံုးကိုေတာ့ အေကာင္းဆံုး႐ွင္းလင္း ေနေအာင္ အတတ္နိုင္ဆံုး ျပဳလုပ္ေပးထားပါတယ္...။ နားမလည္ဘူးဆိုရင္ေတာ့ ကၽြန္ေတာ့ ညံဖ်င္းမႈေၾကာင့္ပါ.......။ အားလံုးအဆင္ေျပနိုင္ၾကပါေစ....။

Moe Eaint Phyu

This entry was posted on 09:55 and is filed under . You can leave a response and follow any responses to this entry through the Subscribe to: Post Comments (Atom) .

0 comments

Real Time Web Analytics