มีอะไรใหม่ใน WordPress Gutenberg Editor
เผยแพร่แล้ว: 2020-03-13หลังจากละทิ้ง Classic Editor แล้ว Gutenberg Editor ได้แนะนำวิธีใหม่ในการสร้างเนื้อหา จากคำปราศรัยของ Matt Mullenweg ผู้ร่วมก่อตั้ง WordPress ใน 2019 WordPress Camp US ชัดเจนว่าบล็อก Gutenberg คืออนาคตของ WordPress
Gutenberg กำลังอัปเดตอย่างรวดเร็ว ดังนั้น คุณสามารถปรับแต่งได้อย่างง่ายดายโดยไม่ต้องมีความรู้เชิงลึกเกี่ยวกับการออกแบบเว็บ ในปี 2020 มีการเปลี่ยนแปลงมากมาย ผู้มีส่วนร่วมมากกว่า 56 คนทำงานเพื่อการเปิดตัว Gutenberg ในปี 2020
คุณค้นพบพวกเขาทั้งหมดหรือไม่? เนื่องจากผู้ใช้ส่วนใหญ่ยังไม่รู้จักคุณลักษณะที่อัปเดตบางอย่าง เราสามารถมั่นใจได้ว่าไฮไลท์ใหม่จะมีประสิทธิภาพมากสำหรับไซต์ของคุณ
มาดำดิ่งลงไปในบทความเพื่อสำรวจการเปลี่ยนแปลงล่าสุดเหล่านี้ใน Gutenberg Editor และเรียนรู้วิธีใช้การเปลี่ยนแปลงเหล่านี้เพื่อประสบการณ์ที่ดียิ่งขึ้น
7+ อัปเดตใหม่ของ Gutenberg Editor
เราพบการอัปเดตเหล่านี้ในขณะที่กำลังแก้ไขเนื้อหาของเว็บไซต์ของเรา การค้นพบตัวเลือกใหม่ ๆ ในโปรแกรมแก้ไขที่คุณชื่นชอบนั้นค่อนข้างสนุก มาดูกันแบบด่วนๆ

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

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

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

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

ฟีเจอร์ใหม่นี้มีบทบาทสำคัญในการพัฒนาเนื้อหาบน WordPress คุณสามารถบันทึกบล็อกประเภทต่างๆ เพื่อใช้ในเนื้อหาที่เกี่ยวข้องอื่นๆ ดังนั้นจึงตั้งชื่อว่า Reusable Blocks

ดังนั้น การส่งออกและนำเข้าบล็อกหนึ่งบล็อกไปยังไซต์อื่นๆ ของคุณจึงเป็นเรื่องง่าย
ตัวอย่างเช่น สมมติว่าคุณได้สร้างหน้า Landing Page ที่มี Conversion สูง ดังนั้น ตอนนี้คุณสามารถบันทึกบล็อคและนำไปใช้ในหน้า Landing Page อื่นๆ ได้ และที่สำคัญที่สุด คุณต้องมีการดูแลการนำบล็อกกลับมาใช้ใหม่ ส่งออก ลบหรือแก้ไข
5. ปุ่ม (ใช้หลายปุ่มในแถว)

โดยปกติ เราสามารถเลือกปุ่ม CTA ได้เพียงปุ่มเดียว จะเกิดอะไรขึ้นถ้าเราใช้ปุ่มมากกว่าหนึ่งปุ่มติดต่อกัน? ดีคุณไม่ต้องรอมัน Gutenberg Editor ได้สร้างตัวเลือกใหม่โดยที่คุณสามารถเพิ่มปุ่ม CTA หลายปุ่มในบล็อกได้
6. การเพิ่มลิงค์โซเชียล

บล็อก Social Link เป็นเวอร์ชันล่าสุดของ Gutenberg ซึ่งต้องใช้เวลาหนึ่งสัปดาห์และผู้มีส่วนร่วม 45 คนในการอัปเดต มันถูกพบในรุ่นต่างๆ แต่ตอนนี้ไม่ได้อยู่ในโหมดทดลอง คุณสามารถใช้บล็อกที่เสถียรได้ตามความต้องการของคุณ
ดังนั้น การอัปเดตนี้จะช่วยให้คุณโปรโมตเพจ โปรไฟล์ หรือกลุ่มโซเชียลของคุณได้โดยตรงจากเนื้อหาของคุณ
7. เปลี่ยนสีของข้อความและบล็อก

