ไฮไลท์ปลั๊กอิน Divi – Divi Switch

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

ในบทความนี้ เราจะมาดู Divi Switch ใหม่และให้ความสนใจเป็นพิเศษกับชุดฟีเจอร์ที่อัปเดต

การติดตั้ง Divi Switch

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

Divi Switch Dashboard

Divi Switch ได้รับการออกแบบใหม่และการตั้งค่าทั้งหมดได้ย้ายจากตำแหน่งที่แยกต่างหากในเมนูผู้ดูแลระบบไปยังหน้าตัวเลือกธีม Divi สวิตช์เองถูกแจกจ่ายในแท็บย่อยภายใต้แท็บ "สวิตช์ Divi" ใหม่ในตัวเลือกธีม Divi

สวิตช์แต่ละอันมีชื่อ คำอธิบายสั้นๆ และสวิตช์ปิดเงาที่ตั้งค่าเริ่มต้นเป็น "ปิดใช้งาน" หากคุณต้องการเปิดใช้งานเอฟเฟกต์ เพียงคลิกที่สวิตช์แล้วสวิตช์จะสลับเป็น "เปิดใช้งาน" มันจะเปลี่ยนเป็นสีน้ำเงินเพื่อแสดงว่าเปิดใช้งานแล้ว

หากต้องการดูคำอธิบายคุณลักษณะ ให้เลือกเครื่องหมายคำถามที่ปรากฏทางด้านขวาเมื่อคุณวางเมาส์เหนือเอฟเฟกต์

ลองดูหลายแท็บและดูว่ามันทำอะไรได้บ้าง

หัวข้อ

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

การปรับแต่งโลโก้

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

โลโก้ต่าง ๆ บน Scroll

หากต้องการแสดงโลโก้ใหม่บนแถบเลื่อน ให้อัปโหลดโลโก้ในหน้าจอการตั้งค่า โลโก้สำรองจะปรากฏขึ้นเมื่อผู้เยี่ยมชมเลื่อน

โลโก้เฉพาะหน้า

ด้วยโลโก้เฉพาะหน้า คุณไม่ จำกัด เพียงโลโก้เดียวบนเว็บไซต์ของคุณ คุณสามารถมีโลโก้ได้มากเท่าที่คุณต้องการ และช่วยให้คุณควบคุมได้ว่าโลโก้ใดจะแสดงบนหน้าใด

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

ตัวอย่างนี้แสดงหน้าต่างๆ โดยแต่ละหน้าจะแสดงรูปแบบต่างๆ บนโลโก้ของเว็บไซต์

เมนูเต็มหน้าจอ

ส่วนหัวยังมีการปรับแต่งเมนูหลายอย่าง สำหรับตัวอย่างนี้ ฉันได้เปลี่ยนข้อความเมนูแฮมเบอร์เกอร์และเลือกเลย์เอาต์สำหรับเมนูเต็มหน้าจอ

นี่คือเมนูแฮมเบอร์เกอร์ที่มีข้อความใหม่

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

ส่วนท้าย

แท็บส่วนท้ายช่วยให้คุณลบสัญลักษณ์แสดงหัวข้อย่อย ซ่อนส่วนท้ายด้านล่าง หยุดส่วนท้ายไม่ให้ลอย และแทนที่ส่วนท้ายด้วยเค้าโครง Divi

เลย์เอาต์นี้ถูกเพิ่มไปยังส่วนท้ายของทุกหน้าโดยการเลือกในแท็บส่วนท้าย

เนื้อหาหลัก

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

ตัวโหลดล่วงหน้า

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

นี่คือตัวอย่างลักษณะของตัวโหลดล่วงหน้าบนเว็บไซต์ในขณะที่กำลังโหลดหน้า

Custom 404 และหน้าการบำรุงรักษาพร้อมเลย์เอาต์

คุณลักษณะเหล่านี้ทำให้คุณสามารถเลือกหน้าการบำรุงรักษาและหน้า 404 จากรายการหน้าของคุณ ซึ่งหมายความว่าคุณสามารถสร้างหน้าโดยใช้เค้าโครงที่คุณสร้างหรือนำเข้าไปยังไลบรารี Divi

