WordPress Gutenberg Tutorial
เผยแพร่แล้ว: 2019-03-09หลังจากทศวรรษที่ได้รับความนิยมในฐานะ CMS ที่ใช้งานได้หลากหลายและใช้งานง่ายที่สุด WordPress ก็สามารถสร้างความประทับใจให้ผู้ใช้ด้วยการอัปเกรดทางเทคนิคบ่อยครั้ง ในเวอร์ชันล่าสุด 5.0 นั้น WordPress ได้เปิดตัวโปรแกรมแก้ไขภาพใหม่ “Gutenberg” เรามาทำความเข้าใจ Gutenberg และ Blocks กัน ระบบใหม่ทำงานอย่างไร? มันดีกว่าบรรณาธิการที่เรามีมาก่อนหรือไม่? เราจะไปที่ Gutenberg และบทช่วยสอนสั้น ๆ เพื่อช่วยให้คุณได้รับประโยชน์ทั้งหมดจากตัวแก้ไข Gutenberg
“กูเตนเบิร์ก” คืออะไร?
Matt Mullenweg ได้คิดค้นแนวทางใหม่ในการเปลี่ยนตัวแก้ไข WordPress แบบคลาสสิกที่ WordCamp Europe 2018 ซึ่งเรียกว่า "Gutenberg" ซึ่งมีความหมายว่าเป็นชื่อโครงการในขณะที่อยู่ระหว่างการพัฒนา เปิดตัวด้วย WordPress 5.0 โครงการ Gutenberg ถูกเรียกว่า "WordPress Editor" หรือ "Block Editor" เพื่อให้เฉพาะเจาะจงมากขึ้น เครื่องมือแก้ไขแบบคลาสสิกล้าสมัยไปเล็กน้อยตามแนวโน้มของเครื่องมือสร้างเว็บแบบลากและวางในปัจจุบัน ผลลัพธ์คือ WordPress Gutenberg และตัวแก้ไข WordPress ใหม่ทั้งหมด ซึ่งได้รับการออกแบบมาให้คล้ายกับเครื่องมือสร้างเว็บไซต์และเพจ
ธีมที่ใช้งานได้กับ Gutenberg
มีธีมให้เลือกหลายพันแบบ แต่หลายธีมล้าสมัยแล้ว นี่คือร้านค้าใหม่สุดเจ๋งบางส่วนที่เปิดตัวธีมสำหรับ Gutenberg
ปลั๊กอินที่ใช้งานได้กับ Gutenberg
มีปลั๊กอินมากมายในตลาด WordPress แต่ไม่ใช่ทุกปลั๊กอินที่จะทำงานร่วมกับตัวแก้ไข Gutenberg นี่คือบางส่วนที่ทำ
“บล็อค” คืออะไร?
บล็อกเป็นเพียงส่วนหนึ่งของเนื้อหา อาจเป็นข้อความย่อหน้า ไฟล์เสียง รูปภาพหรือแกลเลอรีรูปภาพ หรือแม้แต่วิดีโอ เป็นรากฐานของประสบการณ์การแก้ไข Gutenberg บล็อกใช้ในการสร้างโพสต์และหน้าเว็บ สิ่งที่ผู้ใช้มักบรรจุลงใน WordPress คือบล็อกมาตรฐานที่สร้างขึ้นใน Gutenberg และพร้อมใช้งานสำหรับไซต์ WordPress ใดๆ ที่ใช้ตัวแก้ไข Gutenberg Gutenberg ถูกสร้างขึ้นเพื่อให้โปรแกรมเมอร์สามารถขยายและขยายบล็อคที่มีอยู่ได้ บล็อกสามารถเพิ่มได้โดยใช้ปลั๊กอินหรือธีม ดังนั้น ผู้ใช้จึงมีสิทธิ์เข้าถึงบล็อกเพิ่มเติมแทนที่จะจำกัดเฉพาะบล็อกมาตรฐาน
การใช้ Gutenberg เป็นตัวแก้ไข WordPress
เมื่อคุณใช้ WordPress 5.0 คุณจะได้รับ “Block Editor” หรือ “Gutenberg Editor” ที่อบเข้ามาเป็นตัวแก้ไขข้อความเริ่มต้นสำหรับ 5.0 วันนี้เราจะช่วยให้คุณทำความคุ้นเคยกับตัวแก้ไขบล็อกใหม่ มาเริ่มกันเลย อันดับแรก การสร้างโพสต์ใหม่ตามปกติ ให้กด “เพิ่มใหม่” ใต้โพสต์ ตอนนี้คุณมีบล็อกใหม่ให้ใช้งานแล้ว
มันดูแตกต่างกันมากใช่มั้ย? ไม่มีแถบเครื่องมือปรากฏขึ้นจากตัวแก้ไขแบบคลาสสิก มาทำความคุ้นเคยกับคุณสมบัติและปุ่มเหล่านั้นกัน
ส่วนบน:
เมื่อใช้ส่วนบนสุดนี้ คุณสามารถเพิ่มบล็อกใหม่และดำเนินการต่างๆ เช่น เลิกทำและทำซ้ำการเปลี่ยนแปลงบล็อกใดๆ คุณยังสามารถดูข้อมูลโครงสร้างเนื้อหาของคุณ เช่น จำนวนคำ หัวเรื่อง ย่อหน้าและบล็อก คุณยังสามารถนำทางไปรอบๆ บล็อคโดยใช้ปุ่ม “i”
ฟังก์ชันการแก้ไขโพสต์พื้นฐานบางอย่าง เช่น บันทึกเป็นฉบับร่าง ดูตัวอย่างโพสต์ และเผยแพร่โพสต์ ได้รับการรองรับในส่วนบนสุด ไอคอนล้อเฟืองแสดงการตั้งค่าที่มองเห็นได้ในแถบด้านข้างขวา ที่นี่คุณสามารถสลับระหว่างมุมมองการตั้งค่า "เอกสาร" และ "บล็อก"
มุมมองส่วนของเอกสารคล้ายกับตัวแก้ไขแบบคลาสสิกมาก นอกจากนี้ คุณยังสามารถเลือกสถานะและการมองเห็น หมวดหมู่ แท็ก รูปภาพคุณสมบัติ และแอตทริบิวต์ได้อีกด้วย มุมมองส่วนของบล็อกช่วยให้คุณเปลี่ยนการตั้งค่าของบล็อกใดก็ได้เมื่อเพิ่มเข้าไปแล้ว ฟังก์ชันนี้ทำให้ง่ายต่อการเปลี่ยนการตั้งค่าสำหรับบล็อกใดๆ และเปลี่ยนคุณสมบัติต่างๆ เช่น ขนาดแบบอักษร ดรอปแคป และอื่นๆ อีกมากมาย คุณสามารถเพิ่มสีพื้นหลังสำหรับแต่ละบล็อกและแม้กระทั่งการเปิดใช้งานคลาส CSS เพิ่มเติมสำหรับแต่ละบล็อกแยกกันได้จากที่นี่
สุดท้าย จุดสามจุดที่อยู่ในส่วนบนสุดจะแสดงการตั้งค่าเพิ่มเติม จากที่นี่ คุณสามารถปรับแต่งรูปลักษณ์ของตัวแก้ไขบล็อกของคุณได้ คุณสามารถเลือกมุมมองเครื่องมือของบล็อก คุณสามารถเลือกได้ระหว่าง "โปรแกรมแก้ไขภาพ" และ "โปรแกรมแก้ไขโค้ด" นอกจากนี้ยังมีเครื่องมือบางอย่างในการจัดการบล็อกที่นำกลับมาใช้ใหม่ การสร้างแป้นพิมพ์ลัด และการคัดลอกเนื้อหา
การเพิ่มบล็อค
แนวคิดหลักของตัวแก้ไขใหม่คือการเพิ่มบล็อก ดังที่ได้กล่าวไว้ก่อนหน้านี้ บล็อคเป็นส่วนหลักของตัวแก้ไขบล็อกใหม่ ดูที่ด้านซ้ายบนของหน้าแก้ไข นี่จะให้เมนูแบบเลื่อนลงซึ่งคุณสามารถเลือกประเภทของบล็อกที่ต้องการซึ่งออกแบบมาเพื่อวัตถุประสงค์เฉพาะ เมื่อใช้แถบค้นหา คุณจะพบบล็อกที่ตรงกับความต้องการของคุณ
นอกจากนี้ ให้เลื่อนลงมาที่เมนูแล้วคุณจะเห็นบล็อคเพิ่มเติมตามฟังก์ชันพื้นฐานของพวกมัน สิ่งเหล่านี้คือบล็อกทั่วไป การจัดรูปแบบ วิดเจ็ต และการฝัง ฯลฯ เพียงเลือกบล็อกที่เหมาะสมที่คุณต้องการด้วยการคลิกเพียงครั้งเดียว
ถัดไป คุณจะรู้จักแถบเครื่องมือขนาดเล็กเมื่อคุณเริ่มเพิ่มเนื้อหาในบล็อกของคุณ ฟังก์ชันของแถบเครื่องมือนี้ขึ้นอยู่กับประเภทของบล็อกที่คุณเลือก แถบเครื่องมือเหล่านี้มีไว้เพื่อดำเนินการแก้ไขการจัดรูปแบบเนื้อหา เช่น การจัดแนว ลักษณะ การเชื่อมโยง และอื่นๆ ปุ่มเปลี่ยนประเภทบล็อกอยู่ที่นั่นเพื่อเปลี่ยนรูปแบบบล็อกปัจจุบัน ตัวอย่างเช่น คุณสามารถเปลี่ยนบล็อกย่อหน้าเป็นหัวเรื่อง บล็อกที่จัดรูปแบบไว้ล่วงหน้า รายการ ใบเสนอราคา หรือ Verse สามจุดสุดท้ายจะมีตัวเลือกเพิ่มเติมให้คุณ เช่น ซ่อนการตั้งค่าบล็อก ทำให้ซ้ำกัน แก้ไขเป็น HTML เพิ่มลงในบล็อกที่นำกลับมาใช้ใหม่ได้ และแน่นอนว่าจะลบบล็อกออก คุณยังสามารถแทรกบล็อคเพิ่มเติมได้โดยใช้ตัวเลือกแทรกก่อนและแทรกหลัง สิ่งนี้มีประโยชน์เมื่อคุณต้องการเพิ่มเนื้อหาหรือทำการแก้ไขอย่างรวดเร็ว ขึ้นอยู่กับตัวเลือกที่คุณเลือก สิ่งนี้จะเพิ่มบล็อกก่อนบล็อกที่คุณเลือกหรือหลังบล็อก ทั้งนี้ขึ้นอยู่กับตัวเลือกที่คุณเลือก ระบบนี้ใช้งานง่ายมากและจะสมเหตุสมผลทันที
การเปลี่ยนการตั้งค่าบล็อก
ทุกบล็อกสามารถปรับแต่งให้ตรงตามความต้องการของคุณได้ เพียงคลิกที่บล็อกที่คุณต้องการปรับแต่ง คุณจะได้รับขอบเขตต่างๆ ซึ่งคุณสามารถปรับแต่งบล็อกของคุณได้ที่แถบด้านข้างทางขวา จำไว้ว่าคุณสามารถแสดงหรือซ่อนตัวเลือกนี้ได้โดยใช้ล้อเฟืองที่ส่วนบนหรือแถบเครื่องมือของบล็อกนั้นๆ การตั้งค่าบล็อกยังขึ้นอยู่กับประเภทของบล็อกที่คุณเลือก ตัวอย่างเช่น หากคุณใช้บล็อกย่อหน้า การตั้งค่าบล็อกจะช่วยให้คุณสามารถเลือกขนาดแบบอักษร ประเภทแบบอักษร หรือสีพื้นหลังได้ คุณจะมีตัวเลือกทั้งหมดเพื่อปรับแต่งบล็อกของคุณที่ปกติแล้วคุณคิดว่าจะอยู่ที่นั่น Gutenberg นั้นเป็นมิตรกับผู้ใช้มากและง่ายสำหรับนักพัฒนาใหม่ที่จะรับ
สรุปการสอน WordPress Gutenberg
เราหวังว่าบทช่วยสอนสั้นๆ เกี่ยวกับ WordPress Gutenberg นี้จะช่วยให้คุณคุ้นเคยกับตัวแก้ไขใหม่ที่มาพร้อมกับ WordPress 5.0 เราเชื่อมั่นว่าหลังจากอ่านคู่มือนี้แล้ว คุณจะไม่ใช่มือใหม่กับ “Gutenberg” อีกต่อไป ตัวแก้ไขบล็อกใหม่ไม่เพียงแต่ใช้งานง่าย แต่ยังมีประสิทธิภาพเนื่องจากสามารถสร้างเว็บไซต์ได้อย่างรวดเร็วด้วยตัวเลือกมากมาย การสร้างบล็อกแบบกำหนดเองและการใช้เครื่องมือเพื่อปรับแต่งรูปลักษณ์เป็นคุณสมบัติที่ทรงพลังของตัวแก้ไขบล็อกนี้ นอกจากนี้ยังมีอินเทอร์เฟซที่ใช้งานง่ายเพื่อเพิ่มบล็อกใหม่และเพิ่มเนื้อหา หากคุณพบว่าคุณชอบตัวแก้ไขแบบเก่ามากกว่า และไม่ชอบตัวแก้ไขแบบใหม่ ก็ไม่ต้องกังวลไป คุณสามารถเปลี่ยนกลับไปใช้ตัวแก้ไขแบบคลาสสิกได้ทุกเมื่อ นี่เป็นสิ่งที่ดีที่สุดของทั้งสองโลกและจะอนุญาตให้ผู้คนใช้ตัวแก้ไขที่ทำให้พวกเขามีประสิทธิผลมากที่สุด