จุดเด่นของปลั๊กอิน Divi: Divi Next Blurb

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

Divi Next Blurb Module

เมื่อคุณอัปโหลดและเปิดใช้งาน Divi Next Blurb โมดูลใหม่จะถูกเพิ่มลงใน Divi Builder ชื่อ Next Blurb คุณจะไม่ต้องตั้งค่าอะไรเลย ก็พร้อมใช้งาน

Divi ถัดไป Blurb เนื้อหา Tab

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

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

เพิ่มรูปภาพและไอคอนพร้อมกันหรือแยกกัน โมดูลการนำเสนอ Divi มาตรฐานจะแสดงอย่างใดอย่างหนึ่งเท่านั้น Divi Next Blurb เปิดโอกาสให้ออกแบบได้มากมายโดยให้คุณแสดงทั้งสองอย่างพร้อมกัน

รวมปุ่มที่มีสไตล์ปุ่มมาตรฐาน

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

Divi Next Blurb Design Tab

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

รูปภาพนำเสนอถัดไป

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

อันนี้วางภาพไว้ตรงกลางด้านขวา ฉันได้เพิ่มเส้นขอบและเปลี่ยนสี ฉันได้เพิ่มเงากล่องด้วย

สำหรับตัวอย่างนี้ ฉันวางรูปภาพไว้ตรงกลางด้านล่าง ฉันลบขอบและปัดเศษมุม อันนี้มีเงาของกล่องที่แตกต่างกัน

ไอคอนนี้ยังรวมถึงตัวเลือกตำแหน่ง คุณยังสามารถปรับขนาด สี เส้นขอบ ฯลฯ สำหรับตัวอย่างนี้ ฉันวางไอคอนไว้ที่ด้านล่างขวา

Next ไอคอนประกาศ

ตัวอย่างนี้แสดงไอคอนตรงกลางด้านซ้าย ฉันได้เพิ่มขนาด เพิ่มเส้นขอบ และเปลี่ยนสีของเส้นขอบแล้ว

ตัวอย่างนี้แสดงไอคอนตรงกลางด้านบน ฉันได้ลดขนาด เพิ่มเงาของกล่อง และปัดเศษเป็นมุมเพื่อสร้างวงกลม

ถัดไป เอฟเฟกต์ Blurb Hover

เอฟเฟกต์โฮเวอร์มีตัวเลือก 2 มิติและเอียง ตัวเลือก 2D มีเอฟเฟกต์ 16 แบบให้เลือก

ตัวอย่างนี้แสดงเอฟเฟกต์โฮเวอร์แบบพัลส์

เอฟเฟกต์การเอียงประกอบด้วยตัวเลือกแสงสะท้อน ตัวเลือกย้อนกลับ มุมมอง ความเร็ว จุดเริ่มต้นและจุดสิ้นสุด ฯลฯ ตัวอย่างนี้แสดงตัวเลือกการเอียงมาตรฐานที่เปิดใช้งานแสงสะท้อน ฉันปล่อยให้การตั้งค่าเป็นค่าเริ่มต้น

ตัวอย่างนี้เพิ่มแสงสะท้อนและมุมมองมากขึ้น มีหลายวิธีในการปรับแต่งการเอียง

ข้อความนำเสนอถัดไป

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

ข้อความคำอธิบายประกอบด้วยการตั้งค่าข้อความมาตรฐานทั้งหมด รวมถึงการปรับเปลี่ยนข้อความ ลิงก์ สัญลักษณ์แสดงหัวข้อย่อย เครื่องหมายคำพูด ฯลฯ ในตัวอย่างนี้ ฉันได้เพิ่มขนาดแบบอักษร เปลี่ยนเป็นสีแดง และเพิ่มเอฟเฟกต์เงา

ปุ่มประกาศถัดไป

ข้อความปุ่มมาตรฐานและการปรับไอคอนทั้งหมดรวมอยู่ด้วย ฉันได้เพิ่มขนาดตัวอักษรและเปลี่ยนสีแล้ว ตัวอย่างนี้แสดงการตั้งค่าไอคอนปุ่ม

