การอัปเดตหลักใหม่ของ Elementor ได้รับการเผยแพร่แล้ว เราย้ายจากเวอร์ชัน 2.x เป็น เวอร์ชัน 3.0 เวอร์ชันใหม่นี้มาพร้อมกับวิธีใหม่ในการสร้างเว็บไซต์โดยใช้ WordPress และ Elementor เราจะพยายามแปลงคุณลักษณะใหม่เหล่านี้
อะไรคือส่วนเสริมหลักใน Elementor 3.0?
Elementor 3.0 มาพร้อมกับส่วนเพิ่มเติม 3 ส่วน ได้แก่: คุณสมบัติระบบการออกแบบ ตัวสร้างธีมใหม่ และการปรับปรุงประสิทธิภาพที่สำคัญ
คุณสมบัติระบบการออกแบบ
คุณเคยสงสัยหรือไม่ว่าบริษัทใหญ่ๆ จะทำผลงานได้ดีเพียงใด ไม่ว่าพวกเขาจะเข้าสู่แพลตฟอร์มใด ? สิ่งที่พวกเขาสร้างขึ้นทั้งหมดนั้นดูสอดคล้องกันและมีการออกแบบที่เหมือนกัน เป็นไปได้ด้วยชื่อ " Design System " ตาม UnxDesign.cc ระบบการออกแบบคือ:
แหล่งเดียวของความจริงที่จัดกลุ่มองค์ประกอบทั้งหมดที่จะทำให้ทีมสามารถออกแบบ ตระหนัก และพัฒนาผลิตภัณฑ์ได้ ดังนั้น ระบบการออกแบบ ไม่ใช่สิ่งที่ส่งมอบ แต่เป็นชุดของสิ่งที่ส่งมอบ มันจะพัฒนาอย่างต่อเนื่องด้วยผลิตภัณฑ์ เครื่องมือ และเทคโนโลยีใหม่
UX Collective
การนำระบบการออกแบบไปใช้ ทำให้ทั้งทีมของคุณมีความสอดคล้องกันในภาษาการออกแบบหนึ่งภาษา และยังปฏิวัติวิธีการทำงานของทีมของคุณและรับประกันว่าเวิร์กโฟลว์จะเร็วขึ้น
สร้างเว็บไซต์ที่น่าทึ่ง
ด้วย Elementor ตัวสร้างหน้าฟรีที่ดีที่สุด
เริ่มเลยคุณสมบัติระบบการออกแบบของ Elementor 3.0 ประกอบด้วย:
- Global Colours
- แผงการตั้งค่าไซต์ใหม่
- แบบอักษรสากล
มาดูกันว่าวิธีนี้จะช่วยให้คุณสร้างเว็บไซต์ระดับมืออาชีพได้ดียิ่งขึ้นได้อย่างไร
Global Colours
Elementor 3.0 เพิ่มวิธีใหม่ในการทำงานกับสีของไซต์ วิธีการใหม่นั้นมีชื่อว่า Global Colours
Global Colours ช่วยให้คุณเปลี่ยนสีจากที่เดียว และอัปเดตสีนั้นทุกที่ที่ใช้
คุณจะเริ่มเลือก สีสากล พื้นฐานสำหรับเว็บไซต์ของคุณ จากนั้นไปที่สไตล์สีใดก็ได้ใน Elementor และกำหนดให้เป็นหนึ่งในสี่สี โปรดทราบว่าคุณสามารถเพิ่มสีที่กำหนดเองได้มากเท่าใน Global List
ตอนนี้ตัวแปร CSS เข้ามาแล้ว กลับไปที่ Global Colours และเปลี่ยนสีใดสีหนึ่ง โครงร่างสีทั้งไซต์ของคุณเปลี่ยนไปตาม Global Color ใหม่ คุณเคยมีประสบการณ์บางอย่างที่ง่ายกว่านี้หรือไม่?
คุณยังสามารถออกแบบ Global Color ที่แตกต่างจากภายในอินพุตควบคุมหรือสร้าง Global Color ใหม่ ทั้งหมดโดยใช้ตัวเลือกสีเดียวกันภายในอินพุตควบคุม
การตั้งค่าไซต์
การสร้างการตั้งค่าการออกแบบครั้งแรกสำหรับเว็บไซต์ใช้เวลานาน คุณจะต้องเล่นกลระหว่างโค้ดธีม, Customizer, functions.php นั่นเป็นเหตุผลเพียงพอที่จะปรับอาการปวดหัวของคุณ
การตั้งค่าไซต์ใหม่จะแสดงเครื่องมือกำหนดค่าต่างๆ ด้วยวิธีนี้ คุณจะทำวิทยานิพนธ์ทั้งหมดต่อจากที่เดียว
ในการเริ่มต้น ภายในหน้าใดๆ ที่คุณแก้ไขด้วย Elementor ให้คลิกที่ไอคอนด้านซ้ายบนที่แผงด้านซ้าย ที่จะทำให้คุณเปลี่ยนไปใช้แผงการตั้งค่าส่วนกลาง
ภายในแผงการตั้งค่าส่วนกลางนั้นคุณจะพบ:
- เค้าโครง: เพื่อกำหนดการตั้งค่าเค้าโครงเริ่มต้นของ Elementor เช่น ความกว้างของเนื้อหาเริ่มต้นหรือเค้าโครงหน้าเริ่มต้น
- เอกลักษณ์ของไซต์:Â ปรับแต่งข้อมูลประจำตัวแบบข้ามไซต์ของคุณ เช่น โลโก้ ชื่อเรื่อง แท็กไลน์ และแม้แต่ Favicon
- รูปแบบธีม:ปรับแต่งองค์ประกอบ HTML ที่ไม่เกี่ยวข้องกับ Elementor (ปกติกำหนดโดยธีม) สำหรับฟิลด์ Typography ปุ่ม และฟอร์ม
- ไลท์บ็อกซ์:Â กำหนดสไตล์เริ่มต้นของ Elementor Lightboxes
- Global Colours and Fonts: ให้คุณกำหนดค่าสีและแบบอักษรสากลที่ใช้กับเว็บไซต์ของคุณ
แบบอักษรสากล
สีและการพิมพ์เป็นส่วนหนึ่งขององค์ประกอบการสร้างของเว็บไซต์ใดๆ การใช้ตรรกะเดียวกันกับคุณลักษณะ Global Colours นี่เป็นวิธีการใหม่ในการทำงานกับสไตล์ข้อความของไซต์ของคุณ
ด้วย Global Fonts การตั้งค่าตัวพิมพ์ทั้งหมดสามารถนำไปใช้ได้ทั่วโลก ตอนนี้คุณตั้งค่าตัวพิมพ์ของไซต์ได้ทั่วโลกแล้ว รวมถึง Font Family, ขนาดและสเกลของ Font, Font Weight, Font Transform, Font Style, Font Decoration, Line Height, Letter Spacing และแม้แต่ Responsive Settings คุณยังสามารถตั้งค่าเหล่านี้ให้กับทุกวิดเจ็ตที่มีข้อความ และปรับแต่ง Global Fonts ของคุณเองได้
ด้วยการออกแบบตัวอักษรอย่างถูกต้อง คุณจะสามารถใช้การเปลี่ยนแปลงเหล่านี้ได้ทั่วโลก
ทั้งไซต์แสดงภาพและจัดระเบียบในที่เดียว
ในขณะที่ Theme Builder ที่ รู้จักกันดีได้กลายเป็นผู้นำอุตสาหกรรมในแง่ของการมีภาพรวมทั้งหมดเกี่ยวกับการออกแบบเว็บไซต์ UI ใหม่นี้ไปไกลกว่านั้นอีก ตัวสร้างธีมใหม่จะแสดงภาพรวมของทั้งเว็บไซต์ด้วยวิธีที่เข้าใจง่าย
ตัวสร้างธีมนั้นให้ภาพรวมของไซต์ ซึ่งรวมถึงส่วนต่างๆ ของไซต์: ส่วนหัว ส่วนท้าย เทมเพลตเพจส่วนกลาง เทมเพลตโพสต์ส่วนกลาง และอื่นๆ ทุกส่วนของเว็บไซต์สามารถดูตัวอย่างได้ ทำให้การออกแบบเว็บไซต์ที่สมบูรณ์ง่ายขึ้นมาก
การปรับปรุงประสิทธิภาพ
ในขณะที่แอปพลิเคชันเติบโตขึ้น เห็นได้ชัดว่านักพัฒนาซอฟต์แวร์ควรใส่ใจกับประสิทธิภาพการทำงาน การอัปเดตที่ทำใน Elementor 3.0 ทำขึ้นเพื่อให้แน่ใจว่ามีโครงสร้างพื้นฐานของโค้ดที่ดีซึ่งส่งผลให้มีการปรับปรุงประสิทธิภาพที่โดดเด่น
มีการล้างองค์ประกอบ DOM จำนวนมาก ซึ่งทำให้ Elementor แสดงผลเร็วขึ้น สิ่งนี้ควรปรับปรุงการจัดอันดับความเร็วหน้าเว็บของคุณและประสบการณ์โดยรวมสำหรับผู้ใช้ในเว็บไซต์ของคุณ
มีอะไรเปลี่ยนแปลงในแง่ของความเร็วหน้า?
Elementor 3.0 ให้การปรับปรุงที่สำคัญสำหรับกระบวนการแสดงผลฝั่งเซิร์ฟเวอร์และวิธีที่ Elementor แสดงค่า CSS แบบไดนามิก สิ่งนี้ทำให้คุณสามารถรวมองค์ประกอบและค่าไดนามิกไว้ในเว็บไซต์ของคุณ ตัวอย่างเช่น คุณสามารถสร้างเทมเพลตสำหรับโพสต์ในไซต์ และตัดสินใจว่าต้องการแสดงรูปภาพเด่นของโพสต์แต่ละรายการเป็นพื้นหลังหลังชื่อโพสต์
ในพื้นหลัง เมื่อ Elementor เตรียมโพสต์ที่จะส่งไปยังเบราว์เซอร์ มันจะแยกวิเคราะห์โพสต์เพื่อหาค่าไดนามิก ดึงข้อมูลเหล่านั้น และหากมีค่า CSS ใด ๆ ก็จะพิมพ์ CSS นั้นออกมา
ด้วย Elementor 3.0 เวลาที่ใช้ในกระบวนการนี้ลดลงอย่างมาก ขอบคุณค่าไดนามิกที่เก็บไว้สำหรับแต่ละโพสต์ของคุณ เมื่อรายการนั้นถูกจัดเก็บแล้ว เมื่อใดก็ตามที่มีคนเยี่ยมชมโพสต์ Elementor จะไปที่รายการนี้โดยตรง ซึ่งจะทำให้กระบวนการเร็วขึ้น ค่าไดนามิกที่ได้รับผลกระทบจากการปรับให้เหมาะสมนี้รวมถึงภาพพื้นหลัง สี และอื่นๆ อีกมากมาย การปรับปรุงนี้ทำให้การโหลดเซิร์ฟเวอร์ลดลงอย่างเห็นได้ชัด
สรุปเกี่ยวกับ Elementor 3.0 Update
ดังที่เราได้กล่าวไว้ข้างต้น เวอร์ชันนี้มาพร้อมกับสินค้าที่น่าสนใจซึ่งจะส่งผลต่อการทำงานประจำวันของคุณอย่างแท้จริง เราเคยผ่าน :
คุณสมบัติระบบการออกแบบ ซึ่งช่วยให้คุณทำงานอย่างสม่ำเสมอและมีประสิทธิภาพมากขึ้น
Theme Builder ใหม่ เป็นเครื่องมือแสดงภาพที่ทรงพลังสำหรับการจัดการทุกส่วนของเว็บไซต์ของคุณจากที่เดียว
การปรับปรุงประสิทธิภาพ Â เพื่อประสบการณ์การใช้งานที่ดียิ่งขึ้น
Elementor 3.0 จะนำคุณไปสู่ความล้ำหน้าในฐานะผู้สร้างเว็บมืออาชีพอย่างแน่นอน หากคุณยังไม่ได้อัปเกรด ให้อัปเกรดทันทีเป็น Elementor Pro คุณควรพิจารณาอ่านโพสต์ของเราเพื่ออธิบายว่าทำไม Elementor จึงเป็น Page Builder ฟรีที่ดีที่สุดบน WordPress
