Transcript
Panimula
Halina’t suriin ang Site Editor, na nagbibigay-daan sa iyo na i-disenyo ang lahat ng iyong site gamit ang mga block, mula sa header hanggang sa footer at lahat ng nasa pagitan nito. Pumunta tayo sa Appearance at i-click ang Editor. Bubuksan nito ang Site Editor. Sa kaliwa, naroon ang site view sidebar, at ang kapaki-pakinabang na tool na ito ay nagbibigay-daan sa iyong tuklasin ang mga pangunahing bahagi ng iyong site, kabilang ang navigation, styles, pages, templates, at patterns. Layunin ng tutorial na ito na magkaroon ng malalim na pag-unawa sa mga elementong ito.
Navigation
Magsimula tayo sa itaas, sa navigation. Dito, mabilis mong makikita at mababago ang lahat ng iyong menu. Ito ang iyong command center para sa pamamahala ng menu. Maaari kang gumawa ng simpleng pag-edit nang direkta, tulad ng pag-reorder. Kapag nag-click ka sa tatlong patayong tuldok sa tabi ng pangalan ng item sa menu, maaari mong palitan ang pangalan, i-duplicate, at burahin ang item kung kinakailangan. Kung bukas sa editing mode, maaari kang gumawa ng ilang pagbabago nang walang istorbo. At ang mga update ay magsi-sync sa buong site mo. Maaari kang magdagdag ng mga bagong pahina o iba pang item sa menu kapag nag-click ka sa plus icon. Mapapansin mo na naka-lock ang Navigation block sa lugar na ito. Kung gusto mong i-style ang iyong navigation menu, kailangan mong buksan ang isang template o ang template part kung saan ito bahagi.
Styles
Susunod, pag-usapan natin ang mga style. Kapag pinili mo ang Styles, makakapag-browse ka sa iba’t ibang kumbinasyon ng estilo na kasama ng iyong tema. Kapag nag-click ka sa Edit Styles, maaari kang mag-browse ng iyong mga estilo mula rito at pagkatapos ay baguhin ang typography, kulay, at layout ng iyong site. Tingnan natin kung paano ito gumagana. Kapag nag-click ka sa Typography, maaari mong pamahalaan ang mga setting ng typography para sa teksto, mga link, mga heading, mga caption, at mga button. Isang kahanga-hangang bagong feature ay mayroon ka na ring access sa isang font library. Sa ibaba ng Fonts, makikita natin ang mga font na idinagdag sa ating tema. Ngunit kapag nag-click tayo sa Manage Fonts, maaari tayong mag-install, mag-alis, at mag-activate ng mga lokal at Google font sa buong site mo gamit ang anumang block theme. Kapag nag-click ka sa Install Fonts, maaari mong i-install ang anumang Google font sa iyong website at i-click ang Upload kung gusto mong mag-upload ng font mula sa iyong computer. Siguraduhin na mayroon kang karapatang gamitin ang anumang font na iyong ia-upload. Sa ibaba ng Typography, makikita natin ang Colors. Dito, maaari mo ring baguhin ang mga kulay para sa iba’t ibang global na elemento sa iyong site. Kapag pumunta tayo sa Layout, mapapansin natin na mayroon ka ring kontrol sa mga elemento tulad ng padding at block spacing.
Style Book
Kung titingnan mo pa sa ibaba, maaari mong i-customize ang hitsura ng mga partikular na block para sa iyong buong site. Para makita kung paano magbabago ang mga block na ito kung i-e-edit mo ang mga ito, pumunta sa Style Book ng iyong site. Mapapansin mo na may maliit na mata sa itaas. Ang Style Book ay nagbibigay-daan sa isang user na i-preview ang bawat block na maaaring ipasok sa iyong site. Nagbibigay ito sa iyo ng mabilis na preview kung paano makakaapekto ang mga global style sa anumang block na ipinapakita nang hindi ipinapasok ng user ang mga block na iyon sa isang template. Mahalaga ring tandaan na ang estilo ng isang block ay maaaring i-adjust sa loob ng Style Book. I-update natin ang Buttons block, halimbawa, sa pamamagitan ng pagbabago ng kulay ng background at ang letter case sa upper case. Kung gusto mo ang nakikita mo, maaari mong i-click ang Save. Pakitandaan din na ang pagbabago ng isang indibidwal na block sa iyong Style Book ay mas uunahin kaysa sa mga global style na iyong itinakda.
Style Revisions
Habang nandito tayo, kailangan din nating pag-usapan ang style revisions. Sige at i-click ang Style Revisions sa tabi ng icon ng Style Book. Bubuksan ang style revisions kapag nag-e-edit ka ng template sa Style Book. Nagdaragdag ang feature ng style revisions ng visual na paraan upang mag-browse ng mga pagbabago sa iyong mga style sa paglipas ng panahon, at madali mong maibabalik sa nakaraang stage kung makahanap ka ng style na mas gusto mo o kung gusto mong bumalik sa nakaraang bersyon. Kailangan mo lamang piliin ang bersyon at pagkatapos ay i-click ang Apply. Sa halimbawang ito, nag-e-edit ako ng template at susundin ko ang parehong proseso. Bubuksan ko ang style revisions, pipili ng nakaraang style, at pagkatapos ay i-click ang Apply upang bumalik. Kapag nag-click ka sa tatlong patayong tuldok sa tabi ng mga style, maaari mong i-reset ang mga style at magdagdag ng karagdagang CSS.
Pages
Sa ibaba ng Styles, maaari tayong pumunta sa Pages upang lumikha at mag-publish ng mga pahina. Upang magdagdag ng bagong pahina, i-click ang plus icon sa tabi ng mga pahina at gumawa ng draft. Ngunit maaari ka rin, siyempre, lumikha ng bagong pahina kapag nasa iyong Dashboard o WP Admin ka. Susunod, buksan natin ang isa sa ating mga umiiral na pahina, ang aking About Page. Kapag nagbukas ng pahina, mahalagang tandaan na magdagdag ng nilalaman sa Content block. Sa madaling salita, ang Content block ang bahay o ang lalagyan para sa lahat ng iyong nilalaman. Ang pangalawang bagay na dapat tandaan ay hindi mo maaaring i-customize ang iyong header at footer kapag nag-e-edit ng pahina. Lahat iyon ay bahagi ng pamamahala ng mga template. Kung mag-click ka sa header, makakakuha ka ng mensahe na nagsasabing, ‘Edit your template to edit this block.’ Kung gusto mong baguhin ang template na itinalaga sa pahinang ito, maaari mong i-click ang Edit Template. Dadalhin ka nito sa template ng iyong pahina sa halimbawang ito. Dito, maaari mong baguhin ang iyong header at ang iyong footer. Hindi ka makakapagdagdag ng nilalaman sa isang template. Ang nilalaman, siyempre, ay idinagdag sa mga post at pahina. Ang Content block ay simpleng placeholder lamang sa kontekstong ito.
Templates
Dadalhin tayo nito sa ating susunod na paksa, ang mga template. Ang mga template ay nagbibigay ng istraktura para sa kung paano ipinapakita ang iyong nilalaman. Kapag pinili mo ang mga template, mapapansin mo ang isang hanay ng mga template na kasama ng iyong tema, mga built-in na template. Halimbawa, ang page template na nagpapakita ng isang pahina, ang index template na isang fallback template, o ang single post template na nagpapakita ng layout ng mga single post. At sa pinakababa, makikita natin ang anumang custom na template. Kapag nag-click ka sa plus icon sa tabi ng mga template, maaari kang magdagdag ng iba’t ibang bagong template, kahit isang custom na template na maaaring ilapat sa anumang post o pahina. Buksan natin ang page template upang mas maunawaan kung paano gumagana ang isang template. Nagbibigay ng istraktura ang isang template. Karaniwang kasama sa isang template ang isang header template part at isang footer template part.
Kinukuha ng Post Content block ang nilalaman mula sa pahina o post na itinalaga sa template. Kaya, ang isang template ay ginagamit lamang upang baguhin ang layout o disenyo ng pahina, lalo na ang header, footer, at maging ang sidebar. Samakatuwid, malinaw na pinaghihiwalay ng Site Editor ang pag-edit ng template at ng pahina. Maaari mong baguhin ang iyong header at footer sa loob ng template. Isa sa mga opsyon na mayroon ka rin ay i-click ang tatlong patayong tuldok at piliin ang Replace Header. Pagkatapos, maaari mong palitan ang iyong kasalukuyang header ng isa sa iyong mga umiiral na header template part o header pattern na kasama ng iyong tema. Isa pang opsyon na mayroon ka ay piliin ang iyong header at pagkatapos ay i-click ang Edit. Papayagan ka nitong baguhin ang iyong header o footer sa loob ng template editing mode nang walang anumang iba pang istorbo.
Pagtatalaga ng isang template
Upang magtalaga ng bagong template sa isang pahina o post, buksan ang nauugnay na nilalaman, sa kasong ito, ang aking About Page, at pagkatapos ay buksan ang mga setting ng sidebar sa kanan. Sa tabi ng Template, i-click ang pangalan ng template, piliin ang Swap Template, at pagkatapos ay maaari kang pumili ng custom na template na itatalaga sa iyong pahina o post.
Pamamahala ng mga template
Mahalaga ring banggitin na kapag nag-click ka sa Manage all templates at pagkatapos ay pinili ang Bulk Edit, maaari mong tuklasin at i-filter ang iyong mga template sa pamamagitan ng table o grid view. At kapag pinili mo ang Bulk Edit muli, mayroong higit pang mga opsyon sa pag-filter. Pakitandaan na maaari mong tuklasin at i-filter ang mga pahina at template part sa eksaktong parehong paraan.
Patterns
Panghuli, pag-usapan natin ang mga pattern. Sa itaas, makikita mo ang lahat ng magagamit na pattern. Kapag pinili mo ang My Patterns, maaari kang lumikha at mamahala ng sarili mong mga custom na synced at non-synced na pattern. Sa ibaba ng My Patterns, makikita natin ang lahat ng ating custom na pattern at mga pattern na kasama ng ating tema sa kanilang mga nauugnay na kategorya. Sa ibaba ng Template Parts, maaari rin tayong lumikha at mamahala ng ating header, footer, at general template parts. Ang mga template part ay mahalagang patterns. Ang mga ito ay synced reusable na bahagi na maaaring gamitin sa buong site mo.
Custom patterns
Magsimula tayo sa My Patterns. Upang lumikha ng iyong custom na pattern, i-click ang Inserter sa tabi ng mga pattern at pagkatapos ay piliin ang Create Pattern. Matapos itong pangalanan, maaari mong piliin na idagdag ito sa nauugnay na kategorya at pagkatapos ay magpasya na i-sync o hindi i-sync ang iyong pattern. Ang isang synced pattern ay magsi-sync sa buong site mo, ibig sabihin, kung babaguhin mo ang iyong pattern sa isang lugar, mag-a-update ito saanman ito ginagamit. Maaari mo ring i-off ito kung mas gusto mo ang isang non-synced pattern. Ang mga non-synced pattern ay ordinaryong pattern lamang na maaaring i-edit nang hiwalay. Kapag bumalik ka sa iyong custom pattern area, mapapansin mo na ang mga synced pattern ay may lilang icon at ang mga non-synced pattern ay wala. Susunod, mapapansin mo na ang mga pattern na kasama ng iyong tema ay naka-lock, at hindi mo ito maaaring i-edit. Ngunit kapag nag-click ka sa tatlong patayong tuldok sa ibaba ng isang pattern, maaari mo itong kopyahin sa iyong My Patterns area.
Template Parts
Sa ibaba, maaari tayong lumikha at mamahala ng ating header, footer, at general template parts. Mayroon kang dalawang opsyon dito. Maaari kang lumikha ng mga custom na header at footer o i-customize ang mga pattern ng template part na kasama ng iyong tema. Upang lumikha ng sarili mong template part, i-click ang plus icon sa itaas sa tabi ng mga pattern at piliin ang Create a template part. Kapag nagdagdag ka ng bagong template part, maaari kang pumili sa pagitan ng general header at footer template parts. Ang mga general template part ay hindi nakatali sa anumang partikular na lugar, kaya tandaan na bigyan sila ng naglalarawang pangalan. Kapag nagbukas ka ng isang template part mula rito, magagawa mong baguhin at i-edit ang iyong template part sa template editing mode nang walang anumang istorbo. Maaari mo ring buksan ang nauugnay na template at, sa kasong ito, ang aking custom na template, at pagkatapos ay maaari mong baguhin ang iyong header o footer template part mula sa loob ng template. Tulad ng ipinakita kanina, madali mong mapapalitan ang isa sa iyong mga header o footer ng isang pattern o isang umiiral na template part mula sa library.
Command Palette
Para sa pagtatapos, gusto ko ring i-highlight ang isang nakakatulong na feature na tinatawag na Command Palette na makakatipid sa iyo ng maraming oras at tutulong sa iyong mas epektibong gumalaw sa iyong Site Editor. Ang command palette ay nagbibigay-daan sa iyong kumpletuhin ang mga gawain at mag-navigate sa loob ng Site Editor nang mabilis. Maaari kang, halimbawa, mag-type ng ‘New’ upang lumikha ng isang pahina o template o ang pangalan lamang ng lugar kung saan mo gustong pumunta. Halimbawa, ‘pattern’ para pamahalaan ang lahat ng aking pattern. Maa-access mo ang command palette gamit ang shortcut command+k sa Mac o control+k sa Windows. Makikita mo rin ito sa site view sidebar sa pamamagitan ng pag-click sa search icon. O maaari mo lamang i-click ang title bar.
Konklusyon
Ito ang nagtatapos sa aming maikling pangkalahatang-ideya kung ano ang maaari mong gawin gamit ang Site Editor.
Practical
Pumunta sa WordPress Playground at kumpletuhin ang mga sumusunod na gawain upang subukan ang iyong kaalaman.
- Pumili ng ibang kombinasyon ng estilo na kasama ng iyong tema.
- Magdagdag ng Google Font sa iyong library sa ibaba ng Typography.
- Magtalaga ng custom na template sa Sample page, tulad ng Page with Sidebar. Maaari mo itong gawin kapag nagbukas ka ng isang pahina mula sa loob ng dashboard o ng Site Editor.