Page Builder Sandwich ကို အသုံးပြုနည်း

ရေးသားသူ –

တွင်

, ,

Page Builder Sandwich ကို အသုံးပြုနည်း

Page Builder Sandwich သည် သာမန် page builder များနှင့် မတူဘဲ ရှုပ်ထွေးမှုမရှိဘဲ အသုံးပြုရ ရိုးရှင်းလွယ်ကူပါသည်။

အကြမ်းဖျင်းလေ့လာရန် အောက်ပါဗီဒီယိုကို ကြည့်ရှုနိုင်ပါသည်။

Editor သည် မည်သည့်နေရာတွင် ရှိသနည်း။

ပထမဆုံးအနေဖြင့် စာမျက်နှာ (page)၊ ပို့စ် (post) သို့မဟုတ် CPT အသစ်တစ်ခုကို ဖန်တီးပါ။ ထို့နောက် သင်၏ ပို့စ်အသစ် သို့မဟုတ် ရှိပြီးသား ပို့စ်တစ်ခုခုကို frontend တွင် ဝင်ရောက်ကြည့်ရှုပါ။ PBS သည် ၁၀၀% frontend ဖြစ်သောကြောင့် သင်သည် backend တွင် ဝင်ရောက်ပြင်ဆင်နေစရာ မလိုပါ။

သင့်စာမျက်နှာ၏ ထိပ်ပိုင်း (သင်၏ admin bar ပေါ်တွင်) “Page Builder Sandwich” ခလုတ်တစ်ခု ရှိနေသင့်ပြီး တည်းဖြတ်မှုစတင်ရန် ၎င်းကို နှိပ်ပါ။ ထိပ်ပိုင်းမှ စာသားဖော်မတ်လုပ်သည့် နေရာ (text formatting area) ပေါ်လာပြီး ဘေးဘက်မှ အစိတ်အပိုင်းများ ထည့်သွင်းသည့် panel (add elements panel) ပေါ်လာသည်ကို သင်တွေ့ရပါမည်။ သင်၏ theme ရှိ အကြောင်းအရာဧရိယာ (content area) သည် ယခုအခါ သင်၏ editor ဖြစ်လာပါပြီ။

PBS ဖြင့် စာမျက်နှာတစ်ခုချင်းစီကိုသာ တည်းဖြတ်နိုင်ပါသည်။ ဘလော့ဂ်ပို့စ်များ စာရင်း သို့မဟုတ် 404 စာမျက်နှာကဲ့သို့သော သင့် theme မှ ဖန်တီးထားသည့် အရာများကို တည်းဖြတ်၍ မရပါ။ ပို့စ်များ၊ စာမျက်နှာများနှင့် စိတ်ကြိုက်ပို့စ်အမျိုးအစားများ (custom post types) ကို တည်းဖြတ်နိုင်ပါသည်။

သင့်အကြောင်းအရာကို တည်းဖြတ်ခြင်း

အခု အမိုက်စားအပိုင်း ရောက်လာပါပြီ.. သင် frontend သို့ ရောက်ရှိပြီး editor အတွင်းသို့ ရောက်သွားသည်နှင့် သင့်အကြောင်းအရာအတွင်းရှိ မည်သည့်စာသားကိုမဆို နှိပ်ပါ သို့မဟုတ် သင့် content area အတွင်း နှိပ်ပြီး စာစရိုက်ပါတော့။ အခြား page builder များနှင့် မတူဘဲ PBS သည် popup dialog box များကို ဖြတ်သန်းစရာမလိုဘဲ အကြောင်းအရာများကို တိုက်ရိုက်တည်းဖြတ်နိုင်စေပါသည်။

သင့်အကြောင်းအရာကို ပုံစံချခြင်း / အရာများကို လှပအောင် ပြုလုပ်ခြင်း

dcb1615380 file 9OtagMFi2c

