သမိုင္​း

Theme images by Storman. Powered by Blogger.

Text Widget

Sports

Gadgets

Blog Archive

Travel

Definition List

Tuesday, May 10, 2016

Myanmar Web Font for Bloggers

Myanmar Web Font

Google Web Font ကိုသေဘာက်ရင္းနဲ႔ စဥ္းစားမိတာက ျမန္မာ Unicode ေတြေကာ အဲလို လုပ္လို႔မရဘူးလားေပါ့။ အဲလိုမ်ိဳး လုပ္ဖို႔ စဥ္းစားေနတာ ၾကာေတာ့ ၾကာေနၿပီ။ ျပႆနာက ဘာလဲဆိုေတာ့ Mac OS X ျပႆနာပဲ။ Mac မွာက Master Piece ပဲ အလုပ္လုပ္တယ္။ font embed လုပ္လိုက္ရင္ အျခား unicode font နဲ႔ ေရးထားတာေတြ Mac မွာ ဖတ္လို႔မရေတာ့ဘူး။ ေနာက္ၿပီး iPhone iPad မွာ ဖတ္လို႔မရေတာ့ဘူး။ Mac မွာဆိုရင္ေတာ့ ျမန္မာ Unicode အတြက္ font embed မလုပ္တာ အေကာင္းဆုံးပဲ။ ဘာလို႔လည္းဆိုေတာ့ Rendering ေတြ အလုပ္မလုပ္ေတာ့လို႔ပါ။ iPhone , iPad မွာဆိုရင္ Masterpiece Uni Sans ပဲ အလုပ္လုပ္ပါတယ္။

Firefox မွာ ဆိုရင္ေတာ့ ျပႆနာ တစ္ခုက Cross Domain ပဲ။ Blogspot မွာ ကၽြန္ေတာ္ေပးထားတဲ့ Script ထည့္မရဘူးဆိုတာက cross domain ေၾကာင့္ပါ။ Firefox က domain မတူတာကေန request လုပ္တဲ့အခါမွာ font ကို မျပေပးဘူး။ အဲဒီေတာ့ font မျမင္ရတာေတြျဖစ္ကုန္တယ္။ မေန႔က Google App Engine ကို စမ္းေရးၾကည့္မယ္ဆိုၿပီး ေရးျဖစ္လိုက္တယ္။

http://mywebfont.appspot.com

အဲဒီျပထားတဲ့ CSS အတိုင္း အသုံးျပဳရင္ iPhone , iPad ေတြဆိုရင္ Masterpiece နဲ႔ ေျပာင္းေအာင္လည္း လုပ္ထားေပးပါတယ္။ IE ဆိုရင္လည္း EOT ကို font embed ျပန္လုပ္ထားတယ္။ Chrome နဲ႔ Mac OS ကိုေတာ့ support မလုပ္ဘူး။

ေနာက္ၿပီး အႀကံေပးခ်င္တာက Unicode font ကို သုံးမယ္ဆိုရင္ Masterpiece ကို ေရွ႕ဆုံးမွာ ထားေစခ်င္တယ္။ ဒါမွ iPhone , iPad မွာ ျမင္ရပါလိမ့္မယ္။ ေနာက္ၿပီး Mac OS နဲ႔ website ၾကည့္တဲ့ သူေတြကို အဆင္ေျပေစပါတယ္။

h1 { font-family:"Masterpiece Uni Sans",Yunghkio,Myanmar3; }

ေဇာ္ဂ်ီ သမားေတြအတြက္လည္း Zawgyi ကို font embed လြယ္လြယ္ ကူကူ ထည့္လို႔ရေအာင္ လုပ္ထားေပးပါတယ္။ ေဇာ္ဂ်ီ font မရွိတဲ့သူေတြလည္း လြယ္လြယ္ ကူကူ ၾကည့္လို႔ရေအာင္ embed လုပ္နိုင္ပါတယ္။ OFL မဟုတ္တဲ့ font ေတြက Embed လုပ္ခြင့္မရွိပါဘူး။ ဒါေၾကာင့္ OFL ရတဲ့ font ေတြကိုသာ css link ထုတ္ထားေပးတာပါ။ ဘယ္လို အသုံးျပဳလို႔ရလဲ ဆိုတာ ေအာက္မွာ ေလ့လာၾကည့္လိုက္ပါအုံး။


Code:

.yunghkio {
    font-family:"Masterpiece Uni Sans",Yunghkio;
    font-size:13px;
}
.myanmar3 {
    font-family:"Masterpiece Uni Sans",Myanmar3;
    font-size:13px;
}
.padauk {
    font-family:"Masterpiece Uni Sans",Padauk;
    font-size:18px;
}
.zawgyi {
    font-family:Zawgyi-One;
}
.parabaik {
    font-family:"Masterpiece Uni Sans",Parabaik;
    font-size:16px;
}

p , h2,h3 {
    margin-bottom:5px;   
}

p {
    padding-left:5px;
}

HtMl

<html><head>    <link href='http://mywebfont.appspot.com/css?font=yunghkio' rel='stylesheet' type='text/css'>    <link href='http://mywebfont.appspot.com/css?font=myanmar3' rel='stylesheet' type='text/css'>    <link href='http://mywebfont.appspot.com/css?font=padauk' rel='stylesheet' type='text/css'>    <link href='http://mywebfont.appspot.com/css?font=parabaik' rel='stylesheet' type='text/css'>    <link href='http://mywebfont.appspot.com/css?font=zawgyi' rel='stylesheet' type='text/css'>    <style>        .yunghkio {            font-family:"Masterpiece Uni Sans",Yunghkio;        }        .myanmar3 {            font-family:"Masterpiece Uni Sans",Myanmar3;        }        .padauk {            font-family:"Masterpiece Uni Sans",Padauk;        }        .zawgyi {            font-family:Zawgyi-One;        }        .parabaik {            font-family:"Masterpiece Uni Sans",Parabaik;        }    </style></head><body>    <p class="yunghkio">Yunghkio မြန်မာစာ</p>    <p class="myanmar3">Myanmar 3 မြန်မာစာ</p>    <p class="padauk">Padauk မြန်မာစာ</p>    <p class="parabaik">Parabaik မြန်မာစာ</p>    <p class="zawgyi">ေနေကာင္းလား</p></body></html>

A tunga Code kitel mello a hih manin 1.6kb bek a pha ka file pan na download un.



Hih atung a File thuah na pi ong suak kei zenzen leh na Compose teh hi dan na zang in. 

  1. Go directly to "Posting" and then click on "Create".
  2. Click on "Edit Html" option.
  3. Copy and paste the following CSS style in Step.4.

    <span lang="MY" style="font-family:Zawgyi-One,ZawgyiOne,Zawgyi1,Verdana;font-size:small;font-weight:500;"> ...????????????... </span>

  1. Go back to "Compose" window and start typing in Myanmar. Replace ???????????? with any Myanmar word.

No comments:
Write comments