บทนำสู่ WordPress บล็อกธีม

ส่วนประกอบที่ประกอบเป็นธีม WordPress ทั่วไปไม่ได้เปลี่ยนแปลงไปมากนักในช่วงหลายปีที่ผ่านมา มากเสียจน Matt Mullenweg ผู้ร่วมก่อตั้งโครงการพูดเหน็บว่าธีม Kubrick แบบเก่า (เปิดตัวในปี 2005) ยังคงใช้งานได้กับระบบจัดการเนื้อหาเวอร์ชันทันสมัย

แน่นอนว่าผู้พัฒนาธีมได้ติดตั้งส่วนเพิ่มเติมของตนเอง เราได้เห็นทุกอย่างตั้งแต่การตั้งค่า UI ที่ซับซ้อนไปจนถึงเครื่องมือสร้างเพจที่ผสานรวม แต่แก่นแท้ของพวกมัน ธีมต่างๆ ยังคงรักษาโครงสร้างที่สม่ำเสมอ นั่นคือจนกระทั่งมีการแนะนำธีมบล็อก

ธีมที่ถูกบล็อกถูกกำหนดให้เป็นอนาคตของ WordPress สิ่งเหล่านี้จะเปลี่ยนวิธีที่เราสร้างและดูแลเว็บไซต์ นอกจากนี้ ยังผสานรวมเข้ากับตัวแก้ไขบล็อกของ Gutenberg ได้แนบแน่นกว่าตัวแก้ไขแบบ "คลาสสิก"

สงสัยว่าเอะอะทั้งหมดเกี่ยวกับอะไร? วันนี้ เราจะมาเล่าให้คุณฟังเกี่ยวกับพื้นฐานของบล็อกธีม WordPress ระหว่างทาง เราจะสำรวจว่าพวกเขาเปรียบเทียบและแตกต่างกับธีมดั้งเดิมอย่างไร มาเริ่มกันเลย!

ทำไมต้องบล็อกธีม?

ในช่วงสองสามปีแรกของการมีอยู่ เครื่องมือแก้ไขบล็อกเป็นวิธีหลักในการจัดรูปแบบและสร้างเนื้อหา เมื่อรวมเข้ากับธีมคลาสสิกแล้ว นั่นหมายความว่าคุณสามารถสร้างหน้าและโพสต์ได้ตามที่คุณต้องการ

เมื่อพูดถึงการเปลี่ยนแปลงที่ส่งผลต่อธีมทั้งหมด WordPress Customizer ยังคงเป็นแหล่งข้อมูล เครื่องมือนี้ให้สิทธิ์เข้าถึงการออกแบบและการตั้งค่าเลย์เอาต์ที่ผู้เขียนธีมเปิดให้ใช้งาน หากไม่มีอยู่ใน Customizer คุณอาจต้องขุดลงไปในโค้ด

อย่างไรก็ตาม หลักการสำคัญประการหนึ่งของเครื่องมือแก้ไขบล็อกคือการสร้างอินเทอร์เฟซที่เป็นหนึ่งเดียวภายในแดชบอร์ด WordPress เราได้เห็นสิ่งนี้เกิดขึ้นแล้วกับหน้าจอวิดเจ็ตที่ย้ายไปยัง UI แบบบล็อก เครื่องมือปรับแต่งไม่พอดีกับแม่พิมพ์นี้

การแนะนำ Full Site Editing (FSE) เป็นขั้นตอนต่อไปในกระบวนการนี้ เป็นมากกว่าแค่การจัดรูปแบบเพจและโพสต์ของเรา ตอนนี้ ทุกแง่มุมของการออกแบบธีม (ส่วนหัว ส่วนท้าย เทมเพลตหน้า ฯลฯ) สามารถจัดการได้โดยตรงใน WordPress

ธีมที่ถูกบล็อกทำหน้าที่เป็นประตูสู่ฟังก์ชันนี้ ด้วยเหตุนี้ จึงสร้างขึ้นโดยคำนึงถึงบล็อกเป็นหลักเท่านั้น

การทำงานภายในของ WordPress Block Theme

ไม่มีความคล้ายคลึงกันมากมายระหว่างธีมคลาสสิกและธีมบล็อก แต่ทั้งคู่มีกฎพื้นฐานที่ชี้นำการแต่งหน้าของพวกเขา หากคุณต้องการดาวน์โหลดธีมบล็อกและสำรวจโครงสร้างไฟล์ ความแตกต่างที่สำคัญบางประการอาจโดดเด่น

ไฟล์เทมเพลตเป็น HTML แทนที่จะเป็น PHP

