คู่มือที่จำเป็นสำหรับฟิลด์ที่กำหนดเองของ WordPress
เผยแพร่แล้ว: 2020-09-19หากมีคุณลักษณะหนึ่งเกี่ยวกับ WordPress ที่ทำให้แตกต่างจากระบบจัดการเนื้อหา (CMS) อื่น ๆ นั่นคือการปรับแต่งเอง ฟิลด์ที่กำหนดเองใน WordPress เป็นส่วนหนึ่งของ CMS ในตัวที่ให้คุณขยายได้ ไม่เพียงแต่ข้อมูลเมตาและข้อมูลที่คุณแสดง แต่ยังเปลี่ยนการทำงานและยูทิลิตี้ของโพสต์หรือเพจได้อย่างสมบูรณ์ เราต้องการช่วยให้คุณเข้าใจพื้นฐาน เราจะพูดถึงว่าฟิลด์ที่กำหนดเองคืออะไร เหตุใดจึงมีประโยชน์ และให้ตัวอย่างการใช้งานจริงบางส่วน
สมัครสมาชิกช่อง Youtube ของเรา
ฟิลด์ที่กำหนดเองของ WordPress คืออะไร?
กล่าวโดยย่อ ฟิลด์ที่กำหนดเองของ WordPress ช่วยให้คุณสามารถเพิ่มองค์ประกอบเฉพาะลงในเพจได้ อาจเป็นประเภทเฉพาะของรูปภาพหรือทางสายย่อยหรือชีวประวัติของผู้เขียน อาจเป็นการให้คะแนน หรือแม้แต่บางอย่างที่คล้ายกัน ตามที่รายการ Codex ในฟิลด์ที่กำหนดเองระบุ อารมณ์ กำลังอ่าน กำลังฟัง หรือกล่องสภาพอากาศ
ฟิลด์เหล่านี้ประกอบขึ้นเป็นข้อมูลที่เรียกว่าข้อมูลเมตาสำหรับโพสต์ของคุณ (โดยทั่วไปจะเป็นอะไรก็ได้ที่ไม่รวมอยู่ในเนื้อหาหลักของบทความของคุณ) ตามค่าเริ่มต้น WordPress มีเมตาบ็อกซ์สำหรับข้อมูลทั่วไป เช่น แท็ก หมวดหมู่ ลิงก์ถาวร รูปภาพเด่น ฯลฯ หากคุณต้องการเพิ่มมากกว่านี้ คุณจะต้องใช้ฟิลด์ที่กำหนดเอง
คุณอาจต้องการเพิ่มข้อมูลที่ผู้เขียนแต่ละคนในทีมของคุณต้องกรอกเพื่อเผยแพร่โพสต์

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

จากนั้นเลือกเปิดใช้งาน ฟิลด์ที่กำหนดเอง ใกล้กับด้านล่างของหน้าจอที่ปรากฏขึ้น คุณจะต้องโหลดหน้าซ้ำ ดังนั้นอย่าลืมบันทึกงานของคุณก่อน

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

แม้ว่าฟิลด์ที่กำหนดเองของ WordPress จะมีประสิทธิภาพอย่างเหลือเชื่อ แต่ฟิลด์เริ่มต้นจะถูกจำกัดไว้ที่ค่าข้อความ ต้องใช้ PHP และการพัฒนาเพื่อให้มีประสิทธิภาพมากขึ้น โชคดีที่มีปลั๊กอินที่เหมาะกับคุณ และเราจะแนะนำวิธีทำให้ใช้งานได้ หากคุณต้องการเพียงแค่ช่องข้อความสำหรับบางโพสต์และไม่ต้องการปลั๊กอิน โปรดข้ามไปที่ด้านล่างเกี่ยวกับการเพิ่มฟิลด์ที่กำหนดเองของ WordPress ในส่วนหน้าของธีมของคุณ ซึ่งใช้กับฟิลด์เริ่มต้นเช่นเดียวกับฟิลด์ที่สร้างโดยปลั๊กอิน เช่น ฟิลด์กำหนดเองขั้นสูง
การใช้ปลั๊กอินฟิลด์กำหนดเองขั้นสูง
เช่นเดียวกับสิ่งส่วนใหญ่ใน WordPress คุณมีสองตัวเลือกในการใช้งาน คุณสามารถแก้ไขไฟล์ PHP ด้วยตนเองเพื่อเพิ่มฟังก์ชันฟิลด์แบบกำหนดเอง หรือคุณสามารถใช้ปลั๊กอินได้ ในกรณีนี้ เราขอแนะนำอย่างยิ่งให้ไปที่เส้นทางของปลั๊กอิน อย่างไรก็ตาม หากคุณรู้สึกว่าจำเป็นต้องแก้ไข PHP และเข้าสู่โค้ด คุณสามารถทำได้ภายใต้ Appearance – Theme Editor นี่คือหน้า WP Codex ในฟิลด์ที่กำหนดเองเพื่อให้คุณดำเนินการได้ มันเชื่อมโยงไปยังแท็กเทมเพลตและ hooks ต่าง ๆ ที่คุณต้องการเพื่อให้มันใช้งานได้
แต่ขอย้ำอีกครั้งว่า เราขอแนะนำอย่างยิ่งให้ใช้ปลั๊กอิน Advanced Custom Fields แทนการปรับแต่งโค้ด ปลั๊กอินช่วยให้ทุกอย่างที่คุณต้องการจากฟิลด์ที่กำหนดเอง (และบางส่วน) ดังนั้นเราจึงไม่รู้สึกว่าจำเป็นต้องสร้างวงล้อใหม่ เมื่อมันทำงานก็ทำงาน ใช้มัน.

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

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

