Sunday, August 19, 2012

post တဲ့ အခါမွာ စာပိုဒ္ေလးေတြ ပံုေလးေလးေတြကို Hide လုပ္ျပီးေရး ၾကမယ္

၁။ ေအာက္မွာေပးထားတဲ့ ကုဒ္ေလးေတြကို Design>>Template Designer>>Advenced>>Add CSS ကိုသြားလိုက္ပါ။

၂။ ေအာက္မွာေပးထားတဲ့ ကုဒ္ေလးေတြကို ေကာ္ပီ(copy)ယူျပီး css box မွာ (paste) ထည့္လိုက္ပါ။
.posthidden {display:none}
.postshown {display:inline}
၃။ ေနာက္တစ္ဆင့္အေနနဲ႔ ေအာက္မွာေပးထားတဲ့ ကုဒ္ေတြကို ေကာ္ပီယူျပီး</head> အေပၚက ထည့္လိုက္ပါ။

<script type="text/Javascript">

function expandcollapse (postid) {

   whichpost = document.getElementById(postid);
 
   if (whichpost.className=="postshown") {
      whichpost.className="posthidden";
   }
   else {
      whichpost.className="postshown";
   }
}
</script>

၄။ မိမိ၏တိန္းပလိတ္(template) ကို နမူနာ(preview) နဲ႔ ၾကည့္လိုက္ပါ။ Error မတက္ဘူးဆိုရင္ တိန္းပလိတ္ ကို သိမ္း(Save) လိုက္ပါ။

မွတ္ခ်က္။ ။ မိမိ post တင္ခ်ိန္မွာေတာ့ မိမိ ေဖ်ာက္(Hide) ျပီးေရးခ်င္တဲ့ အေၾကာင္းအရာေလးေတြကို ေအာက္မွာျပထားတဲ့ အတိုင္းေရးရမွာျဖစ္ပါတယ္။
ေအာက္ကအတိုင္းမေရးရင္ေတာ့ (Hide) ျဖစ္မွာ မဟုတ္ပါဘူး။
ဥမမာ ၁။ဒါကေတာ့ မိမိ (Hide)လုပ္ျပီးေရးခ်င္တဲ့ စာပိုဒ္ေလးကိုေဖ်ာက္ျပီးေရးတာပါ။

<a href="javascript:expandcollapse('subtopic0001')">
<h4>ေခါင္းစဥ္ထည့္ပါ</h4></a>
<span class="posthidden" id="subtopic0001">
မိမိ ေဖ်ာက္(Hide) ျပီးေရးခ်င္တဲ့ အေၾကာင္းအရာကို ဒီေနရာမွာေရးပါ</span>

ဥပမာ ၂။ ဒါကေတာ့ အေၾကာင္းအရာ စာသားႏွင့့္ ပံု ကို ေဖ်ာက္ျပီးေရးနည္းပါ။

<a href="javascript:expandcollapse('subtopic0002')">
<h4>ေခါင္းစဥ္ထည့္ပါ</h4></a>
<span class="posthidden" id="subtopic0002">
<img SRC="ဒီေနရာေလးမွာ မိမိပံု၏ လင့္ ကို ထည့္ပါ"border="0">
မိမိ ေဖ်ာက္(Hide) ျပီးေရးခ်င္တဲ့ အေၾကာင္းအရာကို ဒီေနရာမွာေရးပါ</span>

ဥပမာ ၃။ ဒါကေတာ့ စားသားႏွင့္ ပံု ၁ ပံု (သို႔)၂/၃ ပံုကို ေဖ်ာက္ျပီးေရးတာပါ။
<a href="javascript:expandcollapse('subtopic0003')">
<h4>ေခါင္းစဥ္ေရးပါ</h4></a>
<span class="posthidden" id="subtopic0003">
<img SRC="ဒီေနရာေလးမွာ မိမိပံု၏ လင့္ ကို ထည့္ပါ"border="0">
<img SRC="ဒီေနရာေလးမွာ မိမိပံု၏ လင့္ ကို ထည့္ပါ"border="0">
အေၾကာင္းအရာ ကို ဒီေနရာမွာ ထည့္ပါ</span>

ဥပမာ ၁၊၂၊၃ အားလံုးကိုလဲ ထည့္ေရးလို႔ ရပါတယ္....။

အားလံုးအဆင္ေျပၾကပါေစ။ ေအာက္မွာ နမူနာ ထည့္ျပထားပါတယ္။
ေလးစားစြာျဖင့္ WiD(walkerindark)

ဒီမွာႏိႈက္ၾကည့္ပါ




နမူနာပံုေလးေတြပါ အားလံုးအဆင္ၾကပါေစ....။


Labels: ,

0 Comments:

Post a Comment

Subscribe to Post Comments [Atom]

<< Home