All in One: မိမိတို့ Blog မှာ မြန်မာစာကိုဇော်ဂျီနဲ့ ယူနီကုဒ်နှစ်မျိုးစလုံးဖတ်လို့ရအောင်လုပ်နည်း

Thursday, August 4, 2016

မိမိတို့ Blog မှာ မြန်မာစာကိုဇော်ဂျီနဲ့ ယူနီကုဒ်နှစ်မျိုးစလုံးဖတ်လို့ရအောင်လုပ်နည်း



ယခုအခါယူနီကုဒ်သုံးစွဲလာသူတွေ အများအပြားရှိလာပြီဖြစ်တဲ့အတွက်
မိမိတို့ရဲ့ Blog တွေမှာယူနီကုဒ်သုံးစွဲသူတွေပါ ဖတ်လို့ရအောင်လုပ်ဆောင်ပေးဖို့လိုအပ်ပါပြီ။
လွန်ခဲ့တဲ့ရက်အနည်းငယ်ကမှယူနီကုဒ်ကိုတစ်နိုင်ငံလုံးအတိုင်းအတာဖြင့်
ကျယ်ပြန့်စွာအသုံးပြုလာရေးကို အစိုးရကထုတ်ပြန်လိုက်တဲ့အတွက်
Blogger များအနေနဲ့လည်း မိမိတို့ဘလော့ကိုယူနီကုဒ်နဲ့ရေးသားပေးဖို့လိုအပ်လာပါပြီ။
ယူနီကုဒ်နဲ့မရေးနိုင်သေးရင်တောင် ဖတ်လို့ရအောင်တော့လုပ်ပေးသင့်ပါတယ်။
ကျွန်တော် Blog တွေမှာတော့အကုန်လုံးယူနီကုဒ်နဲ့ပဲရေးသားထားပါတယ်။
ဖတ်ရှု့သူများအဆင်ပြေအောင် Zawgyi Unicode Font Chooser သို့မဟုတ်
Font Embed ပဲလုပ်ထားပေးလိုက်ပါတယ်။
ဒါဆိုဖတ်ရှု့သူများအနေနဲ့ဘာဖောင့်သုံးသုံးအကုန်ဖတ်လို့ရတာပေါ့။
Font Chooser ထည့်ထားရင် Blog ရဲ့ဘယ်ဘက်အပေါ
ဒေါင့်နားလေးမှာ Zawgyi One နဲ့ Unicode ကိုရွေးပြီးဖတ်ရှု့လို့ရပါတယ်။
Font Embed လုပ်ရင်တော့ဘာမှရွေးစရာမလိုပါ
ဒီတိုင်းဘယ်သူလာလာအမှန်မြင်နိုင်ဖတ်ရှု့နိုင်မှာပါ။
ဖတ်ရှု့သူတွေရဲ့ဖုန်းမှာလည်း မြန်မာဖောင့်မထည့်သွင်းထားရင်တောင်ဖတ်ရှု့လို့ရနိုင်ပါတယ်။
အခု Myanmar Tutorials ကိုလည်း Font Embed လုပ်ထားတာပါ။
ရေးတာကတော့ယူနီကုဒ်နဲ့ပဲရေးထားပါတယ် Font ကိုတော့
Noto Sans Myanmar နဲ့ Embed လုပ်ထားတာပါ။
တကယ်လို့ကိုယ့် Blog မှာဇော်ဂျီနဲ့ရေးထားရင် Zawgyi ကို Embed လုပ်ပေးရမှာပါ။
ယူနီကုဒ်နဲ့ရေးထားရင်တော့ Unicode ဖောင့်တစ်ခုခုနဲ့ embed လုပ်ပေးပေါ့။
ကျနော်အနေနဲ့ဆိုရင်တော့ Zawgyi နဲ့ရေးသားထားတဲ့ Blog တစ်ခုလုံးကို Unicode ပြောင်းပစ်ပြီး Unicode Embed လုပ်စေချင်ပါတယ်။
ဒါဆိုနောက်ပိုင်းပြဿနာတက်စရာမရှိတော့ပါဘူး အလုပ်မရှုပ်တော့ဘူးပေါ့။
ဇော်ဂျီနဲ့ရေးသားထားတဲ့ Blog တွေကို အလွယ်ကူဆုံးအမြန်ဆုံး
ယူနီကုဒ်ပြောင်းလို့ရတဲ့နည်းကို မနက်ဖြန်ကျမှတင်ပေးပါ့မယ်။
အခုလောလောဆယ်တော့ နှစ်မျိုးဖတ်လို့ရအောင်လုပ်တဲ့နည်းကိုအရင်ပြောကြတာပေါ့။
တကယ်တမ်းဒီနည်းတွေကလွယ်လွယ်လေးပါ ကျွန်တော်မနှစ်လောက်ကတည်းက
Blog တစ်ခုကနေတွေ့လာတာပါ ဘယ်ကနေလဲတော့မမှတ်မိတော့ဘူး
Credit ပေးပါတယ် :D

