ไฮไลท์ปลั๊กอิน Divi: Divi ConKit Pro

Divi ConKit Pro เป็นปลั๊กอินที่นำโมดูลใหม่ 36 โมดูลมาสู่ Divi Builder และอีก 4 ส่วนขยายที่เพิ่มฟังก์ชันการทำงานใหม่และความสามารถในการปรับแต่งเว็บไซต์ของคุณ หากคุณกำลังมองหาปลั๊กอินที่มีคุณสมบัติครบครันที่ผสานรวมกับ Divi ได้อย่างสมบูรณ์และนำเสนอโมดูลต่างๆ เช่น ฟีด Instagram ไทม์ไลน์ ข้อความเคลื่อนไหว และฟลิปบ็อกซ์ และให้คุณควบคุมการออกแบบป๊อปอัป หน้าเข้าสู่ระบบของคุณ และอื่นๆ อีกมากมาย สิ่งนี้ อาจเป็นปลั๊กอินสำหรับคุณ ในไฮไลต์ของปลั๊กอินนี้ เราจะดูคุณลักษณะทั้งหมดที่มาพร้อมกับ Divi ConKit Pro และช่วยคุณตัดสินใจว่าปลั๊กอินนี้เหมาะสำหรับคุณหรือไม่

มาเริ่มกันเลย!

การติดตั้ง Divi ConKit Pro

ติดตั้ง Divi ConKit Pro เหมือนกับที่คุณทำกับปลั๊กอินอื่นๆ ไปที่หน้าปลั๊กอินและคลิก เพิ่มปลั๊กอิน จากนั้นเลือก อัปโหลดปลั๊กอิน และเลือกไฟล์ปลั๊กอิน คลิก ติดตั้ง ทันที เพื่อติดตั้งปลั๊กอิน จากนั้น เปิดใช้งาน ปลั๊กอินเมื่อโหลดแล้ว

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

Divi ConKit Pro

โมดูล Divi ConKit Pro

ขั้นแรก มาดูแต่ละโมดูลที่มาพร้อมกับ Divi ConKit Pro โมดูลเหล่านี้ทั้งหมดผสานรวมกับ Divi Builder และคุณเพิ่มลงในเว็บไซต์ของคุณเหมือนกับที่คุณทำกับโมดูล Divi อื่นๆ

หัวเรื่อง DP ขั้นสูง

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

ข้อความเคลื่อนไหว DP

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

DP Blog Plus

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

DP ชั่วโมงทำการ

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

บัตร DP

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

DP CF7 Styler

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

DP เนื้อหาสลับ

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

DP Divider

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

DP Dual Button

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

DP Flip Box

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

DP ลอยภาพ

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

เส้นเวลาแนวนอน DP

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

DP Hotspots

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

กล่องโฮเวอร์ DP

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

กล่องไอคอน DP

โมดูลนี้เป็นโมดูลอย่างง่ายที่ให้คุณแสดงไอคอนและข้อความเสริมในกล่อง

DP Image หีบเพลง

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

DP Image เปรียบเทียบ

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

DP แว่นขยายภาพ

โมดูลแว่นขยายรูปภาพจะขอให้คุณอัปโหลดรูปภาพในเวอร์ชันขนาดใหญ่และขนาดเล็ก เมื่อคุณวางเมาส์เหนือรูปภาพ แว่นขยายจะปรากฏขึ้นและคุณจะเห็นพื้นที่ที่โฮเวอร์ในเวอร์ชันที่ใหญ่ขึ้น

การกำบังภาพ DP

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

กล่องข้อมูล DP

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

DP อินไลน์ SVG

โมดูลนี้อนุญาตให้คุณอัปโหลดไฟล์ SVG ได้โดยตรงและดูภายใน Divi Builder

DP Instagram Feed

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

รายการ DP

โมดูลนี้สามารถใช้เพื่อจัดระเบียบข้อมูลในรายการที่มีไอคอนหรือรูปภาพ

ตารางโลโก้ DP

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

DP Lottie

ด้วยโมดูลนี้ คุณสามารถเพิ่มแอนิเมชั่น Lottie ลงในเพจของคุณได้โดยตรงใน Divi Builder คุณสามารถเพิ่ม Lottie Animation ได้โดยการอัปโหลดไฟล์ Lottie JSON หรือทาง URL

หมายเลข DP

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

เมนูราคา DP

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

DP รีวิว

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

ภาพเลื่อน DP

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

แถบทักษะ DP

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

DP Social Share

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

DP Team

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

คำรับรองของ DP

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

DP Twitter Feed

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

เส้นเวลาแนวตั้ง DP

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

DP วิดีโอป๊อปอัป

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

ส่วนขยาย Divi ConKit Pro

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

นักออกแบบบล็อก

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

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

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

เครื่องทำป๊อปอัป

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

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

และนี่คือป๊อปอัปในการดำเนินการ

ตัวออกแบบการเข้าสู่ระบบ

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

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

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

รหัสย่อห้องสมุด Divi

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

ซื้อ Divi ConKit Pro

Divi ConKit Pro มีอยู่ใน Divi Marketplace มีค่าใช้จ่าย $59 สำหรับการใช้งานเว็บไซต์ไม่จำกัด และการสนับสนุนและอัปเดต 1 ปี ราคานี้ยังรวมถึงการรับประกันคืนเงินภายใน 30 วัน

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

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