Gutenberg 11.3 เปิดตัวแผงขนาด เพิ่มการรองรับปุ่มเสริม และเพิ่มความเร็วให้กับตัวแทรก

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

หนึ่งในไฮไลท์ของการเปิดตัวคือการปรับปรุงความเร็วสำหรับทั้งการเปิดและการค้นหาภายในตัวแทรก เวลาเปิดลดลงมากกว่า 200 ms จาก 370.35 ms เป็น 137.28 ms ความเร็วในการค้นหาเปลี่ยนจาก 190.37 ms เป็น 67.24 ms

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

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

แผงมิติสำหรับการควบคุมระยะห่าง

Gutenberg 11.3 แนะนำแผงมิติใหม่สำหรับบล็อกที่รองรับการควบคุมระยะขอบหรือช่องว่างภายใน คุณลักษณะนี้จะเพิ่มปุ่มจุดไข่ปลา ( ... ) แทนที่ลูกศรแท็บเปิด/ปิดทั่วไป ผู้ใช้สามารถเลือกการควบคุมที่ต้องการใช้

เป้าหมายระยะยาวคือการล้างอินเทอร์เฟซ โดยเปิดเผยเฉพาะการควบคุมที่ผู้ใช้ต้องการจริงๆ เนื่องจากความต้องการดังกล่าวเป็นเรื่องส่วนตัว การอนุญาตให้ผู้ใช้สลับเปิด/ปิดเป็นเส้นทางที่เหมาะสมที่สุด

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

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

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

ปลั๊กอิน Block Visibility มีการควบคุมแบบสลับที่ใช้งานง่ายที่สุดในตอนนี้ มันยังไม่ใช่วิธีแก้ปัญหาที่สมบูรณ์แบบ แต่ใช้งานได้ดีกว่าใน Gutenberg ในปัจจุบันเล็กน้อย

ปุ่ม Block Padding

ไม่เป็นความลับที่ฉันไม่ชอบช่องว่างภายในเริ่มต้นของบล็อกปุ่มเมื่อใช้ธีม TT1 Blocks (เวอร์ชันบล็อกของ Twenty Twenty-One) ฉันได้ทำให้มันเป็นหนึ่งในภารกิจของฉันที่จะชี้ให้เห็นเป็นประจำ แม้ว่าจะปฏิเสธที่จะใช้การบล็อกในการโทรครั้งสุดท้ายสำหรับการทดสอบซึ่งเป็นส่วนหนึ่งของ FSE Outreach Program

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

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

สวดมนต์ตอบ. ตอนนี้ ให้เราย้ายไปที่การเพิ่มการควบคุมช่องว่างภายในบล็อกทั้งหมด

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

การควบคุมขนาดรูปภาพเด่น

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

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

• ปก (ค่าเริ่มต้น)
• บรรจุ
• ยืด

ตัวเลือกเหล่านี้ทำอะไรได้บ้าง? นั่นจะเป็นคำถามที่ดี แม้จะเป็นคนที่อยู่ในแวดวงการออกแบบและพัฒนาเว็บมาเกือบสองทศวรรษแล้วก็ตาม บางครั้งฉันก็ลืมและต้องค้นหาพวกเขา เป็นค่าสำหรับคุณสมบัติ CSS object-fit และมีแนวโน้มที่จะสร้างความสับสนให้กับผู้ใช้ในหลาย ๆ กรณี

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

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

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

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

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

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

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