Gutenberg จะเปลี่ยน WordPress อย่างไร

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

Gutenberg บล็อก

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

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

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

บรรณาธิการ Gutenberg

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

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

แม้ว่ามันจะให้มุมมองเนื้อหาของคุณแบบ WYSIWYG ที่ดี แต่ Gutenberg ก็ยังคงเป็นผู้สร้างแบ็กเอนด์ มันมีปุ่มแสดงตัวอย่างเช่นเดียวกับตัวแก้ไขแบบคลาสสิก คุณสามารถแก้ไขด้วย Visual Editor หรือ Code Editor

เพจและโพสต์ที่สร้างด้วยโปรแกรมแก้ไขแบบคลาสสิก

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

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

ปลั๊กอิน Gutenberg

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

ทางลาด Gutenberg

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

Gutenberg กับ Divi

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

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

หากคุณเลือกที่จะสร้างเพจ มันจะมีตัวเลือกเทมเพลต พาเรนต์ และลำดับ รวมถึงการตั้งค่าเพจ Divi สำหรับเลย์เอาต์และเพื่อซ่อนการนำทางก่อนเลื่อน

เมื่อคุณเลือกที่จะสร้างด้วย Divi Builder คุณจะเห็น Visual Builder ปกติ

ทำการเลือกและสร้างตามปกติ Divi Visual Builder ทำงานเหมือนกับตอนนี้ทุกประการ

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

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

ในตัวอย่างนี้ ฉันได้เปิดเนื้อหาคลาสสิก เพิ่มส่วนหัวและบล็อกคำพูด จากนั้นจึงแก้ไขหน้าด้วย Divi Builder

ยี่สิบเก้า

ทุกๆ ปี ยกเว้นปี 2018 (พวกเขายุ่งอยู่กับการพัฒนา Gutenberg) ธีมใหม่จะจัดเตรียมโดย Automattic เพื่อช่วยแสดงคุณลักษณะใหม่ล่าสุดและทิศทางการออกแบบของ WordPress WordPress 5.0 จะมีธีมใหม่ที่เรียกว่า Twenty Nineteen ซึ่งออกแบบมาโดยเฉพาะสำหรับ Gutenberg เป็นธีมบล็อกแบบมินิมอลที่ขับเคลื่อนด้วยการพิมพ์ โดยมีสไตล์ส่วนหน้าและส่วนหลัง

สิ้นสุดความคิด

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

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

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

Gutenberg มีข้อดีบางประการ เราจะควบคุมเลย์เอาท์ในเนทีฟ WordPress ได้มากขึ้น ขณะนี้เรามีการควบคุมมากมายด้วยธีมและปลั๊กอินของตัวสร้าง แต่ด้วย Gutenberg เรามีการควบคุมในระดับสูงโดยไม่ต้องใช้ผลิตภัณฑ์ของบุคคลที่สาม เราจะต้องใช้ปลั๊กอินน้อยลง คุณลักษณะบางอย่างที่เราใช้ปลั๊กอินตามปกติมีอยู่ใน Gutenberg

สำหรับผู้ใช้ Divi ให้คุ้นเคยกับการใช้ Visual Builder Elegant Themes ได้ทำการปรับปรุงมากมายสำหรับ Visual Builder และมันเป็นตัวเลือกที่ดีกว่าระหว่างตัวสร้างส่วนหลังและส่วนหน้า สำหรับการเปรียบเทียบตัวสร้างส่วนหลังและส่วนหน้า โปรดดูบทความ Divi Space ตัวสร้าง Divi: ส่วนหลังเทียบกับส่วนหน้าและข้อดีของแต่ละส่วน

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

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

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