About Serie
Convert PSD To HTML
ဒီ Series မှာတော့ PSD design တစ်ခုကနေ HTML ကို ဘယ်လို convert လုပ်သွားမလဲဆိုတာကို တွေ့ရှိရမှာ ဖြစ်ပါတယ်။ ပုံမှန်အားဖြင့် Photoshop မှာပဲဆွဲဆွဲ ၊ illustrator မှာပဲဆွဲဆွဲ ၊ gimp မှာပဲ ဆွဲဆွဲ ဘယ်နေရာမှာ ဆွဲသည်ဖြစ်စေ HTML ဘယ်လိုပြောင်းလို့ရတယ်ဆိုတဲ့ concepts ကို သိရင်ရပါပြီ။ ဒီသင်ခန်းစာမှာတော့ HTML template တစ်ခုကို online ပေါ်မှာ တင်ပြီးတော့ ရောင်းလို့ရအောင်အထိ ဘယ်လို code တွေရေးသားရမလဲ ဆိုတာကို ရှင်းပြသွားမှာ ဖြစ်ပါတယ်။
Episodes
episodesUpdated
2022-09-21Level
Intermediate
About Current Episode
12
Toggle Mobile Menu
Desktop menu တွေ mobile menu တွေ လုပ်ပြီးတဲ့အချိန်မှာ mobile menu ကို ပုံမှန်အားဖြင့် design တွေမှာ ဖျောက်ထားတတ်ပါတယ်။ menu control ခလုတ်တစ်ခုကို နှိပ်လိုက်တော့မှ ပြတာမျိုးတွေ လုပ်ကြပါတယ်။ ကျွန်တော်တို့လည်း JavaScript ရဲ့ အကူအညီနဲ့ mobile menu ကို ဘယ်လိုဖော်တာ ဖျောက်တာ လုပ်သွားလဲဆိုတာကို တွေ့ရှိရမှာ ဖြစ်ပါတယ်။ 2022-09-21
7:45
1
Convert PSD TO HTML Introduction
Introduction အနေနဲ့ ဒီ series မှာ ပါမယ့် အကြောင်းအရာလေးတွေကို ရှင်းပြထားခြင်း ဖြစ်ပါတယ်။ series မှာ PSD ကနေ HTML ကို ပြောင်းတဲ့အချိန်မှာ ဘယ် framework အကူအညီမှမပါပဲ မိမိကိုယ်တိုင် ဘယ်လိုတည်ဆောက်သွားမလဲဆိုတာကို တွေ့ရှိရမှာ ဖြစ်ပါတယ်။ premium template တစ်ခု အနေအထားအထိ လုပ်ဆောင်ပြီး online မှာ ဘယ်လို ရောင်းချလို့ရတယ်ဆိုတဲ့ အကြောင်းပါ ရှင်းပြထားတာကို တွေ့ရှိရမှာ ဖြစ်ပါတယ်။ 2022-09-21
4:06
2
Export Photo From Photoshop
ဒီသင်ခန်းစာမှာ Photoshop PSD ဖိုင်ကနေ ဓာတ်ပုံလေးတွေကို ဘယ်လို export ထုတ်လို့ရတယ်ဆိုတဲ့ နည်းလမ်းလေးကို ရှင်းပြထားခြင်း ဖြစ်ပါတယ်။ Developer တစ်ယောက်အနေနဲ့ Photoshop ကို အသုံးပြုပြီးတော့ design ဆွဲတတ်ဖို့ မလိုပေမယ့် Photoshop ရဲ့ တစ်ချို့ အချက်လေးတွေကို အသုံးပြုတတ်ဖို့ တစ်ခါတစ်လေ လိုတတ်ပါတယ်။ 2022-09-26
7:16
3
Photoshop Selection Font Style and Guides Usages
Developer တစ်ယောက်အနေနဲ့ Photoshop tools တွေထဲကမှ ဓာတ်ပုံ၊ အတိုင်းအတာ၊ စာလုံး fonts အမျိုးအစား၊ font size ၊ font style ၊ font color စတဲ့ အခြေခံအချက်လေးတွေကို သိရှိဖို့လိုပါတယ်။ အဲ့လိုအခြေခံအချက်လေးတွေကို သိရင် Photoshop PSD ကနေ HTML ပြောင်းဖို့အတွက် လုံလောက်ပါပြီ။ 2022-09-26
9:26
4
Folder And File Structure
Project တစ်ခုကို စပြီးတော့ တည်ဆောက်တော့မယ်ဆိုရင် folder နဲ့ file structure လေးတွေက တော်တော်အရေးပါပါတယ်။ ဒါမှ မိမိလုပ်နေတဲ့ project ကြီးလာတာနဲ့အမျှ file တွေ၊ folder တွေကို ကောင်းကောင်းစီမံနိုင်မှာ ဖြစ်ပါတယ်။ တစ်ခါတစ်လေ framework တွေဘာတွေကို သုံးတယ်ဆိုရင် framework တွေက ဘယ်လိုသုံးသင့်လဲဆိုတဲ့ guidelines လေးတွေပေးပါတယ်။ တကယ်လို့ မိမိက company ၊ team တွေနဲ့ လုပ်တယ်ဆိုရင် သူတို့ချမှတ်ထားတဲ့ guideline လေးတွေနဲ့ ရေးရပါတယ်။ 2022-09-05
14:26
5
Setup HTML Frame
HTML project တွေ စတည်ဆောက်တဲ့အခါ CSS file တွေ၊ JavaScript file တွေထည့်ရတာတွေ၊ browser တွေအကုန်လုံးမှာ တူညီသော CSS result ကို ရရှိအောင် CSS reset ပြုလုပ်တာတွေကို HTML project တိုင်းမှာ အမြဲလိုလိုလုပ်ရပါတယ်။ ဒါလေးကို ဖြေရှင်းဖို့အတွက် HTML frame လေးကို တည်ဆောက်ထားခြင်း ဖြစ်ပါတယ်။ 2022-09-26
23:32
6
Website Frame
ဒီသင်ခန်းစာမှာတော့ PSD ကနေ HTML စပြောင်းတဲ့အခါ Design Section တစ်ခုချင်းစီရဲ့ website frame တည်ဆောက်ပုံကို ရှင်းပြသွားတာ ဖြစ်ပါတယ်။ Website frame ကို စပြီးတော့ လုပ်တဲ့အတွက် မမှားအောင် အသေအချာ တိုင်းပြီးတော့ လုပ်ဆောင်ဖို့ လိုအပ်ပါတယ်။ 2022-09-10
12:42
7
Adding Logo and Menu
ဒီသင်ခန်းစာမှာတော့ Logo နဲ့ Menu ကို design ထဲကအတိုင်းရအောင် လုပ်ယူတဲ့ နည်းလမ်းလေးတွေကို ပြသထားတာ ဖြစ်ပါတယ်။ ဘယ်ဘက်မှာ Logo ညာဘက်မှာ menu ထားတဲ့ ပုံစံကို လုပ်လို့ရတဲ့ နည်းလမ်းလေးတွေ အများကြီးရှိတဲ့အထဲက float ကို အသုံးပြုပြီးတော့ ဘယ်လိုထည့်လို့ရတယ်ဆိုတာကို ရှင်းပြထားခြင်း ဖြစ်ပါတယ်။ ဒါပေမယ့် ကျွန်တော်တို့ရဲ့ template မှာတော့ float ကို မသုံးပဲ flex နဲ့ ပဲ လုပ်ဆောင်သွားမှာ ဖြစ်ပါတယ်။ 2022-09-26
14:15
8
Logo And Menu Structure Setup
ဒီသင်ခန်းစာမှာတော့ Logo နဲ့ Menu section တွေကို Header section ထဲမှာ CSS flex property ကို အသုံးပြုပြီးတော့ စနစ်တကျလေး ဘယ်လိုထားမယ်ဆိုတာကို ရှင်းပြသွားတာ ဖြစ်ပါတယ်။ နောက်ပြီး website frame layout အတွက် CSS class လေးတွေကို common တစ်ခြား section design တွေမှာပါ လွယ်ကူစွာ ဘယ်လိုအသုံးပြုလို့ရတယ်ဆိုတာကို ရှင်းပြထားခြင်း ဖြစ်ပါတယ်။ 2022-09-21
19:37
9
Sub menu Structure
မိမိအနေနဲ့ PSD design တစ်ခုကနေ HTML ပြောင်းတဲ့အချိန်မှာ Sub menu က တစ်ချို့ designer တွေက ထည့်ပေးလိုက်ပြီးတော့ တစ်ချို့ designer တွေက ထည့်ဖို့ မေးတာလေးတွေရှိတတ် ပါတယ်။ တကယ်လို့ design ထဲမှာ မပါဘူးဆိုရင်တောင် နောက်ပိုင်းမှာ အသုံးဝင်အောင်အတွက် တစ်ခါတည်း sub menu ကို တည်ဆောက်တဲ့ အပိုင်းကို လုပ်ဆောင်သင့်ပါတယ်။ ဒီသင်ခန်းစာမှာ Sub menu ကို level 2 လောက်ထိ ဘယ်လိုလုပ်သွားလဲဆိုတာကို တွေ့ရှိရမှာ ဖြစ်ပါတယ်။ 2022-09-21
15:29
10
Mobile Menu Structure
အခုနောက်ပိုင်းမှာ website တစ်ခုရေးဆွဲရင် responsive website လုပ်ဆောင်ချက်က website တိုင်းလိုလိုမှာ ပါလေ့ရှိပါတယ်။ Design ဖိုင်မှာ desktop version တစ်ခုတည်းအတွက် ဆွဲပေးပေမယ့် မိမိက mobile တွေ tablet တွေအတွက်ပါ အဆင်ပြေအောင် PSD ကနေ HTML ပြောင်းတဲ့အခါ လုပ်ဆောင်ပေးဖို့ လိုအပ်ပါတယ်။ ဒီသင်ခန်းစာမှာတော့ desktop version menu ကို mobile menu ဖြစ်အောင် ဘယ်လိုပြောင်းလဲ လုပ်ဆောင်သွားမလဲဆိုတာကို တွေ့မြင်ရမှာ ဖြစ်ပါတယ်။ 2022-09-26
17:23
11
Navigation Code Clean
Design section တစ်ခုချင်းစီကို CSS ရေးသားတဲ့အခါ ရေးသားပြီးတိုင်း မိမိရေးထားတဲ့ CSS လေးတွေကို ပြန်ပြီးတော့ စစ်ဆေးဖို့လိုအပ်ပါတယ်။ တစ်ခါတစ်လေ ကျတော့ ရေးထားတဲ့ CSS တွေက ဒီ design section တစ်ခုတည်းတွက်မဟုတ်ပဲ နောက်ရေးမယ့် design section တွေအတွက်ပါ အဆင်ပြေအောင်လို့ common အနေနဲ့ ခွဲထုတ်သင့်တာကို ခွဲထုတ်ပြီး code တွေကို ပိုမိုရှင်းလင်းအောင် လုပ်ဖို့ လိုအပ်ပါတယ်။ 2022-09-21
24:04
12
Toggle Mobile Menu
Desktop menu တွေ mobile menu တွေ လုပ်ပြီးတဲ့အချိန်မှာ mobile menu ကို ပုံမှန်အားဖြင့် design တွေမှာ ဖျောက်ထားတတ်ပါတယ်။ menu control ခလုတ်တစ်ခုကို နှိပ်လိုက်တော့မှ ပြတာမျိုးတွေ လုပ်ကြပါတယ်။ ကျွန်တော်တို့လည်း JavaScript ရဲ့ အကူအညီနဲ့ mobile menu ကို ဘယ်လိုဖော်တာ ဖျောက်တာ လုပ်သွားလဲဆိုတာကို တွေ့ရှိရမှာ ဖြစ်ပါတယ်။ 2022-09-21
7:45
13
Crop Banner Slider Photo
ဒီသင်ခန်းစာမှာတော့ banner image ကို design ထဲမှာ image အနေနဲ့ ပြထားပေမယ် ကျွန်တော်တို့က slider အနေနဲ့ အသုံးပြုသွားမှာ ဖြစ်ပါတယ်။ အဲဒီတော့ Photoshop ထဲမှာ ဓါတ်ပုံတွေကို ဘယ်လိုဖြတ်ထုတ်သွားလဲဆိုတာကို တွေ့ရှိရမှာ ဖြစ်ပါတယ်။ ဓါတ်ပုံ size အကြီးတွေဖြစ်နေတဲ့ဟာတွေကိုပါ ဘယ်လို crop လုပ်သွားမယ်ဆိုတာကို ဖော်ပြထားခြင်း ဖြစ်ပါတယ်။ 2022-09-22
8:39
14
Banner Swiper Slider
jQuery library ကို မမှီခိုပဲအသုံးပြုနိင်မယ် swiperjs ကို အသုံးပြီးတော့ swiper slider ကို banner ထဲမှာ ဘယ်လိုတည်ဆောက်သွားမလဲဆိုတာကို တွေ့ရှိရမှာ ဖြစ်ပါတယ်။ swiperjs ကိုလည်း PSD မှာရှိတဲ့ ပုံစံမျိုးဖြစ်အောင် ဘယ်လိုလုပ်သွားမလဲဆိုတာကို တွေ့ရှိရမှာ ဖြစ်ပါတယ်။ 2022-09-22
15:14
15
About Us Section Structure
PSD design ထဲမှာပါတဲ့ about us section ကို HTML structure ဘယ်လိုဆောက်မလဲဆိုတာကို ရှင်းပြထားခြင်း ဖြစ်ပါတယ်။ HTML structure ကို အရင်တည်ဆောက်ပြီးမှ CSS ရေးသွားရမှာ ဖြစ်တဲ့အတွက် design အပေါ်အခြေခံပြီး HTML တည်ဆောက်နိုင်ဖို့ အရေးကြီးပါတယ်။ 2022-09-22
7:04
16
About Us Section Styling
About us design အတွက် HTML ကို တည်ဆောက်ပြီးတဲ့အချိန်မှာ CSS နဲ့ PSD မှာပါတဲ့ about us section design ရရှိအောင် ဘယ်လိုရေးသားသွားမလဲဆိုတာကို တွေ့ရှိရမှာ ဖြစ်ပါတယ်။ PSD design ထဲမှာ mobile view အတွက် မပါပေမယ့် ကျွန်တော်တို့အနေနဲ့ mobile တွေ tablet တွေ စတဲ့ devices အားလုံးမှာ အဆင်ပြေအောင် လုပ်ပေးလိုက်ဖို့ လိုအပ်ပါတယ်။ 2022-09-26
15:01
17
About Us Section CSS Cleaning
ဒီသင်ခန်းစာမှာတော့ About us section အတွက် ရေးထားတဲ့ CSS တွေထဲက ဘယ် CSS တွေက repeat ဖြစ်နေတယ်၊ အဲ့လို repeat ဖြစ်နေတဲ့ CSS တွေကို ထပ်ခါထပ်ခါအသုံးပြုနိုင်အောင် common CSS file ထဲကို ဘယ်လိုခွဲထုတ်မယ်ဆိုတဲ့ စတဲ့အချက်လေးတွေကို ရှင်းပြထားခြင်း ဖြစ်ပါတယ်။ 2022-09-26
15:04
18
Portfolio HTML Structure Setup
ဒီသင်ခန်းစာမှာတော့ PSD ထဲမှာပါတဲ့ portfolio design အတွက် HTML structure ဘယ်လိုတည်ဆောက်မလဲဆိုတာကို ရှင်းပြထားခြင်း ဖြစ်ပါတယ်။ 2022-09-22
9:28
19
Styling Portfolio Design
Column portfolio design ကို CSS flex property တွေကို အသုံးပြုပြီးတော့ ဘယ်လိုရရှိအောင် တည်ဆောက်သွားမလဲဆိုတာကို ရှင်းပြထားခြင်း ဖြစ်ပါတယ်။ 2022-09-26
10:20
20
Portfolio Responsive Design
ဒီသင်ခန်းစာမှာတော့ CSS flex property ကိုအသုံးပြုပြီးတော့ ရေးထားတဲ့ portfolio design ကို devices တွေအကုန်လုံးမှာ ကြည့်လို့အဆင်ပြေအောင် responsive ကို ဘယ်လိုလုပ်ဆောင်မလဲဆိုတာကို ရှင်းပြထားခြင်း ဖြစ်ပါတယ်။ 2022-09-26
9:04
21
Portfolio CSS Code Clean
ကျွန်တော်တို့ Portfolio design အတွက် CSS တွေအများကြီးရေးသားလိုက်ရပါတယ်။ အဲ့ဒီအထဲက တစ်ချို့ CSS property တွေဟာ ရှေ့ design တွေလုပ်ခဲ့တုန်းက ပါပြီးသား CSS property တွေလည်း ဖြစ်နိုင်ပါတယ်။ အဲ့ဒါကြောင့် ထပ်နေတဲ့ CSS property တွေကို CSS common file ထဲကို ရွေ့ဖို့လိုအပ်ရင် ရွေ့ရမှာ ဖြစ်ပါတယ်။ 2022-09-26
18:17
22
Testimonial HTML Structure
Testimonial design က PSD design အရဆိုရင် slide လေးတွေသွားတဲ့ carousel လိုပုံစံမျိုးဖြစ်နေပါတယ်။ အဲဒီတော့ ကျွန်တော်တို့အနေနဲ့ project ထဲမှာ သုံးပြီးသား swiperjs library ကိုအသုံးပြုပြီးတော့ carousel design လေးကို ဖန်တီးလုပ်ယူသွားမှာ ဖြစ်ပါတယ်။ 2022-09-22
11:09
23
Testimonial Styling
ဒီသင်ခန်းစာမှာတော့ testimonial design အတွက်ရေးထားတဲ့ HTML structure ကို PSD မှာပါတဲ့ Design အတိုင်း ရရှိအောင် လုပ်ဆောင်သွားတဲ့ နည်းလမ်းလေးတွေကို ရှင်းပြထားခြင်း ဖြစ်ပါတယ်။ 2022-09-23
14:13
24
Testimonial Swiper Slider
swiperjs ကနေ testimonial design အတွက် carousel လုပ်ဆောင်တာကို ဘယ်လိုလုပ်ဆောင်မလဲဆိုတာကို ရှင်းပြထားခြင်း ဖြစ်ပါတယ်။ တကယ့်လက်တွေ့မှာ swiperjs ကို အသုံးပြုပြီးတော့ website ထဲမှာရှိတဲ့ လိုအပ်တဲ့ နေရာလေးတွေမှာ မတူညီတဲ့ sliders လေးတွေဖန်တီးနိုင်အောင်အတွက် swiperjs မှာ လုပ်ဆောင်လို့ရတဲ့ options လေးတွေ ပါပြီးသား ဖြစ်ပါတယ်။ 2022-09-26
11:42
25
Testimonial Code Cleaning
Testimonial design အတွက် HTML တွေ CSS တွေရေးထားပြီးတဲ့အချိန်မှာ CSS ထဲမှာ ထပ်ခါထပ်ခါဖြစ်နေတဲ့ code တွေ ရှင်းလင်းအောင် လုပ်ဖို့လိုအပ်ပါတယ်။ အဲဒါကြောင့် design တစ်ခုပြီးတိုင်း code cleaning တွေ လုပ်ဆောင်ရတာ ဖြစ်ပါတယ်။ 2022-09-23
17:44
26
Contact Form Structure
ဒီသင်ခန်းစာကတော့ contact form design အတွက် HTML structure ကို ဘယ်လိုတည်ဆောက်သွားမလဲဆိုတာကို ရှင်းပြထားခြင်း ဖြစ်ပါတယ်။ 2022-09-23
5:46
27
Contact Form Styling
Contact form design အတွက် ရေးထားတဲ့ HTML structure ကို CSS နဲ့ Photoshop မှာပါတဲ့ design အတိုင်း ဘယ်လိုရအောင် လုပ်သွားမယ် ဆိုတာကို ရှင်းပြထားခြင်း ဖြစ်ပါတယ်။ 2022-09-23
16:26
28
Contact Form Code Cleaning
HTML နဲ့ CSS တွေနဲ့ ရေးသားထားတဲ့ contact form design ထဲက သုံးထားတဲ့ CSS တော်တော်များများက project ရဲ့ တစ်ခြား design တွေမှာ ပါပြီးသား ဖြစ်သွားတဲ့တွက် CSS property တော်တော်များများကို common class အနေနဲ့ ခေါ်သုံးလို့ရတာကို တွေ့ရှိရမှာ ဖြစ်ပါတယ်။ 2022-09-23
9:21
29
Footer HTML Structure
ဒီသင်ခန်းစာမှာတော့ footer design အတွက် HTML structure ကို ဘယ်လိုလုပ်သွားမလဲဆိုတာကို ရှင်းပြထားခြင်း ဖြစ်ပါတယ်။ footer design မှာ column သုံးခုပါတဲ့အထဲက footer column ၁ နဲ့ footer column ၂ HTML structure ရေးသားပုံဖြစ်ပါတယ်။ 2022-09-23
10:32
30
Styling Footer Box One And Footer Box Two
ဒီသင်ခန်းစာကတော့ Footer design ထဲက column ၁ နဲ့ column ၂ အတွက် CSS ရေးသားပုံဖြစ်ပါတယ်။ 2022-09-23
11:02
31
Footer Contact Box Styling
Footer design ထဲက contact box column အတွက် CSS ရေးသားပုံကို ရှင်းပြထားခြင်း ဖြစ်ပါတယ်။ ဒီသင်ခန်းစာမှာတော့ icon တွေအတွက် CSS sprite နည်းလမ်းကို အသုံးပြုထားတာကို တွေ့ရှိရမှာ ဖြစ်ပါတယ်။ 2022-09-23
13:26
32
Redesign Situation For Customer
တကယ့်လက်တွေ့မှာတော့ Customer ကို PSD design ပြလို့ customer က သဘောကျမှာ PSD ကနေ့ HTML ကို ပြောင်းလဲခြင်း ဖြစ်ပါတယ်။ ဒါပေမယ့် HTML ပြောင်းပြီးတဲ့အချိန်မှာ တစ်ချို့ customer တွေက design ကို ပြန်ပြင်ချင်တာတွေ၊ တစ်ချို့ဟာလေးတွေကို ပြောင်းချင်တာတွေ တစ်ခါတစ်လေ ဖြစ်တတ်ပါတယ်။ အဲ့လိုအနေအထားလေးတွေကို ဘယ်လို လုပ်ဆောင်သွားမလဲဆိုတာကို ရှင်းပြထားခြင်း ဖြစ်ပါတယ်။ 2022-09-26
8:35
33
Footer Section Code Cleaning
Footer section design အတွက် ရေးသားထားတဲ့ CSS တွေထဲက Common CSS မှာ အသုံးပြုထားတဲ့ CSS class လေးတွေနဲ့ အစားထိုးခြင်း ဖြစ်ပါတယ်။ ဒါမှ footer ထဲမှာ ရေးသားထားတဲ့ CSS code တွေက ပိုပြီးတော့ ရှင်းလင်းသွားမှာ ဖြစ်ပါတယ်။ 2022-09-23
15:22
34
Scroll Top Button
Website မှာ စာမျက်နှာတွေ အရမ်းရှည်နေတဲ့အချိန်မှာ scroll to top ခလုတ်လေးတစ်ခုထည့်လိုက်တာက website အသုံးပြုသူတွေအတွက် အရမ်းကို လွယ်ကူစေပါတယ်။ အဲဒါကြောင့် ကျွန်တော်တို့လည်း ယခု template လေးမှာ မိမိ စိတ်ကြိုက် scroll up ခလုတ်လေးတစ်ခုကို ဖန်တီးသွားမှာ ဖြစ်ပါတယ်။ 2022-09-26
16:06
35
Scroll To Button Toggle
ရှေ့သင်ခန်းစာတုန်းက ဖန်တီးထားတဲ့ Scroll to top ခလုတ်လေးကို JavaScript နဲ့ ခလုတ်ဖော်တာ ဖျောက်တာတွေ၊ scroll event နဲ့ စာမျက်နှာထိပ်သို့ ပိုတာတွေကို လုပ်ဆောင်သွားတာ တွေ့ရှိရမှာ ဖြစ်ပါတယ်။ 2022-09-26
10:25
36
Page Loading
website ကို browser ပေါ်မှာ လှမ်းခေါ်လိုက်တဲ့အချိန်မှာ website စာမျက်နှာ loading မပြီးသေးဘူးဆိုရင် loading လေးတစ်ခုကို ပြသင့်ပါတယ်။ ဒါမှ website လာကြည့်တဲ့ သူက loading ဖြစ်နေတယ်ဆိုတာကို သိရှိမှာ ဖြစ်ပါတယ်။ အဲ့လိုပဲ ကျွန်တော်တို့ လက်ရှိလုပ်နေတဲ့ template မှာလည်း loading လေးတစ်ခုကို ဘယ်လိုထည့်သွင်းသွားမလဲဆိုတာကို တွေ့ရှိရမှာ ဖြစ်ပါတယ်။ 2022-09-26
12:26
37
Meta Tags
Website တစ်ခုကို launch လုပ်တဲ့အချိန်မှာ search engine တွေဖြစ်ကြတဲ့ Google တို့ Yahoo တို့လို search engine တွေမှာ မိမိ website နဲ့သက်ဆိုင်တဲ့အချက်အလက်တွေကို ရှာလိုက်တဲ့အချိန်မှာ ပေါ်စေချင်တယ်ဆိုရင် HTML meta tags လေးတွေကို ထည့်ပေးဖို့လိုအပ်ပါတယ်။ ကျွန်တော်တို့ template မှာလည်း meta tags လေးတွေကို ဘယ်လိုထည့်သွားမလဲဆိုတာကို တွေ့ရှိရမှာ ဖြစ်ပါတယ်။ 2022-09-26
6:57
38
Customize Website Color
HTML template တစ်ခုကို premium template တစ်ခုအနေနဲ့ ရောင်းတော့မယ်ဆိုရင် မိမိ template ကို ဝယ်ယူမယ့် customer တွေအတွက် အရောင်းလေးတွေကို customize ဖြစ်အောင် လုပ်ပေးသင့်ပါတယ်။ ဒီသင်ခန်းစာမှာတော့ လက်ရှိ ကျွန်တော်တို့ website မှာ အသုံးပြုနေတဲ့ green အစိမ်းရောင်အစား တစ်ခြားအရောင်တစ်ခုခုကို ဘယ်လိုပြောင်းသွားမလဲဆိုတာကို တွေ့ရှိရမှာ ဖြစ်ပါတယ်။ 2022-09-26
8:59
39
Photo Blur
Premium HTML template တွေကို online ပေါ်မှာ ရောင်းတဲ့အခါ demo ပြထားတဲ့ ဓါတ်ပုံတွေ၊ ဗီဒီယိုဖိုင်တွေနဲ့ တစ်ခြားသော မိမိဖန်တီးထားတာ မဟုတ်တဲ့အရာတွေကို ရောင်းမယ့် template နဲ့ ထည့်ပေးလိုက်လို့မရပါ။ အဲ့ဒါကြောင့် မိမိသုံးထားတဲ့ ဖိုင်များကို သင့်တော်သလို ပြောင်းလဲဖို့ လိုအပ်ပါတယ်။ ဒီသင်ခန်းစာမှာတော့ unsplash က ယူသုံးထားတဲ့ ဓါတ်ပုံတွေကို blur ဖန်တီးပြီး premium template နဲ့ ထည့်ပေးလိုက်တာကို တွေ့ရမှာ ဖြစ်ပါတယ်။ 2022-09-26
7:54
40
Documentation For HTML Template
လက်ရှိလုပ်ထားတဲ့ template အတွက် ရောင်းတဲ့အခါပဲဖြစ်ဖြစ် တစ်ခြားတစ်ယောက်ကို source code တွေကို ပေးပို့တဲ့အခါပဲဖြစ်ဖြစ် အဆင်ပြေအောင်အတွက် documentation နဲ့ ပို့လိုက်ရင် ပိုကောင်းပါတယ်။ ဒါမှ လက်ခံရရှိတဲ့သူက ဘယ်အဆင့်ပြီးတော့ ဘယ်အဆင့်ကို သွားရမယ်ဆိုတာကို သိမှာဖြစ်ပါတယ်။ documentation တစ်ခုကို ဖန်တီးတဲ့အခါ PDF နဲ့ပဲလုပ်လုပ်၊ word ဖိုင်နဲ့ပဲလုပ်လုပ် တစ်ဖက်လူ ဖတ်လို့အဆင်ပြေမယ့် format တစ်ခုနဲ့ ပိုလိုက်ရင် ရပါပြီ။ ဒီသင်ခန်းစာမှာတော့ documentation အတွက် ရိုးရှင်းတဲ့ HTML template တစ်ခုကို တည်ဆောက်သွားမှာ ဖြစ်ပါတယ်။ 2022-09-26
11:06
41
How to write documentation for your template
ဒီသင်ခန်းစာမှာတော့ ကျွန်တော်တို့ရေးထားတဲ့ HTML design အတွက် documentation ဘယ်လိုရေးသားရမယ်ဆိုတာကို ရှင်းပြထားခြင်း ဖြစ်ပါတယ်။ 2022-09-26
8:07
42
Launch HTML Template On Netlify
Website တစ်ခုကို online ပေါ်မှာ launch လုပ်တဲ့အချိန်မှာ မိမိ website ကို ဘယ် server မှာ ထားမလဲဆိုတာ မေးစရာရှိပါတယ်။ တစ်ချို့တွေက VPS (virtual private server) ပေါ်မှာထားပါတယ်၊ တစ်ချို့တွေကကျတော့ share hosting ပေါ်မှာထားပါတယ်။ မိမိသုံးတဲ့ server အပေါ်မူတည်ပြီး အားသာချက်၊ အားနည်းချက်လေးတွေရှိနိုင်ပါတယ်။ ကျွန်တော်တို့ကတော့ လက်ရှိ template ကို netlify.com ပေါ်မှာ တင်ထားမှာဖြစ်ပါတယ်။ အဲဒီတော့ ဒီသင်ခန်းစာမှာ HTML template တစ်ခုကို netlify ပေါ် ဘယ်လိုတင်မလဲဆိုတာကို တွေရမှာ ဖြစ်ပါတယ်။ 2022-09-26
6:05
43
Sell Your HTML Template
ဒီသင်ခန်းစာမှာတော့ ကျွန်တော်တို့ရေးသားထားတဲ့ template ကို creativemarket.com မှာ တင်ပြီးတော့ ရောင်းမယ့်အပိုင်းကို ရှင်းပြထားခြင်း ဖြစ်ပါတယ်။ တကယ့်လက်တွေ့မှာ creativemarket.com တစ်ခုတည်းမဟုတ်ပါဘူး တစ်ခြား market တွေလည်း တင်ပြီး ရောင်းချနိုင်ပါသေးတယ်။ 2022-09-26
10:15