Monday, July 02, 2007

sIFR Flash font embedding for Myanmar Unicode Zawgyi-one

The following is the another font embedding method like "weft eot" for Burmese font. Unlike eot, this one uses flash. In this tutorial I will show you how to embed zawgyi-one Myanmar Unicode font.

မွတ္မိလား မသိဘူး၊ ကၽြန္ေတာ္တို႕ Web pageေပၚက ျမန္မာစာကို font install လုပ္မထားတဲ့ စက္ေတြမွာပါ ျမင္ရေအာင္ လုပ္ဖို႕ အရင္က eot tutorial တစ္ခု ေရးခဲ့ဖူးပါတယ္။ eot ရဲ႕ အားနည္းခ်က္က IE browser တစ္မ်ဳိးတည္းမွာပဲ အလုပ္လုပ္တာပါပဲ။
ဟိုတစ္ေလာက အခုေျပာျပမယ့္ sIFR ဆိုတဲ့နည္းကို  ထပ္ေတြ႕လို႕ စမ္းၾကည့္ျဖစ္ပါတယ္။ သူကေတာ့ ဘယ္browser မွာမဆို သံုးလို႕ရတာေတြ႕ေတာ့ ကၽြန္ေတာ္ ေတာ္ေတာ္ ေပ်ာ္သြားတယ္။ ေနာက္ ျမန္မာ စာလံုးေလးေတြကလည္း cleartype မသံုးထားရင္ေတာင္ လွေနတာပဲ။ ေနာက္ file size က 26.5KB ပဲ႐ွိတာမို႕ eotထက္ အမ်ားၾကီး ပိုေသးပါတယ္။  ထပ္ေျပာရရင္ ဒါက OS platform ေတာင္ ေ႐ြးမယ့္သေဘာမ႐ွိပါဘူး။ နမူနာ page ကို ဒီမွာၾကည့္ပါ။

အခုကေတာ့ font ဘယ္လိုလုပ္သလဲ java script နဲ႕ CSS ကို ဒီ font အတြက္ ဘယ္လို configure လုပ္သလဲဆိုတာ မေရးေတာ့ပါဘူး။ အဲ့ဒါကို ဒီမွာ ဖတ္လို႕ရပါတယ္။ အဲေတာ့ ကၽြန္ေတာ္ လုပ္ျပီးသား font , java script နဲ႕ CSS ကို ဘယ္လို implement လုပ္မလဲဆိုတာပဲ ေရးပါမယ္။

ကဲထားပါေတာ့ နိဒါန္းခ်ီတာမ်ားေနျပီ။ အလုပ္စရေအာင္။

java script ကို </head> မတိုင္ခင္ေလးမွာ ထားပါ။
 <script src="http://dathana.googlepages.com/sifr.js" type="text/javascript"></script>
 <script src="http://dathana.googlepages.com/sifr-config.js" type="text/javascript"></script>

ျပီးရင္...
ဒီစာသားအားလံုးကို ကူးျပီး CSS အပိုင္းမွာ paste လုပ္ပါ။

template အပိုင္းကေတာ့ ဒါပါပဲ။
ကိုယ္ေရးတဲ့စာကို <p class="sIFR-root"> ဆိုတဲ့ tag ထဲမွာ ေရးပါ။
ဥပမာ...
<p class="sIFR-root">ဘာညာကြိကြ ဘာညာကြိကြ<br /></p>
note: ျမန္မာစာရဲ႕ line-height ေၾကာင့္ထင္ပါတယ္၊ ေအာက္ေျခမွာ ျပတ္ေနတတ္တယ္။ ဒါေၾကာင့္ <br /> ေလးေတြ ကို အဆံုးမွာလိုသေလာက္ ထည့္ေပးပါ။   

ျပီးပါျပီ။
hope this helps :)

အင္း... install လုပ္နည္း ေျပာျပလိုက္ေတာ့ ခဏေလး၊ ကၽြန္ေတာ့္မွာေတာ့ လုပ္ရင္း ပတ္ခ်ာလည္ေနတာက အၾကာၾကီး။ သူေပးထားတဲ့ tutorial က စံုေအာင္ရွင္းမထားဘူး။ ပထမ ေနာက္ခံ transparent မဟုတ္ပဲ အျဖဴခံ ေပၚမွာ ေပၚလာတယ္။ ဒီျပႆနာကိုလည္း လိုက္႐ွာ လိုက္ရတာ အၾကာၾကီး။  ေနာက္တစ္ခုက သူ႕ tutorial မွာ headder tag ေတြနဲ႕ စမ္းျပထားတယ္။ headder ထဲမွာေရးရမွာ CSS နဲ႕ စာလံုးခ်ိန္လို႕ရေပမယ့္ သဘာ၀မက်ဘူး။ စမ္းရင္းစမ္းရင္း နဲ႕မွ p tag နဲ႕ရသြားတယ္။  ေနာက္ locally စမ္းေတာ့ Link ေတြႏိွပ္ရင္ မသြားဘူး။ ႐ႈပ္ေနတာပါပဲ။

အဆိုးဆံုးက PC ေပၚမွာစမ္းျပီး ရျပီေတာ့ online တင္ျပီးစမ္းေတာ့ မရဘူး။ ဟာ... ဒါကမွ ဘယ္လိုမွ အေျဖ႐ွာမရတာ။ ကၽြန္ေတာ့္ connection ကလည္း ေႏွးေႏွးနဲ႕။ ေနာက္ဆံုး Opera မွာ စမ္းလိုက္ေတာ့ ရတယ္။ ဒါနဲ႕ firefox ကို ဘာ add-on မွ မပါပဲ စမ္းလိုက္တယ္။ ရသြားတယ္။ အဲေတာ့မွ flash block ဆိုတဲ့ add-on ကို သြားသတိရတယ္။ ေၾသာ္... ဒီေကာင္က zawgyi-one.swf flash file ကို ပိတ္ထားတာကိုး။ အဲဒါပါပဲခင္ဗ်ာ။ ဒါမသံုးခင္  flash block ႐ွိရင္အရင္ပိတ္ပါ။
Link:  http://novemberborn.net/sifr3/beta1
PS: ၾကိဳက္ၾကရဲ႕လား မသိဘူး။ စက္နဲနဲေလးလို႕ ကၽြန္ေတာ္ေတာ့ စဥ္းစားေနတုန္းပဲ။


3 comments:

  1. မဆုိးဘူးဗ်။ ေအာ္ပရာမွာ သံုးလုိ႕ရတယ္ဆုိေတာ့ ေကာင္းတာေပါ့။ ႏုိ႕မုိ႕ဆုိရင္ ျမန္မာ ၂ ကုိပဲ အားကုိးရမဲ့ ပံုေပါက္ေနတယ္ေလ။

    ReplyDelete
  2. ေက်းဇူးတင္ပါတယ္...ဒီပို.စ္ အတြက္
    း)

    ReplyDelete

Note: Only a member of this blog may post a comment.