ในธีมคลาสสิก คุณจะพบไฟล์เทมเพลตที่มีชื่อต่างๆ เช่น index.php และ header.php บล็อกธีมใช้ PHP และใช้นามสกุลไฟล์ .html แทน

ภายในไฟล์เทมเพลตประกอบด้วย HTML และบล็อกมาร์กอัป ตัวอย่างเช่น มาดูเทมเพลตนี้จากเอกสารทางการของ WordPress:

 <!-- wp:site-title /--> <!-- wp:image {"sizeSlug":"large"} --> <figure class="wp-block-image size-large"> <img src="https://cldup.com/0BNcqkoMdq.jpg" alt="" /> </figure> <!-- /wp:image --> <!-- wp:group --> <div class="wp-block-group"> <!-- wp:post-title /--> <!-- wp:post-content /--> </div> <!-- /wp:group --> <!-- wp:group --> <div class="wp-block-group"> <!-- wp:heading --> <h2>Footer</h2> <!-- /wp:heading --> </div> <!-- /wp:group -->

บล็อกมาร์กอัปดูเหมือนความคิดเห็น HTML แย่มาก แต่มีไวยากรณ์สำหรับการเรียกบล็อกเฉพาะลงในเทมเพลต เว็บไซต์ WordPress Full Site Editing มีข้อมูลอ้างอิงที่มีประโยชน์ซึ่งรวมถึงมาร์กอัปสำหรับบล็อกเริ่มต้นแต่ละบล็อก

และหากโค้ดประเภทนี้ดูคุ้นเคย คุณอาจเคยเห็นบางสิ่งที่คล้ายกันในมุมมองตัวแก้ไขโค้ดของ Gutenberg

การใช้โฟลเดอร์

ธีมคลาสสิกสามารถจัดเก็บเทมเพลตไว้ในโฟลเดอร์ได้ แต่ไม่จำเป็น ธีมที่ถูกบล็อกต้องมีโฟลเดอร์ย่อยสองสามโฟลเดอร์:

/parts
ประกอบด้วยรายการที่นำกลับมาใช้ใหม่ได้ เช่น ส่วนหัว ส่วนท้าย และแถบด้านข้าง

/templates
เทมเพลตบ้านสำหรับเนื้อหาประเภทต่างๆ รายการต่างๆ เช่น เพจ ที่เก็บถาวรของโพสต์ และโพสต์เอกพจน์เป็นตัวอย่างทั่วไป โปรดทราบว่าแบบแผนการตั้งชื่อของพวกเขาเป็นไปตามลำดับชั้นของเทมเพลต WordPress ซึ่งมีความคล้ายคลึงกันกับธีมคลาสสิก

ผลกระทบด้านบวกประการหนึ่งของข้อตกลงนี้คือ ธีมจะได้รับการจัดระเบียบให้ดีขึ้น การมีโครงสร้างโฟลเดอร์ที่ได้มาตรฐานหมายถึงใช้เวลาน้อยลงในการค้นหาไฟล์บางไฟล์

Theme.json จัดแต่งทรงผม

ไฟล์ theme.json ใช้เพื่อกำหนดการตั้งค่าเริ่มต้นให้กับตัวแก้ไขบล็อก ซึ่งหมายความว่า เหนือสิ่งอื่นใด คุณสามารถตั้งค่าจานสีเริ่มต้น ตัวพิมพ์ และระยะห่างได้ การตั้งค่าสามารถใช้ได้ทั้งไซต์หรือนำไปใช้กับบล็อกเฉพาะ

เนื่องจาก theme.json จะสร้าง CSS ที่เหมาะสมโดยอัตโนมัติตามการกำหนดค่า คุณจึงไม่จำเป็นต้องกรอก style.css ของธีมมากนัก ในสถานการณ์นั้น สไตล์ชีตใช้เพื่อกำหนดพื้นฐานบางอย่าง ในขณะที่ทุกอย่างอื่นอาศัยไฟล์ใหม่นี้

การสร้างและแก้ไขเทมเพลต

WordPress ให้ความสามารถในการแก้ไขไฟล์เทมเพลตของธีมได้โดยตรงภายในแดชบอร์ด สิ่งนี้มักทำให้ท้อใจ เนื่องจากข้อผิดพลาดในการเขียนโค้ดเพียงเล็กน้อยก็อาจทำให้ไม่สามารถเข้าถึงเว็บไซต์ได้ ไม่ต้องพูดถึงความเป็นไปได้ของการเปลี่ยนแปลงที่จะถูกเขียนทับเมื่อมีการอัปเดตธีม (ซึ่งเป็นส่วนหนึ่งของเหตุผลในการใช้ธีมย่อย) นักพัฒนาบางคนปิดคุณลักษณะนี้ทั้งหมดเพื่อหลีกเลี่ยงโอกาสที่จะเกิดภัยพิบัติในระยะไกล