พื้นฐานของ ACF
การสร้างฟิลด์ด้วยตัวเองค่อนข้างตรงไปตรงมา ย้ายไปที่หน้าต่าง เพิ่มใหม่

ไม่ว่าจะเกิดอะไรขึ้น ฟิลด์ที่กำหนดเองของ ACF จะรวมอยู่ใน กลุ่มฟิลด์ นี่หมายถึงฟิลด์เฉพาะที่อยู่ในกล่องเดียวกัน ดังนั้นคุณจึงสามารถตั้งชื่ออะไรก็ได้ที่คุณต้องการให้ปรากฏในเครื่องมือแก้ไขบทความ แต่ละครั้งที่คุณต้องการเพิ่มรายการลงในกลุ่ม คุณจะคลิกปุ่ม เพิ่มฟิลด์ ทำเช่นนี้ทุกครั้งที่คุณต้องการให้เขตข้อมูลอื่นในกล่องเมตาเดียวกัน กฎ ตำแหน่ง กำหนดตำแหน่งและเวลาที่กล่องจะปรากฏขึ้น ในตัวอย่างนี้ เนื่องจาก Post Type Is Equal To Post นั่นหมายความว่า Post Type จะปรากฏบน Posts เท่านั้น ไม่ใช่เพจหรือโพสต์แบบกำหนดเองอื่นๆ
ถัดไป คุณจะต้องเลือกการ ตั้งค่า สำหรับฟิลด์เอง มันจะทำอะไรและฟังก์ชั่นที่จะให้บริการบนเว็บไซต์


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

สิ่งเหล่านี้จะอยู่ภายใต้กลุ่มฟิลด์เดียวกัน แต่ฟิลด์ต่างกัน ดังที่คุณเห็นด้านบน Is It Streaming? ฟิลด์ถูกตั้งค่าให้เป็นปุ่มตัวเลือกพร้อมตัวเลือกใช่/ไม่ใช่ ซึ่งจำเป็นก่อนเผยแพร่ นอกจากนี้ เราต้องการให้ฟิลด์เงื่อนไขแสดงขึ้นถ้าฟิลด์ถูกทำเครื่องหมายเป็น ใช่ ทำได้โดยกด Add Field อีกครั้ง

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

และเมื่อคุณเผยแพร่โพสต์ ข้อมูลเมตาที่คุณป้อนจะเป็นส่วนหนึ่งของโพสต์ แต่ก็ยังมีปัญหาอยู่อย่างหนึ่ง คุณไม่สามารถมองเห็นได้ และผู้เข้าชมของคุณก็ไม่สามารถเห็นได้
วิธีแสดงฟิลด์ที่กำหนดเองบน WordPress Front-End
แม้ว่าคุณจะทำทั้งหมดนี้อย่างสมบูรณ์แล้วก็ตาม ข้อมูลที่คุณป้อนจะไม่ปรากฏที่ส่วนหน้าของไซต์ของคุณโดยไม่มีการปรับแต่งเล็กน้อย สรุปมันจะแสดงที่ไหน? หลายครั้ง ธีมของคุณจะมีวิธีแสดงข้อมูลเมตาและฟิลด์ที่กำหนดเอง แต่ธีมเหล่านั้นจะแตกต่างกันไปตามธีม ตรวจสอบตัวเลือกชุดรูปแบบของคุณสำหรับเอกสารประกอบ
อีกวิธีในการแสดงฟิลด์ที่กำหนดเองที่ส่วนหน้าคือรหัสย่อ ACF ในตัว แม้ว่าจะไม่มีเครื่องมือปรับแต่งหรือตัวสร้างใน ACF คุณสามารถใช้รหัสย่อต่อไปนี้สำหรับ ช่องข้อความเท่านั้น

