wordpress 5 Gutenberg 2019 กับการเปลี่ยนแปลงครั้งใหญ่

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

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

ซึ่งเมื่อนานมาแล้ว Matt Mullenweg หรือผู้ก่อตั้ง WordPress ได้เคยพูดใน Wordcamp (งานพบปะของคนที่ทำเว็บไซต์ด้วย WordPress) ว่า อยากจะเปลี่ยน WordPress Editor ให้สามารถจัดวางเนื้อหาได้ง่ายขึ้น หลังจากนั้นมา จึงได้ทดลองสร้างปลั๊กอินขึ้น เจ้าปลั๊กอินตัวนี้ถูกเรียกว่า Gutenberg โดยใช้ชื่อตาม Johannes Gutenberg ซึ่งได้รับยกย่องให้เป็น บิดาแห่งการพิมพ์ของโลก

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

เราลองมาดูกันค่ะว่ามีการเปลี่ยนแปลงอะไรบ้าง…

  • การสร้างโพส ในเวอร์ชั่นเก่าจะมีช่องว่าง ให้กรอกหัวเรื่อง , คำอธิบาย แต่ใน Gutenberg editor ได้พัฒนาให้เราใช้งานได้ง่ายและสะดวกขึ้นด้วย กล่อง หรือ block (บล็อค) ชนิดต่างๆ โดยทุกๆ ย่อหน้า (paragraph) , หัวข้อเรื่อง (heading) , ข้อความแบบลิสต์รายการ (list) , รูปภาพ (image) จะกลายเป็นบล็อคหมดเลยค่ะ
  • การย้ายตำแหน่งของแต่ละบล็อคก็ทำได้ง่ายมากๆ เพียงแค่เลื่อนเม้าส์ไปที่มุมบนซ้ายของบล็อค รูปเม้าส์ของเราจะกลายเป็นรูปมือ ทีนี้เราก็คลิกย้ายไปยังตำแหน่งไหนก็ได้ หรือหากกลัวว่าคลิกย้ายแล้วจะงง เราก็สามารถคลิกที่ปุ่มลูกศรเลื่อนลงหรือเลื่อนขึ้นก็ได้เช่นเดียวกันค่ะ
  • แต่ละบล็อคจะมีการตั้งค่าแบบ live ที่ทำให้เราไม่ต้องคอยคลิก save แล้วไปเช็คที่หน้าเว็บว่า ขนาดตัวอักษรใช้ได้ไหม สีตัวอักษรโอเคหรือไม่ แล้วยังจะสีพื้นหลังอีกล่ะ แถมยังมีปุ่มเปิด-ปิด สำหรับกำหนดว่าต้องการให้ตัวอักษรตัวแรกเป็นตัวใหญ่หรือไม่ ซึ่งช่วยลดเวลาการทำไปได้ส่วนนึงเพราะหากใช้เวอร์ชั่นเก่า เราจะต้องเสิชหาปลั๊กอินแล้วนำมาติดตั้งก่อนถึงจะกำหนดค่าได้
  • การใส่วิดีโอและ Social ต่างๆ จะกลายเป็นเรื่องง่ายไปตลอดกาล เพราะมีบล็อคสำหรับแทรก Social ต่างๆ มากถึง 34 บล็อค
  • การเว้นระยะห่างระหว่างบรรทัด (Spacer) สามารถทำได้ง่ายกว่าเวอร์ชั่นเก่าโดยไม่ต้องเขียนโค้ด CSS เพียงแค่เลือกบล็อคชื่อ Spacer ในหัวข้อ Layout Elements เราก็สามารถกำหนดระยะห่างที่เราต้องการได้อย่างง่ายดาย
  • เป้าหมายหลักอีกอย่างหนึ่งของ Gutenberg คือ ลดการใช้งาน shortcode และแทนที่ด้วยวิธีการใช้งานที่แสนจะง่ายดาย เพียงแค่เลือกประเภทบล็อคที่เราต้องการ
    ยกตัวอย่างเช่น สมมติเราต้องการสร้างปุ่ม (Button) ในโพสหรือบทความของเราให้ลิงก์ไปยังเว็บ google.com นั้น หากเป็นเวอร์ชั่นเก่าเราจะต้องใส่ shortcode แทรกลงในเนื้อหา ดังด้านล่าง
    [button link=”https://www.google.com” color=”#eaa7f2″
    align=”center”]Click Here[/button]
    แต่สำหรับ Gutenberg นั้น เราสามารถสร้างปุ่มได้ง่ายมากๆ ด้วยการเลือกบล็อคเป็น Buttons จากนั้นกรอกข้อความที่ต้องการให้แสดงบนปุ่มและกรอกลิงก์เป็นอันเสร็จสิ้น
  • ในเวอร์ชั่น 5.0 นี้มีฟิจเจอร์ที่น่าสนใจอีก 1 ฟิจเจอร์คือ การเก็บบล็อคสำหรับใช้ซ้ำ (Reusable blocks) เปรียบเสมือนการบันทึก block ที่เราได้เคยสร้างไว้ในโพสนึง แล้วเอามาใช้ซ้ำในโพสอื่นๆ เช่น block ลายเซ็นหรือคำลงท้ายในบทความ (อารมณ์แบบว่า ขี้เกียจทำแบบเดิมซ้ำๆ อ่ะค่ะ)
  •  การสร้างธีมที่กำหนดเอง หรือ custom theme กลายเป็นเรื่องที่ทำได้ง่ายขึ้นด้วยบล็อคชนิดต่างๆ ที่สามารถย้ายไปมาได้ด้วยการคลิกลากและวางเช่นเดียวกับโพส
  • เวอร์ชั่น 5.0 นี้ มีการปรับปรุง WordPress Rest API ที่จะช่วยให้นักพัฒนาเว็บสามารถสร้างฟิจเจอร์ให้หลากหลายมากขึ้นด้วยการส่งและดึงข้อมูลจากเว็บไซต์ให้ง่ายขึ้น อีกทั้งนักพัฒนายังสามารถสร้างแอพลิเคชั่นได้ง่ายๆ ด้วยการใช้แพลตฟอร์มเหมือนการใช้ framework
  • เมื่อเวอร์ชั่นใหม่มีการใช้งานตามที่ได้กล่าวไว้ในข้างต้น ปลั๊กอิน page builder อาจหายไปบางส่วนในช่วงแรกๆ เพราะระบบอาจจะไม่เข้ากันกับ Gutenberg ซึ่งเราคงต้องลุ้นกันต่อไปให้ปลั๊กอินเหล่านั้นอัพเดทระบบให้สามารถใช้ในเวอร์ชั่น 5.0 นี้ได้

อย่างไรก็ตาม หากเรายังไม่อยากใช้ Gutenberg ก็ไม่ต้องกังวลใจไปค่ะ เรายังคงสามารถใช้รูปแบบที่เราคุ้นเคยได้ด้วยการติดตั้งปลั๊กอิน Classic Editor ค่ะ