แต่ธีมของบล็อกนั้นเกี่ยวกับการแก้ไขภายในแดชบอร์ด เทมเพลตที่รวมอยู่ในธีมสามารถปรับแต่งได้ผ่านตัวแก้ไขบล็อก และสามารถสร้างเทมเพลตที่กำหนดเองใหม่ได้เช่นกัน

อย่างที่คุณคาดไว้ รหัสเป็นทางเลือกที่สมบูรณ์ในสถานการณ์นี้ ทุกอย่างสามารถแก้ไขได้ผ่าน Site Editor ใหม่ ( ลักษณะ ที่ปรากฏ > ตัวแก้ไข – WordPress 5.9 หรือสูงกว่า จำเป็น ) ซึ่งจะแทนที่ตัวปรับแต่งดั้งเดิมเมื่อเปิดใช้งานธีมบล็อก และเช่นเดียวกับหน้าหรือโพสต์ ตัวแก้ไขไซต์ใช้ UI ตัวแก้ไขบล็อกที่คุ้นเคย

และนั่นไม่ใช่ทั้งหมด คุณสามารถส่งออกการเปลี่ยนแปลงใด ๆ ที่คุณทำใน WordPress ได้ ซึ่งจะทำให้คุณสามารถใช้ธีมบล็อกที่คุณกำหนดเองได้ในหลายเว็บไซต์

ซึ่งช่วยลดอุปสรรคในการเข้าร่วมสำหรับผู้ที่ต้องการปรับแต่งหรือสร้างธีม ตอนนี้ ตาพื้นฐานสำหรับการออกแบบและความรู้ในการทำงานของบล็อคสามารถนำไปสู่เว็บไซต์ที่กำหนดเองได้

สิ่งที่ควรทราบ

ก่อนที่คุณจะดำดิ่งลงไปและเปลี่ยนเว็บไซต์ทั้งหมดของคุณเพื่อใช้ธีมแบบบล็อก มีบางสิ่งที่คุณควรทราบ

ประการแรกและสำคัญที่สุด ธีมบล็อกเป็น เทคโนโลยีที่พึ่งเกิด ขึ้น คุณลักษณะบางอย่างยังไม่ได้รับการสรุปผลและแนวทางปฏิบัติที่ดีที่สุดบางอย่างจำเป็นต้องได้รับการแก้ไข นอกจากนี้ เราเพิ่งเริ่มเห็นว่าธีมเหล่านี้ทำงานอย่างไรในสภาพแวดล้อมที่ใช้งานจริง คาดหวังการเปลี่ยนแปลงหลายอย่างเมื่อสิ่งต่างๆ พัฒนาขึ้น

หากคุณสร้างไซต์สำหรับลูกค้าและต้องการรักษาความยืดหยุ่นในอนาคต ธีมไฮบริด อาจเป็นที่สนใจ อนุญาตให้ใช้คุณสมบัติ FSE ในขณะที่ยังคงโครงสร้าง PHP ของธีมคลาสสิก คุณยังสามารถปรับแต่งธีมที่มีอยู่เพื่อใช้ฟังก์ชันนี้ได้

สุดท้าย ธีมแบบบล็อก ไม่ได้ เป็นจุดจบของธีมคลาสสิก อย่างน้อยก็ไม่ใช่สำหรับอนาคตอันใกล้ ด้วยเหตุนี้ การเปลี่ยนไปใช้รูปแบบใหม่นี้จึงไม่จำเป็นต้องเกิดขึ้นในทันที ตัวอย่างเช่น การทดลองบล็อกในสภาพแวดล้อมในพื้นที่นั้นเป็นเรื่องปกติในขณะที่ยังคงใช้ธีมคลาสสิกที่คุณชื่นชอบในการผลิต

บล็อกทรัพยากรธีม

หากคุณต้องการเรียนรู้เพิ่มเติมเกี่ยวกับธีมบล็อกของ WordPress มีแหล่งข้อมูลที่โดดเด่นอยู่บ้าง นี่คือรายการโปรดบางส่วนของเรา:

• บล็อกเอกสารธีมโดย WordPress
• ธีม Blockbase โดย Automattic
• การแก้ไขเว็บไซต์แบบเต็มโดย Carolina Nymark
• คู่มือขั้นสูงสำหรับเทมเพลตบล็อก WordPress ใน Gutenberg โดย Rich Tabor
• การปฏิวัติธีมบล็อกของ WordPress กำลังดึงโมเมนตัมอย่างเงียบ ๆ โดย Justin Tadlock
• WordPress Theme Experiments โดย WordPress