เพื่อช่วยคุณในเรื่องนี้ Divi Switch ได้รวมแพ็คเลย์เอาต์หน้าการบำรุงรักษา 404 ระดับพรีเมียมที่มี 10 เลย์เอาต์ที่ออกแบบไว้ล่วงหน้าซึ่งสามารถปรับแต่งและตั้งค่าได้อย่างง่ายดายโดยค่าเริ่มต้น อยู่ในรูปแบบ JSON ภาพด้านบนเป็นหนึ่งใน 404 หน้า

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

มือถือ

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

กระทู้

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

นี่คือการสลับแบบปิด โดยจะอยู่ที่ด้านล่างของโพสต์โดยปกติความคิดเห็นจะปรากฏ

คลิกเพื่อเปิดและดูความคิดเห็น นี่คือแบบฟอร์มความคิดเห็น WordPress มาตรฐาน

หากคุณเพิ่มโมดูลความคิดเห็น Divi ให้กับเลย์เอาต์ของคุณ คุณสามารถกำหนดสไตล์ด้วยการตั้งค่าโมดูล มันยังคงอยู่ในปุ่มสลับและปิดโดยค่าเริ่มต้น

หอจดหมายเหตุ

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

นี่คือตัวอย่างหน้าผู้เขียนที่เปิดใช้งานสวิตช์เก็บถาวรทั้งหมด

บูรณาการ

แท็บ Integration ช่วยให้คุณแทรกเค้าโครง Divi ลงในตำแหน่งเฉพาะ รวมถึงก่อนเนื้อหาหลัก หลังเนื้อหาหลัก และก่อนเนื้อหาโพสต์ เลือกเค้าโครงจากรายการดรอปดาวน์

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

ขั้นสูง

แท็บขั้นสูงช่วยให้คุณอัปโหลดกราฟิกแบบเวกเตอร์ที่ปรับขนาดได้ (SVG) เพื่อให้โลโก้ ไอคอน และภาพอื่นๆ คมชัดขึ้น เนื่องจาก WordPress บล็อก SVG โดยค่าเริ่มต้น นี่เป็นวิธีที่ยอดเยี่ยมในการใช้รูปแบบรูปภาพนี้กับ Divi

นำเข้าส่งออก

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

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

เครื่องมือปรับแต่งธีม

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

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

ในตัวอย่างนี้ ฉันกำลังปรับปุ่มกลับไปด้านบนให้ตรงกับเลย์เอาต์ คุณสามารถปรับขนาดไอคอน รัศมี ตำแหน่ง สีพื้นหลัง สีไอคอน และสีโฮเวอร์ได้

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

ใบอนุญาต

Divi Switch มีใบอนุญาตให้เลือกสามแบบ:

• ไซต์เดียว – $24
• 3 ไซต์ – $50
• ไม่จำกัดไซต์ – $96

Divi Switch ยังมีอยู่ในแผนสมาชิก Divi Space

จบความคิด

ฉันประทับใจกับคุณสมบัติใหม่ใน Divi Switch ไม่ต้องวางคลาส CSS และแดชบอร์ดใหม่เป็นฟีเจอร์ต้อนรับ ตัวเลือกโลโก้ ตัวโหลดล่วงหน้า ปลั๊กอินขนาดเล็ก และหน้า 404 แบบกำหนดเองและหน้าการบำรุงรักษาเพิ่มจำนวนมากให้กับ Divi ด้วยตัวเอง ฉันชอบความสามารถในการแทรกเค้าโครง Divi และเลือกส่วนท้ายแบบกำหนดเอง ฉันยังชอบคุณสมบัติการปรับแต่งธีมเพื่อเพิ่มรูปภาพในส่วนหัวและปรับแต่งและเปลี่ยนสี รูปร่าง และตำแหน่งของปุ่มกลับไปด้านบน

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

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

ภาพเด่นผ่าน Oleh Donets / shutterstock.com