ไฮไลท์ปลั๊กอิน Divi – ตัวจัดการโลโก้ Divi

เผยแพร่แล้ว: 2017-07-30

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

Divi Logo Manager เป็นปลั๊กอินพรีเมียมสำหรับ Divi ที่ให้คุณเปลี่ยนโลโก้ทั่วทั้งเว็บไซต์ของคุณ คุณสามารถใช้โลโก้ที่แตกต่างกันตามอุปกรณ์ (มือถือ แท็บเล็ต หรือเดสก์ท็อป) เปลี่ยนเป็นโลโก้อื่นบนแถบเลื่อน ตั้งค่าโลโก้ตามแต่ละหน้า และปรับปริมาณการยื่น เข้ากันได้กับเพจ โครงการ และหน้าผลิตภัณฑ์ WooCommerce

ในไฮไลท์ของปลั๊กอินนี้ เราจะมาดูกันว่าปลั๊กอินสามารถทำอะไรได้บ้าง รูปภาพสำหรับตัวอย่างนำมาจาก Unsplash.com

การติดตั้งและการตั้งค่าตัวจัดการโลโก้ Divi

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

โลโก้เดสก์ท็อปถูกเพิ่มในตัวเลือกธีม Divi โลโก้อื่นๆ ทั้งหมดจะถูกเพิ่มในหน้านี้หรือในแต่ละหน้าแยกกัน

โอเวอร์แฮง

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

ต่อหน้า

Divi Logo Manager เพิ่มการตั้งค่าชุดใหม่ให้กับเพจ โครงการ และหน้าผลิตภัณฑ์ WooCommerce ของคุณ ที่ให้คุณแทนที่การตั้งค่าที่คุณตั้งไว้ในเมนูหลัก เพื่อให้คุณสามารถเลือกโลโก้เฉพาะสำหรับแต่ละหน้าได้ คุณสามารถตั้งค่าสำหรับเดสก์ท็อป มือถือ แท็บเล็ต และเลื่อนได้ เหมาะอย่างยิ่งสำหรับแลนดิ้งเพจ ข้อเสนอพิเศษ เพจพอร์ตโฟลิโอ ผลิตภัณฑ์ ฯลฯ

ตัวอย่างตัวจัดการโลโก้ Divi

มาดูโลโก้ของแต่ละอุปกรณ์และระยะยื่นระดับต่างๆ กัน ฉันจะใช้เครื่องมือสำหรับนักพัฒนาซอฟต์แวร์ของ Google Chrome เพื่อจำลองอุปกรณ์เคลื่อนที่และแท็บเล็ต

เดสก์ทอป

สำหรับโลโก้เดสก์ท็อป ฉันใช้รูปสิงโตเป็นศิลปะ นี่คือโลโก้รุ่นมาตรฐานที่ไม่มีส่วนยื่น ต้องโหลดโลโก้นี้ในการตั้งค่าธีมของ Divi

ตอนนี้ฉันได้อัปโหลดโลโก้แล้ว ตอนนี้ปรากฏในการตั้งค่าปลั๊กอิน

โอเวอร์แฮง

มาดูส่วนยื่นบางส่วนกัน ตัวนี้มีส่วนยื่นเล็กๆ เป็นที่สังเกตได้

คันนี้ใช้ระยะยื่นที่ใหญ่กว่าเล็กน้อย มันชัดเจนขึ้นและฉันชอบวิธีที่มันดูตรงข้ามกับหน้า

อันนี้ขนาดกลางขนาดใหญ่ เป็นขนาดที่ดีรอบตัว

อันนี้ใช้ Overhang ขนาดใหญ่ มันอาจจะใหญ่เกินไปสำหรับการออกแบบบางอย่าง

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

คุณลักษณะที่ยื่นออกมาใช้งานได้กับพิเศษ แต่ไม่ใช่คุณลักษณะการสลับโลโก้ พิเศษด้วยระยะยื่นขนาดใหญ่

เลื่อนโลโก้

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

โลโก้จะเปลี่ยนทันทีที่ส่วนหัวเล็กลง

ยาเม็ด

