Divi Toolbox เป็นปลั๊กอิน ซึ่งเพิ่มเอฟเฟกต์ใหม่มากมายให้กับ Divi ซึ่งปกติต้องใช้ CSS, JavaScript, PHP หรือปลั๊กอินแต่ละตัว เอฟเฟกต์ใช้งานง่าย ปรับแต่ง และมอบให้กับคุณ เว็บไซต์เว็บ มอบประกายแวววาวพิเศษให้โดดเด่นจากฝูงชน

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

การตั้งค่าทั่วไปของกล่องเครื่องมือ Divi

การตั้งค่ากล่องเครื่องมือ divi

หน้าจอตัวเลือก Divi Toolbox จะถูกเพิ่มเข้าไปในเมนูแดชบอร์ด Divi เปิดใช้การตั้งค่าที่นี่ แต่จะมีการปรับแต่งในเครื่องมือปรับแต่ง

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

กล่องเครื่องมือ Divi ทั่วไปพารามิเตอร์. png

การเพิ่มไอคอนโซเชียลจะเปิดช่องที่คุณสามารถป้อน URL ของเครือข่ายโซเชียลเพิ่มเติมอีก 9 เครือข่าย

เพิ่มโซเชียลเน็ตเวิร์ก divi.png

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

การปรับแต่งกล่องเครื่องมือ divi settings.png

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

หน้าจอเข้าสู่ระบบที่กำหนดเอง divi.png

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

การตั้งค่าส่วนหัว Divi Toolbox

การตั้งค่าส่วนหัว divi.png

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

การกำหนดค่าแถบเครื่องมือ divi.png

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

เครื่องมือปรับแต่งส่วนหัว divi.png

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

การตั้งค่าส่วนท้ายในกล่องเครื่องมือ Divi

การตั้งค่าส่วนท้าย divi.png

การตั้งค่าส่วนท้ายประกอบด้วยส่วนท้ายที่เหนียวแสดงส่วนท้ายปรับแต่งเมนูและวิดเจ็ตปรับแต่งปุ่ม Back to Top (ซึ่งเพิ่มตัวเลือกลิงค์ปุ่มที่กำหนดเอง) และเพิ่มก่อนและหลังเลย์เอาต์ ส่วนท้าย

ปรับแต่งส่วนท้าย divi.png

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

ฉันจัดรูปแบบปุ่มด้านบนของหน้าเพื่อแสดงข้อความ มันมีเอฟเฟกต์เงาและฉันปรับตำแหน่งของมัน ฉันปล่อยให้สีเริ่มต้น ฉันจัดกึ่งกลางข้อความด้านล่างและไอคอนโซเชียล สำหรับเอฟเฟกต์โฮเวอร์ฉันเลือก Grow (รวมถึงการหดตัวเลื่อนขึ้นลงโยกเยกการเต้นของหัวใจเจลโลและชีพจร)

การตั้งค่าสำหรับ Divi Toolbox Mobile

การตั้งค่ากล่องเครื่องมือสำหรับ mobile.png

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

Divi-Toolbox-Mobile-Settings- สำหรับ mobile.png

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

animation menu mobile.png

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

กล่องเครื่องมือ Divi Tool Settings

การตั้งค่าบล็อก divi toolbox.png

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

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

ปรับแต่งรูปลักษณ์ของบล็อก divi.png

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

บล็อกอินเตอร์เฟสการปรับแต่งผลลัพธ์

ตัวอย่างนี้คือเค้าโครง 6 ฉันปรับแต่งสีฟอนต์สำหรับส่วนเมตาอีกครั้งและเพิ่มสีโฮเวอร์ ฉันยังปรับแต่งพื้นหลังสำหรับปุ่มเรียนรู้เพิ่มเติม

เปลี่ยนแบบอักษรของเนื้อหาบล็อก divi.png

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

ความคิดเห็นของส่วนการปรับแต่ง divi.png

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

ลิขสิทธิ์กล่องเครื่องมือ Divi

คุณมีทางเลือกระหว่างสอง การออกใบอนุญาต :

  • ใบอนุญาตปกติ (เพื่อใช้ในโครงการ) - € 49,00
  • ใบอนุญาตเพิ่มเติม (สำหรับใช้กับโครงการไม่ จำกัด ) - € 169,00

สิ่งที่ต้องจำ

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

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

หากคุณต้องการเพิ่มเอฟเฟ็กต์ใหม่ ๆ ให้กับ Divi ด้วยวิธีที่ง่ายที่สุดเท่าที่จะเป็นไปได้ Divi Toolbox มีค่าทางอ้อม