ကျနော်ပထမဦးဆုံး Zawgyi Unicode Font Chooser ထည့်တဲ့နည်းကိုအရင်ပြောပြပါမယ်။
ပိုလွယ်လို့ပါ ဒါမယ့် Font Embed ကတော့ပိုအဆင်ပြေမယ်ထင်ပါတယ်။
ဒါမယ့်ကျွန်တော်သိသလောက် နှစ်မျိုးစလုံးဖော်ပြပေးလိုက်ပါမယ်။
အခုမှ Blog စရေးတဲ့သူတွေအတွက်ပါအဆင်ပြေအောင်ပုံနဲ့ပြပေးလိုက်ပါတယ်။
ဆရာများသီးခံဖတ်ရှု့ပေးပါ :P

အောက်ကကုဒ်တွေကိုကူးပြီး မိမိတို့ရဲ့ Blogger > Layout ထဲကိုသွားလိုက်ပါ။


<script type="text/javascript"
src="http://yourjavascript.com/6384201297/uni-zawgyi-webconverter.js"></script>



အဲ့ဒီထဲကအဆင်ပြေတဲ့ Add a Gadget ကိုနှိပ်လိုက်ပါ။
ကြိုက်တဲ့နေရာနှိပ်လို့ရပါတယ်။
( ပုံမှာကကြိုက်တာရွေးလို့ရတဲ့အကြောင်းပြောချင့်လို့
Add a Gadget ပါတဲ့နေရာတွေပြထားတာပါ :P )


အဲ့ဒီမှာနောက် Windows တစ်ခုတက်လာပါလိမ့်မယ်။
Gadget တွေအများကြီးထဲက HTML/JavaScript ကိုရွေးလိုက်ပါ။
ကျနော်တို့က အပေါ်က JavaScript တွေကိုထည့်မှာမို့လို့လေ။ အဲ့ဒါကြောင့်ပါ။


ကော်ပီကူးလာတဲ့ ကုဒ်တွေကို Paste ချပေးပြီး Save ပေးလိုက်ပါ။


ဒါဆိုရပါပြီ မိမိတို့ရဲ့ Blog ကိုသွားကြည့်လိုက်ပါ။
Blog ရဲ့ဘယ်ဘက်အပေါ်ဒေါင့်နားလေးမှာ Choose Font Here ဆိုတာလေးရောက်နေပါလိမ့်မယ်။
အဲ့ဒီမှာ Zawgyi One နဲ့ Unicode ကိုအလွယ်တကူရွေးချယ်ပြီးဖတ်ရှု့လို့ရပါပြီ :)


ဒီ Font Chooser လေးကိုဘယ်သူလုပ်ပေးထားတာလည်းတော့မသိဘူးဗျ
အဲ့ဒီတော့ဒီတိုင်းပဲ Credit ကိုအမည်မသိလို့ပဲပေးလိုက်ပါမယ် :P

Font Embed
============
Font Embed လုပ်တဲ့နည်းကိုဆက်သွားကြရအောင်
Font Embed လုပ်နည်းကလည်းလွယ်ပါတယ်။
ကိုယ် Embed လုပ်ချင်တဲ့ Web ဖောင့်ကိုယူပြီး CSS မှာသွားထည့်ပေးရုံပါပဲ..:D
Unicode ဖောင့်တွေကိုတော့ Google ကနေအခမဲ့ယူသုံးလို့ရပါတယ်။
Google Fonts မှာ Public တင်ပေးထားပါတယ်။
Zawgyi ကိုတော့ ဆရာစေတန်ဂေါ့ရဲ့ MmWebFonts ကနေသွားယူသုံးလို့ရပါတယ်။
ကိုယ်တိုင် Hosting တစ်ခုခုကနေတင်ပြီးယူသုံးလို့လည်းရပါတယ်။
မူရင်းလင့်ကဒီမှာပါ http://mmwebfonts.comquas.com/#how-to-use
အဲ့မှာလည်းကိုယ်တိုင်သွားယူလို့ရပါတယ်။
ယူနီကုဒ်ဖောင့် ၁၀ မျိုးနဲ့ ဇော်ဂျီဖောင့်တစ်ခုတင်ပေးထားပါတယ်။
အခုကျွန်တော်တို့က Zawgyi ကိုသုံးမှာဆိုတော့ Zawgyi One ကိုပဲယူရမှာပါ။

အောက်ကကုဒ်တွေကို ကော်ပီကူးပြီး Blogger > Template ကိုသွားလိုက်ပါ။

@font-face {
font-family:'Zawgyi-One';
src:local('Zawgyi-One'),url('http://mmwebfonts.comquas.com/fonts/zawgyi.ttf');
}
body,html,p,code,*,table,td,tr,span,div,a,ul,li,input,textarea{font-family:'Zawgyi-One'!important;}




Customize ကိုနှိပ်လိုက်ပါ။


