ျမန္မာေဖာင့္ကို Embed လုပ္ဖို႕လိုလာလို႕ ထုံးစံအတိုင္း အရင္ဆုံး ကိုေစတန္ရဲ့ Site ေပၚမွာပဲ http://mmwebfonts.comquas.com သြားျပီး ေလ့လာခဲ့ပါတယ္။ အဲဒီမွာေတြ႕တာက ဥပမာ- ေဇာ္ဂ်ီ ဆိုပါေတာ့။ HTML Header ထဲမွာ -

<link href='http://mmwebfonts.comquas.com/fonts/?font=zawgyi' rel='stylesheet' type='text/css'/>

အဲဒါကို CSS ထဲမွာေအာက္ပါအတိုင္း-

font-family: Zawgyi-One;

.. ေခၚသုံးရမယ္ေပါ့ဗ်ာ။ အဲဒါအစကေတာ့ မသိသာဘူးဗ်။ ေနာက္မွ ကြၽန္ေတာ္ Font Embedding ကို အင္တာနက္မရွိပဲ (သို႕) mmwebfonts ဆိုက္ဒ္နဲ႕ Connection မရွိပဲ .. Standlone (Offline) Embed လုပ္ဖို႕လိုလာတဲ့အခါ မွ-- အထက္ပါနည္းလမ္းက ဘယ္လိုမွအလုပ္မလုပ္မွာကို အဲေတာ့မွ သတိထားမိသြားတယ္။ (အစကဒီလိုပဲ အလြယ္ လုပ္လိုက္႐ုံမို႕လို႕ပါ။)

အဲေတာ့မွကြၽန္ေတာ္ ကိုေစတန္ရဲ့ Source ကို Github (https://github.com/saturngod/mmwebfonts) ကေနယူျပီး ဖတ္ၾကည့္လိုက္မိတယ္ဗ်။ အဲဒီမွာသြားေတြ႕တာက ကိုေစတန္က Google Analytics Tracker ေတြပါေရာထည့္ထားတာ ေတြ႕ရတယ္။

ဘာလို႕လဲဗ်ာ? Tracking လုပ္တာ User ေတြကိုလဲ အသိေပးမထားဘူး။ ျပီးေတာ့ Connection က GA Tracking လုပ္ျပီးမွ ျပန္ျပန္လာတာဆိုေတာ့ အနည္းဆုံး ၂ ဆ ေလာက္ေတာ့ပိုေႏွးသြားျပီ။ ကဲထားပါေတာ့ဗ်ာ။ ကြၽန္ေတာ္အျမင္ကိုေျပာတာပါ။ လက္ေတြ႕ျပႆနာက Offline Embedding လုပ္လို႕ရဖို႕ပါ။ ဒီအတိုင္းဆို ကိုေစတန္ရဲ့ (Website ေပၚက) နည္းလမ္းနဲ႕ Offline Embedding လုပ္လို႕မရပါဘူး။ (Internet ရွိမွကိုရမွာပါ။)

ဒီေတာ့ဗ်ာ.. ျမန္မာ Font ေတြကို Offline Embedding (သို႕) ကိုယ့္ Website Folder ထဲက Font File ကိုပဲျပန္ျပီး Embed လုပ္လို႕ရမယ့္ နည္းလမ္း လြယ္လြယ္ေလးကို Share လိုက္ပါတယ္။

ဥပမာ- ေဇာ္ဂ်ီ အတြက္ဆိုပါေတာ့။

• အရင္ဆုံးလိုတဲ့ ဖိုင္ ၂ ဖိုင္ ( "zawgyi.eot" + "zawgyi.ttf" ) ကို Download ဆြဲ။ (ကိုေစတန္ေပးတားတဲ့ Github Source ထဲမွာလဲရွိပါတယ္ (သို႕) ေအာက္မွာလဲ Download လို႕ရပါတယ္။)
• ျပီးေတာ့.. ကိုယ့္ Website ရဲ့ ဥပမာ- "fonts" ဆိုတဲ့ Folder ထဲမွာထား။ (Upload ျပန္လုပ္)
• အဲဒီေနာက္ CSS ထဲမွာ--

@font-face {
        font-family: 'Zawgyi-One';
        src: url('fonts/zawgyi.eot');
        src: local('Zawgyi-One'), url('fonts/zawgyi.ttf') format('truetype');
    }

** ဖိုင္ ၂ ဖိုင္ကို ကိုယ္ၾကိဳက္တဲ့ေနရာမွာထားလို႕ရပါတယ္။ 'fonts' ဆိုတဲ့ေနရာမွာ Path အမွန္ေျပာင္းေပးဖို႕ပဲလိုပါတယ္။

ဒါပါပဲ!! ရလာမယ့္ အက်ိဳးဆက္ကေတာ့ --

• ၾကိဳက္ရာ Mobile (or) PC အေပၚမွာ Zawgyi Font မရွိလဲ ေပၚမွာပါ
• ကို Saturngod ဘက္က mmwebfont ဝက္ဘ္ဆိုက္ဒ္ ေဒါင္းေနရင္လဲ ရမွာပါ
• Offline Embedding (Internet မရွိလဲ) Local Network Project ေတြအတြက္ ရမွာပါ
• Rely Connection မရွိေတာ့တဲ့အတြက္ ကိုေစတန္ရဲ့ နည္းလမ္းထက္ အဆေပါင္းမ်ားစြာပိုျမန္မွာပါ
• Tracking အလုပ္မခံရႏိုင္ေတာ့ပါဘူး

Note: ကြၽန္ေတာ္လဲသုံးေနရင္း ေတြ႕လာတာေလးကို အားလုံးအဆင္ေျပေအာင္ Share ေပးတာပါ။ ကြၽန္ေတာ္ကိုယ္တိုင္လဲ တီထြင္ထားရတဲ့ နည္းလမ္းမဟုတ္သလို၊ ဘယ္သူ႕ကိုမွလဲ ထိခိုက္ေစလိုျခင္းမရွိပါဘူး။ Native CSS Trick ေတြပါပဲ။

Regards,

Arkar w.m.h