ปุ่มโฮเวอร์ประกอบด้วยการปรับเปลี่ยนมากมาย เช่น 2D พื้นหลัง เส้นขีด และไอคอน การตั้งค่า 2D มีเอฟเฟกต์โฮเวอร์มากมาย

ปุ่มโฮเวอร์ประกอบด้วยการปรับเปลี่ยนมากมาย เช่น 2D พื้นหลัง เส้นขีด และไอคอน การตั้งค่า 2D มีเอฟเฟกต์โฮเวอร์มากมาย เอฟเฟกต์พื้นหลังรวมถึงชุดเอฟเฟกต์อีกชุดหนึ่ง ซึ่งจะแสดงปุ่มเมื่อวางเมาส์เหนือ

Stroke เพิ่มการปรับพื้นหลังและเส้นขอบรวมถึงเอฟเฟกต์โฮเวอร์หลายแบบ ตัวอย่างนี้จะเพิ่มเส้นขอบรอบด้านในและเปลี่ยนสี

ไอคอนยังเพิ่มเอฟเฟกต์โฮเวอร์จำนวนมากที่จะส่งผลต่อไอคอนเมื่อโฮเวอร์เท่านั้น

Divi ถัดไป Blurb ตัวอย่างหนึ่ง

ตัวอย่างเช่น ฉันต้องการแทนที่ข้อความ Sale ทางด้านขวาในเลย์เอาต์ Leather Company ด้วยโมดูล Next Blurb และเพิ่มคุณสมบัติบางอย่าง

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

นี่คือคำกระตุ้นการตัดสินใจในการขายที่สร้างขึ้นใหม่โดยใช้เพียงโมดูล Next Blurb ฉันยังคงใช้พื้นหลังสีดำสำหรับคอลัมน์ในตัวอย่างนี้

นี่คือการดูที่มุมมองโครงลวด โมดูลทำงานได้ดีกับส่วนพิเศษ

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

อันนี้รวมถึงเอฟเฟกต์การเอียง ฉันได้เพิ่มแสงสะท้อนเพื่อให้มองเห็นการ์ดได้ในพื้นหลังเมื่อวางเมาส์เหนือ

สำหรับตัวอย่างนี้ ฉันได้เพิ่มรูปภาพลงในการนำเสนอ ฉันทิ้งมันไว้ที่ด้านบนของการ์ดประกาศ

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

อันนี้รวมเอฟเฟกต์การเอียงโดยไม่เปิดใช้งานแสงสะท้อน การ์ดเอียงภายในคอลัมน์ แต่ขอบของการ์ดไม่เป็นไปตามที่คิด

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

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

Divi ถัดไป Blurb ตัวอย่างที่สอง

สำหรับตัวอย่างนี้ ฉันต้องการแทนที่การนำเสนอในรูปแบบหน้าแรกของ Startup ด้วยโมดูล Next Blurb และทำให้การออกแบบซับซ้อนขึ้นเล็กน้อย

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

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

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

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

ต่อไปนี้เป็นลักษณะที่ประกาศถัดไปภายในเค้าโครง

Divi Next Blurb ราคาและแหล่งซื้อ

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

• ใบอนุญาตเดียว – $25.00
• ใบอนุญาตไม่ จำกัด – $49.00
• ใบอนุญาตตลอดชีพ – $99.00

คุณสามารถซื้อได้จากเว็บไซต์ของผู้พัฒนา

จบความคิด

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

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

ฉันชอบ Divi Next Blurb มาก หากคุณสนใจโมดูล Blurb ที่ใช้งานง่ายซึ่งทำได้มากกว่าโมดูล Divi มาตรฐานมาก Divi Next Blurb ก็คุ้มค่าที่จะลองดู

เราต้องการได้ยินจากคุณ คุณลอง Divi Next Blurb แล้วหรือยัง? แจ้งให้เราทราบว่าคุณคิดอย่างไรเกี่ยวกับเรื่องนี้ในความคิดเห็น

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