ดาวน์โหลดรูปแบบพื้นหลังซ้ำฟรี 6 รูปแบบสำหรับ Divi

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

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

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

ดูตัวอย่าง

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

ดาวน์โหลดรูปแบบพื้นหลังฟรี

หากต้องการวางมือบนรูปแบบพื้นหลังฟรี ก่อนอื่นคุณต้องดาวน์โหลดโดยใช้ปุ่มด้านล่าง ในการเข้าถึงการดาวน์โหลด คุณจะต้องสมัครรับรายชื่ออีเมล Divi Daily ของเราโดยใช้แบบฟอร์มด้านล่าง ในฐานะสมาชิกใหม่ คุณจะได้รับความดี Divi มากยิ่งขึ้นและแพ็ค Divi Layout ฟรีทุกวันจันทร์และวันศุกร์! หากคุณอยู่ในรายชื่อแล้ว เพียงป้อนที่อยู่อีเมลของคุณด้านล่างแล้วคลิกดาวน์โหลด คุณจะไม่ถูก "สมัครใหม่" หรือรับอีเมลเพิ่มเติม

ดาวน์โหลดไฟล์

ดาวน์โหลดฟรี

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

ดาวน์โหลด

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

เข้าใกล้

• เมื่อคุณดาวน์โหลดโฟลเดอร์และแตกไฟล์แล้ว คุณจะพบกับ 5 โฟลเดอร์ที่แตกต่างกัน
• แต่ละโฟลเดอร์เหล่านี้แสดงถึงชุดมิติข้อมูลที่แตกต่างกัน: 1000×1000, 500×500, 100×100, 50×50 และ 25×25
• แม้ว่าในทางเทคนิคแล้วรูปแบบเหล่านี้จะเหมือนกัน แต่ผลลัพธ์สุดท้ายบนเว็บไซต์ของคุณจะดูแตกต่างออกไปขึ้นอยู่กับชุดมิติข้อมูลที่คุณเลือกใช้
• เรากำลังรวมรูปแบบเหล่านี้เข้ากับตัวเลือกพื้นหลังของ Divi เพื่อสร้างเอฟเฟกต์พื้นหลังซ้ำ
• การทำเช่นนี้ไม่เพียงแต่จะทำให้ภาพพื้นหลังของคุณมีความสม่ำเสมอเท่านั้น แต่ยังช่วยลดความต้องการภาพพื้นหลังที่มีความละเอียดสูงอีกด้วย

มันทำงานอย่างไร

เลือกส่วนในหน้าของคุณ

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

เลือกขนาดที่คุณต้องการ

แบบที่ 1: 1000×1000

การตั้งค่าพื้นหลัง

เพื่อให้ได้ผลลัพธ์ที่เราได้แชร์ไว้ข้างต้น ให้ไปข้างหน้าและค้นหารูปแบบ #1 ในโฟลเดอร์ 1000×1000 ของการดาวน์โหลดของคุณ จากนั้น อัปโหลดไปยังการตั้งค่าพื้นหลังของส่วน และใช้การตั้งค่าต่อไปนี้ควบคู่ไปกับมัน:

• ขนาดภาพพื้นหลัง: ขนาดจริง
• ตำแหน่งภาพพื้นหลัง: Center
• ทำซ้ำภาพพื้นหลัง: ทำซ้ำ

พร้อมการไล่ระดับสีทับซ้อน

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

• สี 1: #E2E2E2
• สี 2: rgba (255,255,255,0.37)
• ประเภทการไล่ระดับสี: เชิงเส้น
• ทิศทางการไล่ระดับสี: 181deg
• ตำแหน่งเริ่มต้น: 7%
• ตำแหน่งสุดท้าย: 35%

รูปแบบ #1 : 500×500

การตั้งค่าพื้นหลัง

คุณยังสามารถทำให้รูปแบบปรากฏเฉพาะในแนวนอนหรือแนวตั้งโดยใช้ตัวเลือกพื้นหลังในตัวของ Divi สำหรับตัวอย่างข้างต้น เราได้ใช้ไฟล์ภาพรูปแบบขนาด 500×500 #1 หลังจากอัปโหลดแล้ว ให้รวมเข้ากับการตั้งค่าพื้นหลังต่อไปนี้:

• ขนาดภาพพื้นหลัง: ขนาดจริง
• ตำแหน่งภาพพื้นหลัง: กึ่งกลางด้านบน
• เล่นซ้ำภาพพื้นหลัง: ทำซ้ำ X (แนวนอน)

รูปแบบ #2 : 500×500

การตั้งค่าพื้นหลัง

เราทำเช่นเดียวกันโดยใช้รูปแบบที่สองในโฟลเดอร์ 500×500 ของคุณ

• ขนาดภาพพื้นหลัง: ขนาดจริง
• ตำแหน่งภาพพื้นหลัง: กึ่งกลางด้านบน
• เล่นซ้ำภาพพื้นหลัง: ทำซ้ำ X (แนวนอน)

แบบ #3 : 100×100

การตั้งค่าพื้นหลัง

สำหรับตัวอย่างถัดไป ค้นหารูปแบบ #3 ในโฟลเดอร์ขนาด 100×100 และรวมเข้ากับตัวเลือกพื้นหลังต่อไปนี้ ซึ่งจะทำให้รูปแบบครอบคลุมทั้งส่วน:

• ขนาดภาพพื้นหลัง: ขนาดจริง
• ตำแหน่งภาพพื้นหลัง: Center
• ทำซ้ำภาพพื้นหลัง: ทำซ้ำ

ลาย #4 : 50×50

การตั้งค่าพื้นหลัง

ขนาดที่เล็กกว่า ความถี่ของรูปแบบก็จะยิ่งสูงขึ้น ค้นหาพื้นหลัง #4 ในโฟลเดอร์ขนาด 50×50 และรวมเข้ากับการตั้งค่าพื้นหลังต่อไปนี้:

• ขนาดภาพพื้นหลัง: ขนาดจริง
• ตำแหน่งภาพพื้นหลัง: กึ่งกลางด้านบน
• ทำซ้ำภาพพื้นหลัง: ทำซ้ำ

แบบ #5 : 100×100

การตั้งค่าพื้นหลัง

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

• ขนาดภาพพื้นหลัง: ขนาดจริง
• ตำแหน่งภาพพื้นหลัง: กึ่งกลางด้านบน
• ทำซ้ำภาพพื้นหลัง: ทำซ้ำ

ลาย #6 : 25×25

การตั้งค่าพื้นหลัง

สุดท้ายแต่ไม่ท้ายสุด ค้นหารูปแบบ #6 ในโฟลเดอร์ขนาด 25×25 และอัปโหลดไปยังพื้นหลังส่วนของคุณพร้อมกับการตั้งค่าพื้นหลังต่อไปนี้:

• ขนาดภาพพื้นหลัง: ขนาดจริง
• ตำแหน่งภาพพื้นหลัง: กึ่งกลางด้านบน
• ทำซ้ำภาพพื้นหลัง: ทำซ้ำ

ใช้รูปแบบสำหรับพื้นหลังแถว คอลัมน์ และโมดูลด้วย

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

ดูตัวอย่าง

ตอนนี้ที่จัดการผลลัพธ์สุดท้ายที่แตกต่างกันสองสามอย่างที่คุณจะได้รับจากรูปแบบพื้นหลัง มาดูผลลัพธ์สุดท้ายกัน:

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

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