ทำไม Meta Box ถึงเป็นปลั๊กอินจัดการฟิลด์ที่น่าใช้ใน WordPress

|
8 mins reading time

เมื่อไม่นานมานี้ วงการ WordPress ได้รับผลกระทบจากการขัดแย้งครั้งใหญ่ระหว่าง WordPress และ WP Engine ที่ทำให้หลายๆ คนตกใจและสงสัยในเส้นทางของทั้งสองยักษ์ใหญ่ โดยความขัดแย้งนี้ไม่เพียงแค่ส่งผลกระทบต่อการให้บริการโฮสต์ของ WP Engine เท่านั้น แต่ยังขยายไปถึงการปิดกั้นปลั๊กอิน ACF ที่เกี่ยวข้องและการแบนจาก Directory ของ WordPress.org ซึ่งหมายความว่าผู้ใช้งานที่อยู่ในระบบของ WP Engine อาจไม่สามารถเข้าถึงการอัพเดทหรือการสนับสนุนจาก WordPress ได้อีกต่อไป

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

ข้อแตกต่างระหว่าง ACF vs META BOX

ปลั๊กอิน ACF (Advanced Custom Fields) เวอร์ชันโปรจะมาพร้อมกับความสามารถพื้นฐานที่หลากหลาย เช่น การจัดการ Options Page, ฟิลด์, และ Post Type ทำให้ผู้ใช้สามารถเริ่มต้นใช้งานได้ทันที

การออกแบบ Meta Box เป็นลักษณะโมดูล โดยเริ่มต้นจำเป็นต้องติดตั้งเวอร์ชันฟรีก่อน และถ้าหากต้องการความสามารถเพิ่มเติม จำเป็นต้องติดตั้งปลั๊กอินส่วนเสริม การออกแบบนี้จะทำให้ปลั๊กอินไม่บวม โหลดเร็ว เนื่องจากจะโหลดเฉพาะฟังก์ชันที่จะใช้งานเท่านั้น

Meta Box มีส่วนเสริมต่าง ๆ ที่ช่วยเพิ่มความสามารถ โดยแบ่งเป็นประเภทดังนี้

DataUIAdminFrontend
MB Blocks,
MB Custom Table
MB Revision
MB Settings Page
MB Term Meta
MB User Meta
MB User Profile
Meta Box Geolocation
Meta Box Group
Meta Box Template
MB Admin Columns
MB Blocks
MB Frontend Submission
MB User Profile
MB Views, Meta Box Builder
Meta Box Columns
Meta Box Conditional Logic
Meta Box Group
Meta Box Include Exclude
Meta Box Show Hide
Meta Box Tabs
Meta Box Template
Meta Box Tooltip
MB Admin Columns
MB Blocks
MB Revision
MB Settings Page
Meta Box Builder
Meta Box Template
MB Frontend Submission
MB User Profile
MB Views

เรามาลองดูตัวอย่างความสามารถใน extension แต่ละตัวกันว่ามีตัวไหนที่น่าสนใจกันบ้าง

Meta Box AIO

Meta Box AIO – รวมความสามารถของทุก Extension

ปลั๊กอินตัวนี้จำเป็นต้องติดตั้งตัวฟรีก่อนถึงจะใช้ตัว AIO ได้ โดยตัวนี้จะรวบรวมความสามารถของ extension ทุกตัว และสามารถจัดการ เปิด/ปิด extension และจะทำงานเท่าที่ตัวที่เราเปิดใช้เท่านั้น

Meta Box Builder – ใช้สำหรับการการสร้างฟิลด์

extension ตัวนี้จะเป็นตัวหลักที่เอาไว้ใช้สำหรับการสร้างฟิลด์ ซึ่งจะเทียบเท่ากับ ACF ตัวโปรที่จะมีความสามารถในการสร้างฟิลด์ต่างๆ ให้กับ Post Type, Taxonomy, User, Setting ที่ต้องการ โดยฟิลด์พื้นฐานที่มีมาให้

Meta Box Builder – ฟิลด์ขั้นพื้นฐาน
Meta Box Builder – ฟิลด์และโค้ดพร้อมใช้

จะมีหน้าตาคล้ายๆ กับ ACF เลยถ้าใครเคยใช้ มาก่อนตรงนี้เรียนรู้ได้ไม่น่ายาก แต่ความสามารถจะไม่ครบครันเท่ากับ ACF Pro ต้องลง extension เพิ่มเติม โดยจะมีโค้ดพร้อมใช้ในธีมที่เตรียมไว้ให้แล้วด้วย

