20 flexbox footers สำหรับ divi 5 (ดาวน์โหลดฟรี!)

เผยแพร่แล้ว: 2025-09-09

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

สารบัญ
  • 1 ดูตัวอย่าง
  • 2 ดาวน์โหลด 20 flexbox footer for divi 5
  • 3 ดาวน์โหลดฟรี
  • 4 สิ่งที่รวมอยู่ (42 การส่งออก)
  • 5 วิธีการติดตั้งเลย์เอาต์
    • 5.1 1. การนำเข้าเลย์เอาต์ลงในห้องสมุด Divi
    • 5.2 2. สร้างเทมเพลตส่วนท้ายใหม่
    • 5.3 3. การอัปโหลดเค้าโครงส่วนท้าย
  • 6 ค่าเริ่มต้นกับ Prestyled: คุณควรเลือกแบบไหน?
  • 7 การปรับแต่งส่วนท้าย
    • 7.1 1. เลือกโมดูลสำหรับการปรับแต่ง
    • 7.2 2. ปรับการตั้งค่า FlexBox สำหรับการควบคุมเค้าโครง
    • 7.3 3. เพิ่มลิงค์ตามความจำเป็น
  • 8 ใช้ Divi 5 เพื่อสร้างส่วนท้ายของคุณวันนี้

ดูตัวอย่าง

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

https://youtu.be/xutcua0rccs

สมัครสมาชิกช่อง YouTube ของเรา

flexbox footers สำหรับ divi 5

ดาวน์โหลด 20 flexbox footer สำหรับ divi 5

รับส่วนท้ายของ Flexbox ทั้งหมด 20 รายการฟรีรวมถึงทั้งรุ่นเริ่มต้นและรุ่น Prestyled ส่วนท้ายแต่ละอันพร้อมที่จะนำเข้าสู่ห้องสมุด Divi ของคุณและใช้ในการสร้างธีม เพียงดาวน์โหลดและเริ่มสร้าง

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

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

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

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

มีอะไรรวม (42 การส่งออก)

เมื่อคุณดาวน์โหลดและคลายซิปโฟลเดอร์แล้วคุณจะพบการส่งออก 42 เค้าโครงทั้งหมดที่จัดระเบียบอย่างเป็นระเบียบเป็นรุ่นเริ่มต้นและเป็นรุ่นที่เป็นส่วนหนึ่งของแต่ละส่วนและเป็นแพ็ค“ ทั้งหมด” เต็มรูปแบบ

ค่าเริ่มต้น - ส่วนท้ายของแต่ละบุคคล (20) →ใช้สไตล์โลกของคุณ
ค่าเริ่มต้น - ส่วนท้ายทั้งหมด (1) →แพ็คเต็มโดยใช้สไตล์โลกของคุณ

PRESTYLED-ส่วนท้ายของแต่ละบุคคล (20) →รวมถึงสไตล์แบบอินไลน์สำหรับรูปลักษณ์ที่พร้อมทำทันที
PRESTYLED - ส่วนท้ายทั้งหมด (1) →แพ็คเต็มพร้อมสไตล์อินไลน์ที่ใช้

flexbox footers สำหรับ divi 5

วิธีการติดตั้งเลย์เอาต์

ให้โฟลเดอร์ดาวน์โหลดของคุณปิดเพื่อเริ่มการนำเข้าเว็บไซต์ Divi ของคุณ

1. การนำเข้าเลย์เอาต์ลงในห้องสมุด Divi

ไปที่ Divi → Divi Library

flexbox footers สำหรับ divi 5

เมื่อมีให้คลิกปุ่มนำเข้าและส่งออกเพื่อติดตั้งไฟล์

flexbox footers สำหรับ divi 5

ค้นหาไฟล์ FlexBox Footer Layouts (ทั้งหมด) และคลิกเพื่อนำเข้า

flexbox footers สำหรับ divi 5

2. สร้างเทมเพลตส่วนท้ายใหม่

ไปที่ Divi → Theme Builder

flexbox footers สำหรับ divi 5

สร้างเทมเพลตส่วนท้ายใหม่หรือเปิดอันที่มีอยู่

flexbox footers สำหรับ divi 5

3. อัพโหลดเค้าโครงส่วนท้าย

เมื่อคุณอยู่ในพื้นที่ส่วนท้ายคุณสามารถใช้ไลบรารี Divi เพื่อเลือกเค้าโครงส่วนท้ายที่คุณเลือก คลิก ปุ่มเพิ่มเค้าโครง ที่มุมซ้ายบนของตัวสร้างธีม

flexbox footers สำหรับ divi 5

เลือก เลย์เอาต์ที่บันทึกไว้

flexbox footers สำหรับ divi 5

คลิกเค้าโครงส่วนท้ายที่คุณต้องการเพิ่มลงในตัวสร้างธีม

flexbox footers สำหรับ divi 5

คลิกที่ปุ่ม Layout นี้ เพื่อโหลดส่วนท้าย

flexbox footers สำหรับ divi 5

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

ค่าเริ่มต้นกับ Prestyled: คุณควรเลือกแบบไหน?

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

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

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

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

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

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

1. เลือกโมดูลสำหรับการปรับแต่ง

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

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

flexbox footers สำหรับ divi 5

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

flexbox footers สำหรับ divi 5

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

2. ปรับการตั้งค่า FlexBox สำหรับการควบคุมเค้าโครง

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

flexbox footers สำหรับ divi 5

คุณสามารถปรับค่าในฟิลด์ Gap แนวตั้ง เพื่อควบคุมระยะห่าง

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

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

flexbox footers สำหรับ divi 5

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

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

Wrap ทำให้มั่นใจได้ว่ารายการ Flex จะห่อหุ้มบรรทัดเพิ่มเติมโดยอัตโนมัติเมื่อไม่สามารถใส่ได้และห่อเนื้อหาย้อนกลับในลำดับย้อนกลับ

flexbox footers สำหรับ divi 5

3. เพิ่มลิงค์ตามความจำเป็น

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

flexbox footers สำหรับ divi 5

ขยายลิงค์ดรอปดาวน์และเพิ่มลิงก์ไปยังบัญชีหรือหน้าของคุณในฟิลด์ URL ลิงค์ของบัญชี

flexbox footers สำหรับ divi 5

อย่าลืมบันทึกส่วนท้ายของคุณก่อนที่จะออกจากตัวสร้างธีม

flexbox footers สำหรับ divi 5

ใช้ Divi 5 เพื่อสร้างส่วนท้ายของคุณวันนี้

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

ดาวน์โหลด Divi 5Learn เพิ่มเติมเกี่ยวกับ Divi 5