ในรุ่นใหม่นี้มีผู้ร่วมให้ข้อมูลมากกว่า 51 คนทำงาน ในการอัปเดตนี้ คุณสามารถใช้ตัวเลือกสีที่น่าสนใจ ซึ่งจะช่วยเพิ่มเนื้อหาของคุณ
อย่างไรก็ตาม การลงสีข้อความนั้นง่ายกว่ามากในตอนนี้ เพียงเลือกข้อความที่คุณต้องการและระบายสีจากตัวเลือกการตั้งค่าสีทางด้านขวา ไม่เพียงแค่สีข้อความเท่านั้น แต่คุณยังสามารถเปลี่ยนสีบล็อกและบล็อกกลุ่มได้อีกด้วย
โบนัส – แป้นพิมพ์ลัด Gutenberg Editor
อย่างที่คุณทราบมีแป้นพิมพ์ลัดมากมายที่เราใช้ทุกวัน หากไม่มีทางลัดเหล่านี้ คุณจะไม่สามารถทำงานได้อย่างมีประสิทธิภาพ ในการอัพเดท Gutenberg มีชุดแป้นพิมพ์ลัดที่พร้อมใช้งานเพื่อให้งานของคุณง่ายขึ้น มาเรียนรู้ด้วยกัน
ใช้สแลช “/”
พิมพ์เครื่องหมายทับ “/” เพื่อเลือกตัวเลือกจากบล็อกที่ใช้ล่าสุด
CTRL + Shift + ALT + M
หากคุณคลิกแท็บเหล่านี้ทั้งหมด คุณจะเปลี่ยนไปใช้โปรแกรมแก้ไขโค้ด ละเลยกลับไปที่ตัวแก้ไขบล็อก คุณต้องทำเหมือนเดิมอีกครั้ง
>
สำหรับการเริ่มต้นใบเสนอราคาโดยตรง
พิมพ์ >
+ เว้นวรรค และนี่คือบล็อคใบเสนอราคาใหม่สำหรับคุณ มันไม่ง่ายเลยเหรอ?
##
สำหรับการเริ่มต้นหัวเรื่องทันที
พิมพ์ ##
+ เว้นวรรค และนี่คือบล็อกหัวเรื่องใหม่สำหรับคุณ
-
สำหรับการเริ่มต้นรายการ
พิมพ์ -
+ เว้นวรรค แล้วคุณจะเริ่มรายการ

นับถอยหลังครั้งสุดท้ายในการอัปเดตตัวแก้ไข Gutenberg
เส้นทางแรกของ Gutenberg Editor ไม่ราบรื่นเหมือนตอนนี้ นวัตกรรม กระบวนการปรับปรุง ส่วนประกอบ การสนับสนุน และความพยายามมากมายได้นำ Gutenberg มาที่นี่
การอัปเดตแต่ละครั้งจะช่วยให้ผู้ใช้สร้างเนื้อหาที่ทรงพลังได้อย่างง่ายดาย คุณสมบัติข้างต้นดูดีมากสำหรับเราและใช้งานได้จริง นอกจากนี้ เราได้พยายามจัดเตรียม Gif และภาพหน้าจอให้เพียงพอเพื่อให้คุณเข้าใจมากขึ้น คุณสามารถตรวจสอบคู่มือผู้ใช้ Gutenberg Block ของเราได้
นอกจากนี้ คุณสามารถรวม Elementor และ HappyAddons เข้ากับไซต์ของคุณเพื่อปรับปรุงประสบการณ์ Gutenberg
แจ้งให้เราทราบหากคุณรู้สึกมีปัญหาหรือไม่ทำงานตามคำแนะนำ เราจะพยายามตอบกลับในระหว่างนี้
ขอให้เป็นวันที่ดี!