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

ปุ่ม divi Builder โมดูลบล็อก divi

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

module resume divi builder.png

ค้นหาโมดูลสรุปในรายการโมดูลและคลิกเพื่อเพิ่มลงในเพจของคุณ รายการโมดูลสามารถค้นหาได้ซึ่งหมายความว่าคุณสามารถพิมพ์คำว่า "สรุป" จากนั้นคลิก Enter เพื่อค้นหาและเพิ่มโมดูลข้อความอธิบายโดยอัตโนมัติ! เมื่อเพิ่มโมดูลแล้วคุณจะได้รับการต้อนรับด้วยรายการตัวเลือกโมดูล ตัวเลือกเหล่านี้แบ่งออกเป็นสามกลุ่มหลัก: เนื้อหา , ความคิด et สูง .

ใช้กรณีแสดงรายการบริการของ บริษัท ในหน้าแรก

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

divi.png หน้าบริการ

หากต้องการเพิ่ม Blurbs ทั้งสี่ลงในเพจของคุณให้ใช้ตัวสร้างภาพเพื่อเพิ่มส่วนมาตรฐานที่มีแถวสี่คอลัมน์ จากนั้นเพิ่มโมดูล Blurb ในคอลัมน์แรกของแถว

อัปเดตการตั้งค่า Blurb ด้วยสิ่งต่อไปนี้:

ตัวเลือกเนื้อหา

ชื่อเรื่อง: [ป้อนชื่อบริการ]
เนื้อหา: [กรอกคำอธิบายบริการโดยย่อ]
URL: [เพิ่ม URL ไปยังหน้าบริการ]
ใช้ไอคอน: ใช่
ไอคอน: [เลือกไอคอนที่แสดงบริการของคุณ]

ตัวเลือกการออกแบบ

ไอคอนสี: # 42bb99 (สร้างสีที่สอดคล้องกับการออกแบบของไซต์)
ใช้ไอคอนขนาดตัวอักษร: ใช่
ขนาดตัวอักษรของไอคอน: 68px (ปรับขนาดไอคอน)
การวางแนวข้อความ: กึ่งกลาง -
ขนาดตัวอักษรส่วนหัว: 24px
ขนาดตัวอักษร: 18px
Body Line Height: 1.5em

ออกแบบบริการ divi.png

ตอนนี้ข้อความเกริ่นนำแรกของคุณเสร็จสิ้นแล้ว

รายชื่อบริการ divi builder.jpg

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

รายชื่อบริการทั้งหมด divi.jpg

ตัวเลือกเนื้อหาสรุป

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

พารามิเตอร์สรุปโมดูล wordpress.png

ชื่อเรื่อง

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

เนื้อหา

ช่องนี้เป็นที่ที่คุณสามารถป้อนเนื้อหาของข้อความของคุณ นอกจากนี้ข้อความ Blurb จะครอบคลุมความกว้างทั้งหมดของคอลัมน์ของคุณได้ถึง 550px

URL

วาง URL ของเว็บที่ถูกต้องในช่องนี้เพื่อเปลี่ยนชื่อ Blurb ของคุณให้เป็นลิงก์ การเว้นช่องนี้ว่างไว้จะทำให้ชื่อของคุณเป็นองค์ประกอบคงที่

URL ที่เปิด

ที่นี่คุณสามารถเลือกได้ว่าจะให้ลิงก์ของคุณเปิดในหน้าต่างใหม่หรือไม่

ใช้ไอคอน

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

ไอคอน

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

ใช้ไอคอน divi builder.png

ภาพ

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

สีพื้นหลัง

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

ภาพพื้นหลัง

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

ป้ายกำกับผู้ดูแลระบบ

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

ตัวเลือกการออกแบบโมดูลสรุป

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

ตัวเลือกการออกแบบ module resume divi.png

สีไอคอน

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

ไอคอนวงกลม

หากคุณเลือก“ ใช่” สำหรับการตั้งค่า“ ใช้ไอคอน” ตัวเลือกนี้จะปรากฏขึ้น ตัวเลือกนี้ช่วยให้คุณวางไอคอนของคุณในวงกลมสี หากคุณเลือก "ใช่" สำหรับการตั้งค่านี้คุณจะได้รับตัวเลือกเพิ่มเติมในการปรับแต่งสีและเส้นขอบของวงกลมของคุณ

สีของวงกลม

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

แสดงเส้นขอบของวงกลม

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

สีเส้นขอบของวงกลม

หากคุณเลือก "ใช่" สำหรับการตั้งค่า "แสดงกรอบวงกลม" ตัวเลือกนี้จะปรากฏขึ้น ที่นี่คุณสามารถปรับสีของเส้นขอบของวงกลม

