ဘေလာ့မွာ Code ေတြကို Syntax နဲ႔ ေဖာ္ျပခ်င္ရင္

ဒီတစ္ခါလည္း ဘေလာ့မွာ code ေတြကို code view နဲ႔ ေဖာ္ျပတဲ့ ပံုစံမ်ိဳး .. Syntax Highliter နဲ႔ ေဖာ္ျပေပးတဲ့ widget ကိုတင္ေပးသြားပါမယ္။ အဲဒီလိုမ်ိဳး ဘေလာ့မွာ ေရးတဲ့ ဘေလာ့အကူအညီလိုဟာမ်ိဳးပဲျဖစ္ျဖစ္ တျခား အလြယ္အကူကူးယူေစခ်င္တဲ့ စာသားေတြ code ေတြကို သီးသန္႔ေလး ေဖာ္ျပေပးလို႔ ရပါတယ္။ လုပ္ရမယ့္ အဆင့္က သိပ္မမ်ားပါဘူး။

(၁) ထံုးစံအတိုင္း blogger.com မွာ sign in လုပ္ပါ။ Layout ထဲက Edit HTML ကို သြားပါ။ Ctrl+Fနဲ႔ </head> ကိုရွာပါ။ ေတြရင္ ေအာက္က code ေတြကို သူ႔ရဲ႕ အေပၚမွာ ထည့္ေပးရပါမယ္။

<link href='http://www.sigmirror.com/files/16077_mfmek/SyntaxHighlighter.css' rel='stylesheet' type='text/css'/>
<script language='javascript' src='http://www.sigmirror.com/files/16075_vovs4/shCore.js'/>
<script language='javascript' src='http://www.sigmirror.com/files/16067_qdw00/shBrushJava.js'/>
<script language='javascript' src='http://www.sigmirror.com/files/16068_sxqrw/shBrushJScript.js'/>
<script language='javascript' src='http://www.sigmirror.com/files/16074_y4x0p/shBrushXml.js'/>
<script language='javascript' src='http://www.sigmirror.com/files/16065_pax2t/shBrushCss.js'/>
<script language='javascript' src='http://www.sigmirror.com/files/16081_8ztl5/shBrushProperties.js'/>
<script language='javascript' src='http://www.sigmirror.com/files/16080_4fwwe/shBrushBash.js'/>

အထက္က code ေတြထဲက Js ဖိုင္ေတြကို ကိုယ္ပိုင္ upload ျပန္တင္ဖို႔ လိုအပ္မယ္။ မဟုတ္ရင္ bandwidth မႏိုင္လို႔ ဒီ js ေတြ အလုပ္ လုပ္မွာ မဟုတ္ပါဘူး။ www.sigmirror.com မွာ ကိုယ္ပိုင္ account တစ္ခုနဲ႔ ျပန္တင္ေပးဖို႔ လုိအပ္ပါမယ္။
(၂) ေနာက္တဆင့္အေနနဲ႔ Ctrl+F နဲ႔ </body> ကိုရွာပါ။ ေတြ႔ရင္ ေအာက္က code ေတြကို သူ႔ရဲ႕ အေပၚမွာ ထည့္ေပးလိုက္ပါ။

<script language='javascript'>
dp.SyntaxHighlighter.ClipboardSwf=&#39;http://www.sigmirror.com/files/16078_i3xhu/clipboard.swf&#39;;
dp.SyntaxHighlighter.BloggerMode();
dp.SyntaxHighlighter.HighlightAll(&#39;code&#39;);
</script>

အထက္ပါ code ေတြကို ထည့္ ၿပီးရင္ေတာ့ save လိုက္ပါ။ ဒါဆိုရင္ widget ကေတာ့ ထည့္လို႔ ၿပီးသြားပါၿပီ။ အဲဒီ code ေတြ ဘယ္လိုေရးရမယ္၊ ဘယ္လိုထည့္ရမယ္ဆိုတာ ေျပာျပပါမယ္။ အဲလို code ေတြ ေပၚဖို႔ ျပင္ေပးဖို႔ လုိအပ္ပါမယ္။
(၃) Settings ထဲက Formatting ကိုသြားပါ။ အဲဒီထဲမွ Post Template ထဲကို ဒီေအာက္က code ေတြကို ထည့္ေပးထားလိုက္ပါ။ ၿပီးရင္ save ေပးလိုက္ပါ။ ဒါဆိုရင္ new post ေရးတိုင္း ေအာက္က code ေတြ ရွိေနမွာ ျဖစ္ပါတယ္။

<pre name="code" class="java">
<သင္ေရးလိုေသာ code ကို ဤေနရာတြင္ ထည့္ပါ>
</pre>

ကဲဗ်ာ.. ဒါဆိုရင္ေတာ့ ဘေလာ့မွာ code ေတြကို Syntax highliter နဲ႔ ေဖာ္ျပတဲ့ Widget ကို ထည့္လို႔ၿပီးပါၿပီ။ အဆင္မေျပတာမ်ား ရွိရင္လည္း comment ေပးသြားၾကပါ။ အဆံုးတိုင္ဖတ္ေပးၾကလို႔ ေက်းဇူးတင္ပါတယ္ခင္ဗ်ာ။

Ref: www.anshuldudeja.com

Posted in: Blog ဆုိင္ရာနည္းပညာ,ကုဒ္မ်ား