แต่เนื่องจากจำกัดเฉพาะช่องข้อความ จึงอาจมีการใช้งานจำกัดสำหรับคนจำนวนมาก คุณยังสามารถเข้าไปที่ PHP และใช้โค้ด ACF ได้เช่นเดียวกับในตัวอย่างเอกสาร คุณยังสามารถอัปเกรดเป็น ACF Pro และเข้าถึงบล็อก Gutenberg ในตัวที่แสดงฟิลด์ที่กำหนดเองได้เหมือนกับที่คุณจัดรูปแบบในตัวสร้าง
แต่อย่างที่เรากล่าวไป ธีมจำนวนมากมาพร้อมกับการรวมฟิลด์ที่กำหนดเองในทุกวันนี้ และเราจะแสดงให้คุณเห็นว่ามีการจัดการใน Divi อย่างไร
วิธีแสดงฟิลด์ที่กำหนดเองในส่วนหน้าโดยใช้ Divi
ก่อนอื่น จำไว้ว่าโมดูล Divi จำนวนมากสามารถแสดงรหัสย่อได้ หลายครั้งที่ฟิลด์ข้อความที่กำหนดเองของคุณที่สร้างใน ACF สามารถแทรกได้โดยใช้รหัสย่อ ดังที่เราได้กล่าวไว้ข้างต้น
สำหรับตัวอย่างด้านบนของเราที่ใช้ตรรกะแบบมีเงื่อนไขและปุ่มตัวเลือก เราจะใช้คุณลักษณะเนื้อหาแบบไดนามิกของ Divi มันใช้งานง่ายมากเช่นกัน เราจะแสดงให้คุณเห็นผ่าน Divi Theme Builder แต่คุณสามารถใช้มันในโมดูลใดก็ได้ที่รองรับในตัวสร้าง Divi ปกติ คลิก สีดำ + และเลือกโมดูลที่คุณต้องการ สำหรับสิ่งนี้ มันคือ Text Module

ถัดไป ให้ค้นหาส่วนของโมดูลที่คุณต้องการแทรกฟิลด์ที่กำหนดเองเข้าไป มองหาไอคอน เนื้อหาแบบไดนามิก ที่ด้านขวาของสถานที่ใดๆ ที่รองรับคุณลักษณะนี้

คลิกเพื่อเลือกจากเมนูแบบเลื่อนลงของเนื้อหาไดนามิกทุกประเภทที่มี รวมถึงฟิลด์ที่กำหนดเองทั้งหมด พวกเขาอาจอยู่ที่ด้านล่างสุด

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

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

นอกจากนี้ ตัวเลือก Enable Raw HTML จะอนุญาตให้โค้ดใดๆ ที่คุณใส่ลงในฟิลด์ ACF แสดงผล เช่น ลิงก์ไปยังแพลตฟอร์มต่างๆ เป็นต้น
ห่อ
อย่างที่คุณเห็น แม้ว่าจะดูค่อนข้างซับซ้อน แต่ฟิลด์ที่กำหนดเองของ WordPress เป็นคุณลักษณะที่ไม่ต้องการให้นักพัฒนาทำถูกต้อง เพียงติดตั้ง ACF และเริ่มปรับแต่งวิธีการป้อนข้อมูลของคุณและทีมของคุณ ไม่ว่าจะเป็นไซต์วิจารณ์ ตลาดอีคอมเมิร์ซ หรือแม้แต่บล็อกที่เป็นมิตรซึ่งคุณต้องการแบ่งปันสิ่งที่เกิดขึ้นในชีวิตของคุณ ความสามารถในการปรับแต่งและทำให้ข้อมูลเมตาของโพสต์และเพจของคุณสมบูรณ์แบบสามารถยกระดับเว็บไซต์ของคุณขึ้นสู่ระดับใหม่
คุณใช้ฟิลด์ที่กำหนดเองของ WordPress เพื่ออะไร?
ภาพเด่นโดย SurfsUp / shutterstock.com