တည်းဖြတ်နေစဉ် ထိပ်ပိုင်းရှိ ဧရိယာကို Text Formatting Bar ဟုခေါ်သည်။ ဤဘားတွင် အရောင်များ၊ စာလုံးမည်း၊ စာလုံးစောင်း၊ နေရာချထားမှု၊ လင့်ခ်များထည့်ခြင်း၊ သင်္ကေတအမှတ်အသားများ (bullets) နှင့် အခြားအရာများကဲ့သို့ စာသားများကို ပုံစံချရန် သင်အသုံးပြုမည့် ဖော်မတ်လုပ်သည့် ကိရိယာအားလုံး ပါဝင်သည်။ ကိရိယာတစ်ခုချင်းစီက ဘာလုပ်ဆောင်ပေးသည်ကို သိရှိရန် ခလုတ်တစ်ခုချင်းစီပေါ်တွင် mouse တင်ကြည့်ပါ။

အစိတ်အပိုင်းများ ထည့်သွင်းခြင်း

ecfd309bb2 file yDqiNEv73s

Add Element Panel ကို ပြသရန် မျက်နှာပြင်၏ ဘယ်ဘက်အပေါ်ရှိ Add Elements ခလုတ်ပေါ်တွင် mouse ကို တင်ထားပါ။ ၎င်းကို ပေါ်လာစေရန် သင့် mouse ကို မျက်နှာပြင်၏ ဘယ်ဘက်အခြမ်းသို့ ရွှေ့လိုက်ရုံလည်း ပြုလုပ်နိုင်ပါသည်။

မည်သည့်အစိတ်အပိုင်းကိုမဆို ထည့်သွင်းရန် တစ်ခုခုပေါ်တွင် mouse ဖြင့် ဖိထားပြီး သင့် content area ထဲသို့ ဆွဲယူ (drag) ပါ။ ထိုအစိတ်အပိုင်း ရောက်ရှိမည့် နေရာသည် အရောင်ဖြင့် အထူးပြုပြသသွားပါမည်။ အစိတ်အပိုင်းကို နေရာချရန် mouse ခလုတ်ကို လွှတ်လိုက်ပါ။

အစိတ်အပိုင်းများကို ပုံစံချခြင်းနှင့် ပြုပြင်မွမ်းမံခြင်း

သင့်အကြောင်းအရာထဲရှိ မည်သည့်အစိတ်အပိုင်းပေါ်တွင်မဆို mouse တင်လိုက်ပါက ၎င်းတို့အပေါ်တွင် အကွက်ဘောင်များနှင့် toolbar များ ပေါ်လာပါမည်။

0046713cb7 file YU6nUCc7jYအစိတ်အပိုင်းများအကြား ခြားနားချက် (margins) များကို တိုးမြှင့်ရန်/လျှော့ချရန် ဘောင်အစွန်းများပေါ်တွင် mouse ကို တင်ထားနိုင်ပါသည်။

အစိတ်အပိုင်းပေါ်တွင် အမြန်လုပ်ဆောင်ချက်များ လုပ်ဆောင်ရန် toolbar ပေါ်ရှိ ခလုတ်တစ်ခုကိုလည်း နှိပ်နိုင်ပါသည်။ Toolbar ပေါ်ရှိ ဂီယာ အိုင်ကွန်ကို နှိပ်ပါက ရွေးချယ်စရာများစွာ ပါဝင်သော Properties Inspector ပေါ်လာပါမည်။

5c220b4ac9 file Odem5RLPok

Properties Inspector

3e7e48b754 file INy1v5z9Oz

Properties inspector သည် သင့်အစိတ်အပိုင်းများ၏ ပုံပန်းသဏ္ဌာန်အပေါ် ပိုမိုထိန်းချုပ်နိုင်စေပါသည်။ အရိပ်များ၊ animation များ၊ မြေပုံအရောင်ပြောင်းလဲခြင်း၊ border radius နှင့် အခြားအရာများစွာကို ထည့်သွင်းနိုင်ပါသည်။

