การใช้งาน การจัดการ Footer

คู่มือตั้งค่า Footer เว็บไซต์ Ketshopweb: ตั้งค่า Background, Widget และ Layout

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

ตัวอย่างส่วน Footer บนหน้าเว็บไซต์

วิธีการตั้งค่า Footer

คลิก "ปรับแต่ง" แล้วคลิก "Footer"

เมื่อเข้ามายังหน้า Footer จะปรากฏหน้าให้ตั้งค่า โดยแบ่งออกเป็น 3 รูปแบบการจัดการย่อยดังนี้

• 1 Background: เมนูสำหรับการปรับแต่งพื้นหลังในส่วนของ Footer
• 2 Widget: เมนูสำหรับจัดการกล่องการแสดงผลต่าง ๆ เพิ่ม-ลบกล่องเมนูได้
• 3 Layout: รูปแบบการแสดงผลของบริเวณด้านล่าง แต่ละ Layout แสดงผลต่างกัน

3 รูปแบบการจัดการย่อยของ Footer

1. การตั้งค่า Background Footer

• 1 คลิกที่รูปกุญแจไขควง

คลิกที่รูปกุญแจไขควง

จากนั้นจะปรากฏหน้าการตั้งค่าพื้นหลัง มี 2 เครื่องมือการตั้งค่า

1.1 "ตั้งค่า" — การตั้งค่าภาพพื้นหลัง (4 ส่วน)

• 1 Padding: ระยะห่างของตัวอักษรภายในภาพกับกรอบนอกสุด ปรับทั้ง 4 ด้านพร้อมกัน หรือกดปุ่มเพื่อปรับแยกแต่ละด้านได้
• 2 Margin: ระยะห่างของภาพพื้นหลังกับกรอบนอกสุด ปรับทั้ง 4 ด้านพร้อมกัน หรือกดปุ่มเพื่อปรับแยกแต่ละด้านได้
• 3 Corner: ความโค้งมนมุมของขอบภาพพื้นหลัง ปรับทั้ง 4 ด้านพร้อมกัน หรือกดปุ่มเพื่อปรับแยกแต่ละด้านได้
• 4 Border: กรอบของรูปภาพ ปรับทั้ง 4 ด้านพร้อมกัน หรือกดปุ่ม  เพื่อปรับแยกแต่ละด้าน สามารถตั้งค่าลักษณะสีของเส้นขอบได้ 8 แบบ
• 5 Shadow: เปิด-ปิดเงาของภาพพื้นหลัง

เครื่องมือตั้งค่าภาพพื้นหลัง Footer

1.2 "พื้นหลัง" — การตั้งค่าสีและรูปภาพพื้นหลัง

• 1 ส่วนของภาพพื้นหลัง คลิกตรงพื้นที่เพื่อใส่รูปภาพที่ต้องการ
• 2 ส่วนของสีพื้นหลัง สามารถเลือกสีได้
• 3 ค่าความทึบแสงของสีที่เลือก ยิ่งค่าน้อยสียิ่งจาง ยิ่งค่าเยอะสียิ่งเข้ม
• 4 ค่าความเบลอ/ความชัดเจนของรูปภาพ

เครื่องมือตั้งค่าสีและรูปภาพพื้นหลัง

2. การตั้งค่า Widget Footer

2.1 ตั้งค่าภาษา

• 1 เลือกโหมดภาษา Footer ระหว่างภาษาไทยและภาษาอังกฤษ แถบภาษาจะแสดงก็ต่อเมื่อเปิดโหมดใช้งานหลายภาษา โดยมีภาษาไทยเป็นพื้นฐาน

2.2 การตั้งค่าแถว โดยการเพิ่ม Footer

• 2 คลิกปุ่ม "เพิ่มแถว" เพื่อเพิ่มแถวเนื้อหาของ Footer

คลิกปุ่ม "เพิ่มแถว" เพื่อเพิ่มแถวเนื้อหา Footer

2.3 การเพิ่ม/แก้ไขรายละเอียดเนื้อหา

• 1 คลิกที่รูปบวก

คลิกที่รูปบวก

• 2 คลิกที่รูปบวก เพื่อเพิ่มจำนวนคอลัมน์

คลิกที่รูปบวก เพื่อเพิ่มจำนวนคอลัมน์

จากนั้นจะมี Pop up หน้าต่าง Element ให้เลือกเพื่อเพิ่มเนื้อหาที่ต้องการ เลือกเสร็จแล้วคลิก "Add Element"

เลือก Element แล้วคลิก "Add Element"

เมื่อเพิ่ม Element ส่วนต่าง ๆ แล้ว สามารถแก้ไขรายละเอียดเนื้อหาได้ ดังนี้

• 1 ปุ่มตั้งค่า — จัดการหน้าตั้งค่าได้
• 2 ปุ่มเพิ่มแถว
• 3 ปุ่มโคลนคอลัมน์ — คัดลอกคอลัมน์เพิ่มโดยมีเนื้อหารายละเอียดเหมือนกัน
• 4 ปุ่มลบเนื้อหารายละเอียดใน Section นั้น ๆ

ปุ่มตั้งค่า เพิ่มแถว โคลนคอลัมน์ และลบเนื้อหา

3. การตั้งค่า Layout Footer

• 1 ปุ่มตั้งค่า — จัดการหน้าตั้งค่าได้
• 2 ปุ่มเพิ่มแถว
• 3 ปุ่มโคลนคอลัมน์ — คัดลอกคอลัมน์เพิ่มอีก 1 คอลัมน์ โดยมีเนื้อหารายละเอียดเหมือนกัน
• 4 ปุ่มลบเนื้อหารายละเอียดของคอลัมน์นั้น ๆ

ปุ่มตั้งค่า เพิ่มแถว โคลนคอลัมน์ และลบเนื้อหาของ Layout Footer