นี่คือโลโก้ใหม่ที่จะแสดงบนแท็บเล็ตเท่านั้น มาดูตัวอย่างบางส่วนโดยใช้เครื่องมือสำหรับนักพัฒนาซอฟต์แวร์ของ Google Chrome

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

นี่คือ iPad ในโหมดแนวนอน แท็บเล็ตบางรุ่นจะแสดงโลโก้เดสก์ท็อปหากหน้าจอมีขนาดใหญ่พอ

นี่คือ Nexus 10 ในโหมดแนวตั้ง

นี่คือ Nexus 10 ในโหมดแนวนอน จะแสดงโลโก้เดสก์ท็อป

นี่คือ Nexus 10 แบบเลื่อน โลโก้จะเปลี่ยนบนแท็บเล็ตเหมือนกับบนเดสก์ท็อป

นี่คือระยะยื่นที่ใหญ่จนคาดไม่ถึงของ iPhone 6 Plus

อันนี้ใช้ Medium Overhang บน iPhone 6 Plus

อันนี้ใช้ Overhang ขนาดใหญ่

อันนี้ใช้ Small Overhang

มือถือ

ฉันได้เพิ่มโลโก้สำหรับมือถือแล้ว

อันนี้ใช้ Responsive กับ Overhang ขนาดใหญ่

อันนี้ใช้ Overhang ขนาดใหญ่กับ iPhone 6 Plus

นี่คือ iPhone 6 Plus ในโหมดแนวนอน

นี่คือกาแล็กซี่โน้ต 3

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

หน้าผลิตภัณฑ์ WooCommerce

นอกจากนี้ยังทำงานบนหน้าผลิตภัณฑ์ WooCommerce มันทำงานเหมือนกับหน้าปกติโดยค่าเริ่มต้น ดังนั้นจึงไม่มีอะไรต้องตั้งค่า นี่คือโลโก้ปกติที่มีโอเวอร์แฮงก์ขนาดใหญ่

หน้าโครงการ

Divi Logo Manager ยังทำงานบนหน้าโครงการโดยค่าเริ่มต้น นี่คือหน้าโครงการที่มีโลโก้เดสก์ท็อปใหม่ เช่นเดียวกับหน้าทั่วไป หน้าโครงการมีการปรับแต่งเพื่อเลือกโลโก้ต่อหน้า

ต่อหน้า

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

ในตัวอย่างนี้ ฉันได้สร้างผลิตภัณฑ์ใหม่ ผลิตภัณฑ์นี้แตกต่างจากผลิตภัณฑ์อื่นมากจนโลโก้มาตรฐานไม่ตรงกัน หน้าผลิตภัณฑ์นี้จะได้ประโยชน์จากการมีโลโก้แยกต่างหาก

ต่อไปนี้คือลักษณะโลโก้ที่ฉันเลือกให้แสดงหน้านี้

นี่คือโลโก้เดสก์ท็อปที่ใช้โอเวอร์แฮงขนาดใหญ่

นี่คือโลโก้เลื่อน

นี่คือโลโก้มือถือที่ใช้ iPhone 6 Plus

นี่คือ iPhone 6 Plus ในโหมดแนวนอน

นี่คือโลโก้แท็บเล็ตที่ใช้ Nexus 10

กลับไปที่หน้าเดิมของเรา… ฉันได้เพิ่มโลโก้ใหม่สำหรับการเลื่อนที่ฉันต้องการแสดงในหน้านี้เท่านั้น

หน้านี้ใช้โลโก้ที่กำหนดเองในการเลื่อน

ใบอนุญาต การอัปเดต และการสนับสนุน

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

สำหรับข้อมูลเพิ่มเติม โปรดดูเว็บไซต์ของผู้จัดพิมพ์ที่ KiwiWeb.co.uk

ความคิดสุดท้าย

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

หากคุณสนใจที่จะเลือกโลโก้ตามอุปกรณ์ เปลี่ยนโลโก้บนแถบเลื่อน หรือเพิ่มคุณสมบัติการยื่น Divi Logo Manager อาจเป็นปลั๊กอินที่คุณต้องการ

เราอยากได้ยินจากคุณ คุณเคยใช้ Divi Logo Manager หรือไม่? แจ้งให้เราทราบว่าคุณคิดอย่างไรในความคิดเห็นด้านล่าง!

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