သင်သည် အစိတ်အပိုင်း၏ မူလအဆင့်များ (parents of element) ၏ properties များကိုလည်း ဝင်ရောက်ပြင်ဆင်နိုင်ပါသည်။ ဥပမာအားဖြင့်၊ သင်သည် ပုံတစ်ပုံကို column တစ်ခုအတွင်း ထည့်သွင်းပြီး properties inspector ကို ဖွင့်ပါက ပုံ၏ properties များ၊ ၎င်းပါဝင်သော column နှင့် ထို column ပါဝင်သော row ၏ properties များကို ဝင်ရောက်ပြင်ဆင်နိုင်ပါသည်။

Properties inspector တွင် မတူညီသော အစိတ်အပိုင်းများအတွက် မတူညီသော ဆက်တင်များစွာ ပါဝင်သောကြောင့် အားလုံးကို သေချာစွာ စစ်ဆေးကြည့်ရှုပါ။

Shortcodes များကို အသုံးပြုခြင်း

Page Builder Sandwich သည် frontend တွင် တကယ့် shortcodes များကို ပြသပေးပြီး ၎င်းတို့ကို လွယ်ကူစွာလည်း တည်းဖြတ်နိုင်ပါသည်!

edee730340 file TqfWB9yv3y

အကယ်၍ သင်သည် shortcodes များကို အလွတ်မှတ်မိပါက သင့်အကြောင်းအရာထဲတွင် တိုက်ရိုက်ရိုက်ထည့်ခြင်းဖြင့် shortcodes များကို ထည့်သွင်းနိုင်ပါသည်။ သို့သော် အားလုံးကို အလွတ်မမှတ်မိပါကလည်း (မည်သူက အလွတ်မှတ်ထားပါမည်နည်း။) inspector သည် သင့်ဆိုဒ်တွင် ရရှိနိုင်သော shortcodes အားလုံးကို စာရင်းပြုစုပေးထားပါသည်။ Inspector မှ Shortcode ခလုတ်ကို သင့် content area ထဲသို့ ဆွဲယူပြီး သင်ထည့်သွင်းလိုသည့်အရာကို ရှာကာ ၎င်းကို ထည့်သွင်းရန် နှိပ်ပါ။

Shortcodes များသည် frontend တွင် တကယ့်အကြောင်းအရာများအဖြစ် ပေါ်လာမည်ဖြစ်ပြီး၊ ၎င်းတို့ကို တည်းဖြတ်ရန်အတွက် ၎င်းကို ရွေးချယ်ကာ inspector တွင် ၎င်းတို့၏ attributes များကို စစ်ဆေးနိုင်ပါသည်။ သို့မဟုတ် ပိုမိုထိန်းချုပ်လိုပါက မူရင်းပုံစံအတိုင်း တည်းဖြတ်ရန် shortcode ပေါ်တွင် နှစ်ချက်နှိပ် (double click) နိုင်ပါသည်။ သင်၏ တည်းဖြတ်မှုများ ပြုလုပ်ပြီးနောက် ပြောင်းလဲမှုများကို ထင်ဟပ်စေရန် သင်၏ shortcode သည် update ဖြစ်သွားပါမည်။

သင့်အကြောင်းအရာများကို ပြန်လည်စီစဉ်ခြင်း

PBS ဖြင့် သင်သည် မည်သည့်အရာကိုမဆို နှိပ်ပြီးဆွဲယူကာ မည်သည့်နေရာသို့မဆို ရွှေ့ပြောင်းနိုင်ပါသည်။ တစ်ခုခုကို ဆွဲယူသည့်အခါ စာမျက်နှာရှိ အခြားအစိတ်အပိုင်းတစ်ခုခုပေါ်သို့ ရွှေ့ပါ၊ ၎င်းတို့ကို အခြားအကြောင်းအရာတစ်ခုခု၏ အပေါ် သို့မဟုတ် အောက်သို့ ရွှေ့နိုင်ပါသည်။

သင့်လုပ်ဆောင်ချက်များကို သိမ်းဆည်းခြင်း

ae0cf6f413 file

သင့်ဒီဇိုင်းကို စိတ်ကျေနပ်မှုရှိပါက သင့်စာမျက်နှာ၏ ဘယ်ဘက်အပေါ်ရှိ save ခလုတ်ကို နှိပ်လိုက်ရုံပါပဲ။ ဒါပါပဲ!