วิธีสร้างและใช้ฟิลด์ที่กำหนดเองใน WordPress

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

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

การเพิ่มฟิลด์ที่กำหนดเองในโพสต์

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

1. ไปที่หน้าจอแก้ไขโพสต์และทำเครื่องหมายที่ “ช่องกำหนดเอง”

2. ค้นหาช่อง Custom Fields ซึ่งเป็นส่วนหนึ่งของการแก้ไขโพสต์ของคุณ เมื่อคุณอยู่ในหน้าโพสต์ คุณจะเห็นส่วนใหม่ที่ด้านล่างโดยมีส่วนหัวเป็น "ฟิลด์ที่กำหนดเอง"

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

3. เพิ่มรหัสซึ่งในกรณีนี้คือ "ประเภทของการออกกำลังกาย" เราจะใช้ช่องนี้เพื่อเพิ่มรายละเอียดเฉพาะในโพสต์ คลิกที่ "Enter new" และพิมพ์รหัสในช่อง

4. เพิ่มมูลค่า ไปกับ Zumba สำหรับอันนี้ โปรดทราบว่านี่จะแสดงเฉพาะในโพสต์นี้เท่านั้น ในโพสต์อื่น คุณสามารถป้อนค่าอื่นได้ เช่น "Elliptical" หรือการออกกำลังกายประเภทอื่น

5. บันทึกโพสต์

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

การแสดงฟิลด์ที่กำหนดเองในโพสต์

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

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

หมายเหตุ: การปรับแต่งเหล่านี้ควรทำในธีมย่อย และเราจะใช้ไฟล์ single.php เช่นเคย การปรับแต่งเช่นนี้ได้รับการทดสอบที่ดีที่สุดในสภาพแวดล้อมการพัฒนา

1. เปิดไฟล์ single.php และเพิ่มโค้ดนี้นอกลูป WordPress:

 <?php the_meta(); ?>

มันจะแสดงสิ่งนี้:

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

 <div class="content-area"> <main class="site-main" role="main">

วิธีการนี้จะใช้เพื่อแสดงช่องที่กำหนดเองอื่นๆ ที่คุณสร้างขึ้นด้วย

สิ่งหนึ่งที่ต้องพูดถึงเกี่ยวกับตัวอย่างนี้: ธีมลูกถูกสร้างขึ้นจากธีมหลักของ WordPress Twenty Fifteen ซึ่งเป็นที่นิยมมาก หากคุณกำลังทดลองตำแหน่งที่จะแสดงฟิลด์ที่กำหนดเอง อาจมีเทมเพลตอื่นที่คุณต้องการในธีมลูกของคุณนอกเหนือจากไฟล์ single.php ในการแสดงข้อมูลในโพสต์ มีการเพิ่ม content.php ในธีมย่อย ตัวอย่างข้อมูลด้านบนถูกวางไว้ในเนื้อหาของหน้า ดังนั้นมันจึงปรากฏเป็นส่วนหนึ่งของโพสต์

2. จัดรูปแบบฟิลด์ หากคุณไปที่ผู้ตรวจสอบ คุณจะเห็นคลาสใหม่เพิ่มเข้ามาในเพจ

นี่คือลักษณะของตัวอย่างที่มีฟิลด์กำหนดเองที่แตกต่างกันสองฟิลด์:

• ประเภทของการออกกำลังกาย: ซุมบ้า
• ช่วงเวลาของวัน: เช้า

การทำงานเป็นรายการนั้นค่อนข้างง่าย ด้วยสไตล์บางอย่าง มันจะดูเข้ากับสไตล์ของไซต์มากขึ้น ด้วยการดัดแปลง CSS ง่ายๆ สองสามอย่าง เราสามารถปรับสีข้อความและรูปแบบรายการได้

 ul.post-meta li { color: #898989; list-style-type: none; } ul.post-meta li span.post-meta-key { color: #1fc3d2; font-weight: bold; }

การปรับแต่งฟิลด์ที่กำหนดเองเพิ่มเติม

การจัดรูปแบบในตัวอย่างก่อนหน้านี้จะใช้งานได้ดี แต่ยังมีอีกมากที่เราทำ ตัวอย่างต่อไปนี้จะแสดงให้คุณเห็นว่าฟิลด์ที่กำหนดเองสามารถปรับเปลี่ยนได้ด้วยตัวเลือกการแสดงผลเพิ่มเติมสำหรับกรณีการใช้งานเฉพาะอย่างไร การทำให้ฟิลด์ที่กำหนดเองอ่านเป็นส่วนหนึ่งของโพสต์และการตั้งค่าบริบทด้วยหัวข้อที่เป็นประโยชน์จะเป็นส่วนเสริมที่ยอดเยี่ยมสำหรับโพสต์ หากคุณทำตามทีละขั้นตอน อย่าลืมแสดงความคิดเห็นใน <?php the_meta(); ?> <?php the_meta(); ?> ที่คุณเพิ่มในตัวอย่างก่อนหน้านี้

สำหรับตัวอย่างนี้ สิ่งต่าง ๆ ได้รับการแก้ไขเล็กน้อย คีย์ได้รับการทำให้ง่ายขึ้นเป็น "แบบฝึกหัด" ดังนั้นจึงสามารถเพิ่มลงในเทมเพลตได้ง่ายขึ้น และเพิ่มส่วนย่อยของโค้ดในไฟล์ content.php ของธีมย่อย เพื่อให้ปรากฏในเนื้อหาของโพสต์ แทนที่จะเป็นก่อนหรือหลัง .

 <?php $exercises = get_post_meta($post->ID, 'exercises', false); ?> <h3>Today's exercise:</h3> <ul> <?php foreach($exercises as $exercise) { echo '<li>'.$exercise.'</li>'; } ?> </ul>

ขณะนี้ ฟิลด์ที่กำหนดเองแสดงอยู่ด้านล่างหัวข้อที่มีข้อความว่า “แบบฝึกหัดวันนี้:” ในรูปแบบรายการ สิ่งนี้ถูกตั้งค่าเป็น <h3> แต่สามารถปรับให้เป็นสไตล์หัวเรื่องหรือย่อหน้าอื่นได้อย่างง่ายดาย หากคุณไม่ต้องการให้อยู่ในรูปแบบรายการ ก็สามารถจัดโครงสร้างตามที่คุณต้องการได้เช่นกัน

กำหนดเองแบบมีเงื่อนไข

เขตข้อมูล

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

 <?php $exercises = get_post_meta($post->ID, 'exercises', true); ?> <h3>Today's exercise:</h3> <ul> <?php if ($exercises) { ?> <?php echo '<li>' .$exercises. '</li>'; ?> <?php } //if there is nothing for exercises then display else { ?> <li>Today was a rest day.</li>

ปลั๊กอินฟิลด์ที่กำหนดเองขั้นสูง

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

กลุ่มฟิลด์

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

สิ่งนี้แทบจะไม่ทำให้พื้นผิวของสิ่งที่สามารถทำได้ด้วยปลั๊กอินนี้ หากต้องการดูภาพทั้งหมด อย่าลืมไปที่เว็บไซต์ Advanced Custom Fields

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