Elementor 3.16 – ประสิทธิภาพเร็วขึ้น การออกแบบที่ยืดหยุ่น และเข้าถึงได้มากขึ้น

เผยแพร่แล้ว: 2023-09-19

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

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

ความยืดหยุ่นในการออกแบบสูงสุด – เปิดใช้งานคอนเทนเนอร์ Flexbox บนเว็บไซต์ใหม่

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

นอกจากนี้ Flexbox Containers ยังรองรับวิดเจ็ตที่ซ้อนกัน ซึ่งหมายความว่าคุณสามารถวางวิดเจ็ตในพื้นที่เนื้อหาของ Carousel, Menu, Tabs และ Accordion Widgets ตัวอย่างเช่น คุณสามารถใช้ Accordion Widget เพื่อสร้างเลย์เอาต์ที่ซับซ้อนซึ่งประกอบด้วยแบบฟอร์มติดต่อไว้ในรายการหนึ่ง และ Google Maps Widget ในอีกรายการหนึ่ง

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

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

คำนึงถึงช่องว่างระหว่างองค์ประกอบ – การควบคุมช่องว่างที่อัปเกรดแล้ว

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

ขอแนะนำวิดเจ็ต Grid Container

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

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

เร่งความเร็วเว็บไซต์ของคุณด้วย TTFB ที่เร็วขึ้น

เวอร์ชัน 3.16 ปรับปรุงเวลาในการโหลดไบต์แรก (TTFB) 5-20% บนไซต์ที่สร้างด้วย Elementor Core และสูงสุด 40% บนไซต์ที่สร้างด้วย Elementor Pro ขึ้นอยู่กับความซับซ้อนของเพจของคุณ สิ่งนี้จะช่วยให้ผู้เยี่ยมชมของคุณได้รับประสบการณ์ที่รวดเร็วและราบรื่นยิ่งขึ้น โดยนำเสนอเนื้อหาของคุณเร็วกว่าที่เคย การปรับปรุงประสิทธิภาพส่วนหน้าอย่างมากทำได้โดยการปรับเปลี่ยนเงื่อนไขการแสดงผลภายในตัวแก้ไข การปรับเปลี่ยนเหล่านี้ปรับปรุง Time to First Byte (TTFB) ซึ่งเป็นหน่วยวัดหลักสำหรับการวัดเวลาการตั้งค่าการเชื่อมต่อและการตอบสนองของเว็บเซิร์ฟเวอร์

การปรับปรุงการเข้าถึง

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

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

อัปเดตวิดเจ็ตเมนูและแท็บ

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

หมายเหตุ: การอัปเดตนี้จะนำไปใช้กับวิดเจ็ตเมนูและแท็บที่มีอยู่ และอาจหยุดการออกแบบชื่อในวิดเจ็ตนี้หากใช้ CSS แบบกำหนดเองกับวิดเจ็ตเหล่านั้น

ปรับปรุงการทำงานร่วมกันด้วยบันทึกย่อในแถบด้านบน

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

ทำให้เว็บไซต์ของคุณเร็วขึ้น ยืดหยุ่นขึ้น และเข้าถึงได้

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

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

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