Meta Box Builder – หน้าตั้งค่า

การตั้งค่าที่มีมาให้ก็จะเป็นการกำหนดสถานที่ ที่ต้องการแสดงไว้ใน post type ใด, ตำแหน่งที่จะแสดง, สไตล์ มาให้

Meta Box Builder -ฟิลด์ที่แสดงใน Post

Meta Box Group – จัดกลุ่มให้ฟิลด์

ตัวดั้งเดิม Meta Box Template จะไม่ได้มีความสามารถในการสร้างกลุ่มฟิลด์ขึ้นมาได้ เพื่อความสะดวก query ในการเรียกใช้งาน นอกจากนั้นยังมีความสามารถในการทำ repeater ได้ด้วย โดยการติ๊กที่ช่อง cloneable

Meta Box Group -การจัดกลุ่มฟิลด์ และการเรียกใช้

MB Admin Column – เพิ่มฟิลด์ในหน้ารายการของ Admin

ปกติแล้วถ้าใช้ ACF ผู้ใช้จำเป็นต้องเขียนโค้ดเองเพื่อให้แสดงฟิลด์ในหน้ารายการ แต่ Meta box มีตัวเสริมความสามารถในการแสดงฟิลด์ในหน้ารายการให้แล้ว ให้เปิด Extension – MB Admin Column ก็จะมีปุ่มแสดงตามภาพ

Meta Box Admin – ติ๊กเพื่อแสดงฟิลด์นี้ในหน้ารายการ
Meta Box Admin – เมื่อติ๊กแล้ว จะแสดงตามรายการนี้

MB Custom Table – สร้างตารางใหม่ เพื่อ Performance ที่ดีกว่า

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

ยกตัวอย่าง
โพสต์ 1 โพสต์มีข้อมูล meta 20 แถว หากเว็บไซต์มี 100,000 โพสต์ ก็จะทำให้ตาราง post_meta ใหญ่ถึง 100,000 x 20 = 2,000,000 แถวเลยทีเดียว

ซึ่งตัวนี้จะทำให้เราสามารถสร้างตารางและเพิ่มคอลัมน์ ขึ้นมาให้เท่ากับข้อมูล meta ของเราเลย การเก็บข้อมูลจะเป็นลักษณะแนวนอนทำให้ 1 โพสต์มี meta 20 แถว ตัว Extension ก็จะสร้างคอลัมน์เพื่อเก็บข้อมูล เลยทำให้ 1 โพสต์จะเท่ากับ 1 แถวเท่านั้น ถ้ามี 100,000 โพสต์ ก็จะมีเพียงแค่ 100,000 แถวเท่านั้น ทำให้ประสิทธิภาพดีขึ้นถึง 20 เท่าเลย

วิธีการใช้งาน เพียงทำตามรูป ด้านล่างนี้ได้เลย

MB Custom Table – เปิด extension จะแสดงฟิลด์ขึ้นมา
MB Custom Table – กำหนดชื่อตาราง และให้สร้างตารางให้อัตโนมัติ
MB Custom Table – เมื่อใช้ wp_postmeta จะเก็บข้อมูลในแนวตั้ง
MB Custom Table – เมื่อสร้างตารางเอง จะเก็บข้อมูลในแนวนอน

ข้อเสียของการใช้ create แบบอัตโนมัติ คือ ชนิดคอลัมน์จะใช้เป็น TEXT หมดเลย ถ้าต้องที่จะปรับแต่งชนิด รวมถึง Key, Index ต่างๆ สามารถเขียนโค้ดสร้างขึ้นมาเองได้ โดยมี helper ของ Meta Box ช่วยได้ ตามนี้

MB Custom Table – การเรียกใช้ข้อมูล

ซึ่งวิธีการเรียกใช้งานก็จะแตกต่างกันนิดหน่อยโดยมีการกำหนดชื่อตารางกำกับไว้ใน parameter ที่ 2 ด้วย

และยังมีวิธีที่ Advanced ขึ้นไปกว่านั้นอีก คือการสร้าง model ขึ้นมาใหม่เลยโดยใช้ API ของ Meta Box ซึ่งการสร้างจะเหมือนกับการสร้าง Post Type ใหม่เลย แต่จะไม่ไปยุ่งกับตาราง wp_posts หรือ wp_postmeta เลย กลับกันจะไปสร้าง table ใหม่ขึ้นมาโดยเฉพาะ และบันทึกลง table นั้นเพียง table เดียวซึ่งทำให้ Performance ได้ดี แบบสุดๆ หากใครอยากศึกษาลองดูได้ here