ตำแหน่งรูปภาพ / ไอคอน

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

ใช้ขนาดตัวอักษรของไอคอน

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

สีข้อความ

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

การวางแนวข้อความ

เมนูแบบเลื่อนลงนี้ช่วยให้คุณระบุการวางแนวข้อความของคุณว่าจะจัดชิดซ้ายจัดกึ่งกลางหรือชิดขวา

แบบอักษรส่วนหัว

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

ขนาดตัวอักษรส่วนหัว

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

โมดูลสรุปหัวเรื่องสไตล์ของส่วน

สีข้อความส่วนหัว

ตามค่าเริ่มต้นสีข้อความทั้งหมดใน Divi จะปรากฏเป็นสีขาวหรือเทาเข้ม หากคุณต้องการเปลี่ยนสีของส่วนหัวให้เลือกสีที่คุณต้องการจากตัวเลือกสีโดยใช้ตัวเลือกนี้

ระยะห่างของตัวอักษรส่วนหัว

ระยะห่างของตัวอักษรมีผลต่อช่องว่างระหว่างตัวอักษรแต่ละตัว หากคุณต้องการเพิ่มช่องว่างระหว่างตัวอักษรแต่ละตัวของข้อความส่วนหัวของคุณให้ใช้แถบเลื่อนช่วงเวลาเพื่อปรับช่องว่างหรือป้อนขนาดของระยะห่างที่คุณต้องการในช่องป้อนข้อมูลทางด้านขวาของแถบเลื่อน ช่องป้อนข้อมูลรองรับหน่วยวัดที่แตกต่างกันซึ่งหมายความว่าคุณสามารถป้อน "px" หรือ "em" ขึ้นอยู่กับขนาดของคุณเพื่อเปลี่ยนประเภทหน่วย

ความสูงของแถวส่วนหัว

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

แบบอักษร Body

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

ขนาดแบบอักษร Body

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

สีตัวอักษร

ตามค่าเริ่มต้นสีข้อความทั้งหมดใน Divi จะปรากฏเป็นสีขาวหรือเทาเข้ม หากคุณต้องการเปลี่ยนสีของเนื้อหาให้เลือกสีที่ต้องการจากตัวเลือกสีโดยใช้ตัวเลือกนี้

ระยะห่างของตัวอักษร

ระยะห่างของตัวอักษรมีผลต่อช่องว่างระหว่างตัวอักษรแต่ละตัว หากคุณต้องการเพิ่มช่องว่างระหว่างตัวอักษรแต่ละตัวของเนื้อหาให้ใช้แถบเลื่อนช่วงเวลาเพื่อปรับช่องว่างหรือป้อนขนาดของระยะห่างที่คุณต้องการในช่องป้อนข้อมูลทางด้านขวาของแถบเลื่อน ช่องป้อนข้อมูลรองรับหน่วยวัดที่แตกต่างกันซึ่งหมายความว่าคุณสามารถป้อน "px" หรือ "em" ขึ้นอยู่กับขนาดของคุณเพื่อเปลี่ยนประเภทหน่วย

ความสูงของเส้นร่างกาย

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

ใช้เส้นขอบ

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

สีของเส้นขอบ

ตัวเลือกนี้มีผลต่อสีของเส้นขอบของคุณ เลือกสีที่กำหนดเองจากตัวเลือกสีเพื่อใช้กับเส้นขอบของคุณ

ความกว้างของเส้นขอบ

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

การกำหนดค่าของ sbourdires module resume divi builder.png

สไตล์ชายแดน

เส้นขอบรองรับรูปแบบที่แตกต่างกันแปดแบบ ได้แก่ : ทึบเส้นประจุดคู่ร่องสันในและจุดเริ่มต้น เลือกสไตล์ที่คุณต้องการจากเมนูแบบเลื่อนลงเพื่อใช้กับเส้นขอบของคุณ

ความกว้างของภาพสูงสุด

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

มาร์จิ้นที่กำหนดเอง

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

ช่องว่างภายในที่กำหนดเอง

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

ตัวเลือกขั้นสูงโมดูลสรุป

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

ส่วนสรุปโมดูล advance.png

รหัส CSS

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

ชั้น CSS

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

CSS ที่กำหนดเอง

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

ภาพเคลื่อนไหว / ไอคอน

สิ่งนี้ควบคุมทิศทางของแอนิเมชั่นการโหลดแบบขี้เกียจ

ข้อความ ALT จากรูปภาพ

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

ความชัดเจน

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

สำหรับบทช่วยสอนนี้ เราหวังว่าจะได้แสดงวิธีใช้โมดูลสรุปบน Divi