คุณต้องการสร้างภาพพื้นหลังที่ไม่ซ้ำใครโดยใช้โหมดการผสมลวดลายของ Divi ?
การตั้งค่ารูปแบบพื้นหลังในตัวของ Divi ให้คุณสร้างการออกแบบที่สะดุดตาและเพิ่มสไตล์ให้กับภาพพื้นหลังของคุณ เว็บไซต์เว็บ. คุณสามารถใช้การตั้งค่าโหมดการผสมเพื่อปรับแต่งรูปแบบให้กลมกลืนกับภาพพื้นหลังได้
ในบทช่วยสอนนี้ เราจะแสดงตัวอย่างเกี่ยวกับวิธีการเพิ่มโหมดการผสมรูปแบบให้กับภาพพื้นหลังของเพจของคุณ ติดตามพวกเขาเพื่อสร้างลุคเหล่านี้ขึ้นมาใหม่ด้วยตัวเองหรือใช้เป็นแรงบันดาลใจในการสร้างการออกแบบที่คุณกำหนดเอง
ขอเริ่มต้น!
การสำรวจ
ต่อไปนี้คือตัวอย่างสิ่งที่เราจะออกแบบในบทช่วยสอนนี้
เลย์เอาต์แรก
รูปแบบที่สอง
แบบที่สาม
วิธีใช้โหมดการผสมรูปแบบกับภาพพื้นหลัง Divi ของคุณ
สร้างหน้าใหม่ด้วยเค้าโครงที่กำหนดไว้ล่วงหน้า
เราจะเริ่มต้นด้วยการใช้เค้าโครงที่กำหนดไว้ล่วงหน้าจากไลบรารี Divi. สำหรับการออกแบบนี้เราจะใช้ « มารีน่า แลนดิ้งเพจ "ของ มาริน่าเลย์เอาต์แพ็ค .
เพิ่มหน้าใหม่ของคุณ เว็บไซต์เว็บ และตั้งชื่อ จากนั้นเลือกตัวเลือก Use Divi Builder
เราจะใช้เลย์เอาต์ที่สร้างไว้ล่วงหน้าจากไลบรารี Divi สำหรับตัวอย่างนี้ ดังนั้น select เรียกดูเค้าโครง.
ค้นหาและเลือกเค้าโครง หน้า Landing Page ของมารีน่า.
เลือก ใช้เค้าโครงนี้ เพื่อเพิ่มเลย์เอาต์ให้กับเพจของคุณ
ตอนนี้เราพร้อมที่จะออกแบบ
เลย์เอาต์แรก
สำหรับการออกแบบแรกของเรา เราจะเพิ่มรูปแบบบั้งให้กับรูปภาพส่วนหัวแรก สิ่งนี้จะเพิ่มความน่าสนใจให้กับส่วนหัว
เนื่องจากเราจะใช้โหมดการผสม รูปแบบจะละเอียดยิ่งขึ้นและยังช่วยให้มองเห็นภาพพื้นหลังได้
ขั้นแรก เปิดการตั้งค่าส่วนและไปที่ส่วน พื้นหลัง. คลิกที่แท็บ รูปแบบพื้นหลัง และเลือก เพิ่มรูปแบบพื้นหลัง.
ถัดไป เลือกประเภทลวดลาย อย่างที่คุณเห็น มีเทมเพลตต่างๆ ให้เลือกมากมาย และสามารถกำหนดเองเพิ่มเติมได้ด้วยการตั้งค่าเทมเพลตด้านล่าง
- ประเภทรูปแบบ: Inverted Herringbone 2
เพิ่มโหมด "ผสมผสานรูปแบบ"
สุดท้าย ตั้งค่าโหมดการผสมของลวดลาย เราจะใช้โหมดการผสม แสงอ่อน สำหรับตัวอย่างนี้ โหมดการผสมนี้ทำให้รูปแบบมีความละเอียดอ่อนมากขึ้น เพื่อไม่ให้เบี่ยงเบนความสนใจจากภาพพื้นหลัง
- โหมดผสมผสานรูปแบบ: แสงอ่อน
ผล
นี่คือการออกแบบขั้นสุดท้ายของตัวอย่างแรกของเรา
นี่คือรุ่นมือถือ
รูปแบบที่สอง
สำหรับเลย์เอาต์ที่สอง เราจะใช้รูปแบบคลื่นที่ซ้อนทับบนภาพพื้นหลังและการไล่ระดับสี ซึ่งเข้ากันได้ดีกับธีมทะเลของหน้า
ก่อนอื่น ให้ไปที่ส่วน "มันทำงานอย่างไร" และเปิดการตั้งค่าส่วน
เปิดการตั้งค่า พื้นหลังจากนั้นเลือกแท็บ รูปแบบพื้นหลังและคลิก เพิ่มรูปแบบพื้นหลัง.
สำหรับการออกแบบนี้ เราจะใช้รูปแบบการพิมพ์ Waves.
- ประเภทรูปแบบ: คลื่น
แล้วเปลี่ยนสีลวดลายเป็นสีขาว
- ลายสี: #FFFFFF
เพิ่มโหมดการผสมลวดลาย
ตอนนี้เราสามารถเพิ่มโหมดการผสมลงในรูปแบบของเราได้แล้ว ตั้งค่าโหมดการผสมลวดลายเป็น วางซ้อน.
ค้นพบยัง: Divi: วิธีปรับแต่งตะกร้าและไอคอนค้นหาของโมดูล "เมนูเต็มความกว้าง"
โหมดการผสมนี้จะทำให้สีเข้มขึ้นในภาพพื้นหลังและทำให้สีของแสงสว่างขึ้น
- โหมดผสมผสานรูปแบบ: โอเวอร์เลย์
ผล
นี่คือผลลัพธ์สุดท้ายของตัวอย่างที่สองที่ใช้กับส่วน "มันทำงานอย่างไร".
และนี่คือรุ่นมือถือ
แบบที่สาม
มาเริ่มเค้าโครงที่สามของเรากัน
สำหรับเลย์เอาต์นี้ เราจะเพิ่มแถบแนวทแยงทึบที่พื้นหลังของ " Call to Action".
เริ่มต้นด้วยการเปิดการตั้งค่าส่วนและไปที่ส่วน พื้นหลัง. คลิกที่แท็บ รูปแบบพื้นหลังจากนั้นเลือก เพิ่มรูปแบบพื้นหลัง.
เลือกลาย เส้นทแยงมุม.
ถัดไป กำหนดสีของลวดลาย
- รูปแบบสี: rgba(255,255,255,0.25)
พลิกรูปแบบในแนวนอนโดยใช้การตั้งค่ารูปแบบการแปลง นี่เป็นอีกพารามิเตอร์หนึ่งที่สามารถช่วยคุณปรับแต่งรูปแบบตามที่คุณต้องการ
- การแปลงรูปแบบ: แนวนอน
เพิ่มโหมดการผสมลวดลาย
สุดท้าย ตั้งค่าโหมดการผสมของลวดลาย สำหรับการออกแบบนี้ เราจะใช้โหมดการผสม ความสว่างไสว.
อ่านคู่มือของเราได้ที่: Divi: วิธีใช้ "Gradient Builder" เพื่อตกแต่งภาพของคุณ
เมื่อรวมกับสีลวดลายของเราแล้ว จะเพิ่มหน้าจอที่สว่างให้กับรูปภาพในขณะที่ปล่อยให้รูปภาพแสดงผ่านได้ ด้วยการออกแบบนี้ ภาพของเรือจึงโดดเด่นกว่าพื้นหลังเนื่องจากลวดลายเพิ่มคอนทราสต์ที่โดดเด่น
- โหมดผสมผสานรูปแบบ: ความส่องสว่าง
ผล
นี่คือการออกแบบขั้นสุดท้ายสำหรับส่วนนี้
และนี่คือเวอร์ชันสำหรับมือถือ
ผลสุดท้าย
ตอนนี้เรามาดูการออกแบบแบบเต็มหน้าด้วยโหมดการผสมลวดลายกัน
ดาวน์โหลด DIVI ทันที!!!
สรุป
การเพิ่มรูปแบบอาจเป็นวิธีที่ดีในการเพิ่มความน่าสนใจให้กับภาพพื้นหลังของคุณ แต่บางครั้งรูปแบบก็อาจครอบงำภาพพื้นหลังได้ โชคดีที่ Divi มาพร้อมกับโหมดการผสมมากมาย คุณจึงสามารถปรับแต่งรูปแบบได้มากเท่าที่คุณต้องการ
เราหวังว่าบทช่วยสอนนี้จะสร้างแรงบันดาลใจให้คุณสำหรับโครงการ Divi ครั้งต่อไปของคุณ หากคุณมีข้อกังวลหรือข้อเสนอแนะ หาเราใน ส่วนความเห็น เพื่อหารือเกี่ยวกับมัน
ปรึกษาได้นะคะ ทรัพยากรของเราหากคุณต้องการองค์ประกอบเพิ่มเติมเพื่อดำเนินโครงการสร้างเว็บไซต์อินเทอร์เน็ตของคุณ
อย่าลังเลที่จะปรึกษาคำแนะนำของเราเกี่ยวกับ การสร้างบล็อก WordPress หรือที่อยู่บน Divi: ธีม WordPress ที่ดีที่สุดตลอดกาล.
แต่ในขณะเดียวกัน แบ่งปันบทความนี้ในเครือข่ายโซเชียลต่าง ๆ ของคุณ.
...