MB User Profile – สร้างฟอร์ม เข้าสู่ระบบ, ลงทะเบียน, แก้ไขโปรไฟล์

ตัวนี้จะช่วยสร้างฟอร์มสำหรับ Login, Register, Edit Profile ได้ โดยจะมี shortcode มาให้ และ component ใน gutenberg ให้ใช้ได้เลย

MB User Profile – Component ใน Gutenberg

โดยวิธีการใช้งานฟอร์ม Edit Profile จำเป็นต้องเชื่อม field Group ID เข้ากับ form ID ใน Gutenberg ถึงจะทำงานได้ โดยเราสามารถเพิ่มฟิลด์ที่เราต้องการได้ หากอยากให้ฟอร์มสามารถเปลี่ยนรหัสผ่านได้ก็สามารถสร้างฟิลด์ password แล้วทำการเชื่อม ID กัน

ส่วน first_name, last_name คือฟิลด์ตั้งต้นที่มีมาให้กับ WordPress เมื่อสร้างฟิลด์ให้ ID เชื่อมกัน ฟอร์มจะทำการดึงค่าเดิมมาให้อัตโนมัติ และนำไปอัพเดทต่อไป

MB User Profile – ตั้งค่า Field Group ID และการตั้งค่า Field ID
MB User Profile -ทำการเชื่อม ID กัน
MB User Profile – หน้าที่แสดงผล

Conclusion

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

อีกทั้ง extension เหล่านี้ไม่ได้เป็นเพียงแค่การเพิ่มฟิลด์หลังบ้านเท่านั้น แต่ยังสามารถนำไปต่อยอดในการสร้างระบบสมาชิก, ระบบส่งโพสต์จากหน้าบ้าน และการจัดการ การบันทึกข้อมูลด้วยตารางที่สร้างขึ้นเอง เพื่อแก้ปัญหาเรื่อง performance หากผู้อ่านสนใจ extension เพิ่มเติม สามารถเยี่ยมชมปลั๊กอินได้ here

Designil PDPA Banner Thai Woo AIO Banner

author - aum watcharapon
Aum Watcharapon
👨🏻‍💻 WordPress Expertiser

Subscribe to newsletter

doaction will send notifications when new articles are available on the website, and you can unsubscribe at any time.

More Articles

Transform WordPress into a Backend with the Power of REST API

WordPress ไม่ใช่แค่ระบบสร้างเว็บไซต์หรือเครื่องมือในการจัดการเนื้อหาเท่านั้น แต่ยังมีฟีเจอร์ API ที่ช่วยขยายความสามารถในการพัฒนาและเชื่อมต่อกับระบบอื่นๆ ไม่ว่าคุณจะต้องการสร้างแอปพลิเคชันหรือเชื่อมต่อกับบริการต่างๆ WordPress API สามารถช่วยคุณได้ บทความนี้จะพาคุณทำความรู้จักกับ WordPress API และวิธีการนำไปใช้งานให้เกิดประโยชน์สูงสุด คนเริ่มใช้ WordPress เป็น Backend มากขึ้น ในช่วงไม่กี่ปีที่ผ่านมา การใช้งาน WordPress ในฐานะ Backend กำลังเป็นที่นิยมมากขึ้น สาเหตุหลักมาจากการที่นักพัฒนาเริ่มหันไปใช้ React และ Vue.js ในการสร้าง Frontend และใช้ WordPress API (REST API) นั้นสามารถทำงานร่วมกับ Frameworks เหล่านี้ได้อย่างราบรื่น ทำให้ WordPress ไม่ได้เป็นแค่ระบบจัดการเนื้อหา (CMS) อีกต่อไป แต่กลายเป็นเครื่องมือที่สามารถใช้เป็น Backend ในการเก็บและส่งข้อมูลไปยัง Frontend ได้ WordPress API เริ่มต้นมีอะไรมาให้ใช้บ้าง ? ใน WordPress REST […]

Read more

If you have any questions or need advice about WordPress, feel free to ask.

Office

  • do action co., ltd.
    66 Soi Petchkasem 98/1, Petchkasem Road,
    Bangkhae Nuea, Bangkhae,
    Bangkok, Thailand
    10160
PDPA Icon

Our website uses cookies to enhance your user experience.

Privacy Preferences

คุณสามารถเลือกการตั้งค่าคุกกี้โดยเปิด/ปิด คุกกี้ในแต่ละประเภทได้ตามความต้องการ ยกเว้น คุกกี้ที่จำเป็น

Allow All
Manage Consent Preferences
  • Always Active

Save