ပြီးရင် Advanced ကိုနှိပ်ပြီး Add CSS ကိုနှိပ်လိုက်ပါ။
ပြီးရင်ညာဘက်ကကွက်လပ်ထဲမှာကူးလာတဲ့ ကုဒ်တွေကို  Paste ချပေးလိုက်ပါ။


အားလုံးပြီးသွားရင်တော့ညာဘက်အပေါ်ဒေါင့်က Apply to Blog ကိုနှိပ်ပေးလိုက်ပါ။
ပြီးရင်မိမိတို့ရဲ့ Blog ကိုဝင်ကြည့်ပြီးစမ်းနိုင်ပါတယ်။
မြန်မာဖောင့်မရှိတဲ့စက် ယူနီကုဒ်အသုံးပြုထားတဲ့စက်ကနေဝင်ကြည့်လိုက်ပါ။
အမှန်ဖတ်လို့ရတာကိုတွေ့ရပါလိမ့်မယ်။

For Unicode Blog
===============
နောက်တစ်ခုကကျွန်တော်တို့ယူနီကုဒ်အသုံးပြုထားတဲ့ Blog တွေအတွက်ပါ။
အပေါ်ကကိုစေတန်ဂေါ့ဆိုက်ကနေလည်းဖောင့်တွေကိုယူသုံးလို့ရပါတယ်။
ဖောင့်ပုံစံ ၁၀ မျိုးတင်ပေးထားတဲ့အတွက် အဲ့ဒီ ၁၀ မျိုးသုံးလို့ရပါတယ်။
ထည့်နည်းကတော့အပေါ်က Zawgyi ထည့်သလိုပါပဲ ကုဒ်တွေကော်ပီကူးပြီး
Template > Customize > Advanced ထဲက Add CSS ကနေသွားထည့်ပေးရုံပါ။

@font-face {
font-family:'MON3 Anonta 1';
src:local('MON3 Anonta 1'),url('http://mmwebfonts.comquas.com/fonts/?font=mon3');
}
body,html,p,code,*,table,td,tr,span,div,a,ul,li,input,textarea{font-family:'MON3 Anonta 1'!important;}

MmWebFonts ကတခြားဖောင့်တွေနဲ့သုံးချင်တယ်ဆိုရင်တော့
အပြာရောင်ပြထားတဲ့နေရာမှာ MmWebFonts မှာကိုယ်သုံးမယ့်ဖောင့်ရဲ့နာမည်အတိုင်းထည့်ပေးပါ။
အနီရောင်နေရာမှာတော့ဖောင့်ရဲ့လင့်လေးကိုထည့်ပေးရမှာပါ။
ဥပမာ PyiDaungSu နဲ့သုံးမယ်ဆိုအောက်ပါလိုမျိုးပြင်ပေးရမှာပါ။

@font-face {
font-family:'Pyidaungsu';
src:local('Pyidaungsu'),url('http://mmwebfonts.comquas.com/fonts/?font=pyidaungsu');
}
body,html,p,code,*,table,td,tr,span,div,a,ul,li,input,textarea{font-family:'Pyidaungsu'!important;}

အဆင်ပြေပါစေ...

ကျွန်တော်ကတော့ Google ကပေးထားတဲ့ Noto Sans Myanmar Font ကိုပဲသုံးလိုက်ပါတယ်။
ကျွန်တော် Blog မှာလည်းသူ့ကိုပဲသုံးထားပါတယ်။
အောက်မှာ Notosans Myanmar ဖောင့်အတွက် ကုဒ်တွေပါ။
ကော်ပီကူးပြီး CSS ထဲသွားထည့်ပေးရုံပါ။
Google ကတင်ပေးထားတဲ့ တခြားယူနီကုဒ်ဖောင့်တွေလည်းရှိပါသေးတယ်။
ဒီကနေ https://www.google.com/fonts/earlyaccess
သွားရှာပြီးတခြားဖောင့်စတိုင်တွေနဲ့သုံးနိုင်ပါသေးတယ်။


@font-face {
  font-family: 'Noto Sans Myanmar';
  font-style: normal;
  font-weight: normal;
  src: url(//fonts.gstatic.com/ea/notosansmyanmar/v3/NotoSansMyanmar-Regular.eot);
  src: url(//fonts.gstatic.com/ea/notosansmyanmar/v3/NotoSansMyanmar-Regular.eot?#iefix) format('embedded-opentype'),
       url(//fonts.gstatic.com/ea/notosansmyanmar/v3/NotoSansMyanmar-Regular.woff2) format('woff2'),
       url(//fonts.gstatic.com/ea/notosansmyanmar/v3/NotoSansMyanmar-Regular.woff) format('woff'),
       url(//fonts.gstatic.com/ea/notosansmyanmar/v3/NotoSansMyanmar-Regular.ttf) format('truetype');
}
* , html, body, div,p ,post-body-snippet,title,widget-content{font-family:'Noto Sans Myanmar'!important;}

အဆင်မပြေတာများရှိရင် Comment ချန်ထားပေးပါ :D




Thank You :)

No comments:

Post a Comment