การใช้งาน Custom column & section

Section Layout และ Custom Column วิธีวางโครงสร้างหน้าเว็บไซต์

Section Layout เป็นโครงสร้างที่ใหญ่ที่สุดในเว็บไซต์ และเป็นโครงสร้างแรกที่ต้องสร้างไว้เสมอ สำหรับวางโครงสร้างให้กับหน้าเว็บไซต์ก่อนเริ่มปรับแต่งเนื้อหาใดๆ

• ✓ Section Layout ทำหน้าที่ในการแบ่งหน้าเว็บไซต์ออกเป็นส่วนๆ
• ✓ Section Layout จะมีขนาดรวมกว้างเต็มหน้าเว็บ หรือเต็มในส่วนที่กำหนดไว้
• ✓ หน้าที่หลักของ Section Layout คือการวาง Layout ให้กับหน้าเว็บไซต์
• ✓ การเพิ่ม Custom Column จำเป็นต้องมี Section Layout ก่อนทุกครั้ง ถึงจะสร้าง Custom Column ได้

การเพิ่ม Section Layout

เข้าสู่ระบบจัดการเว็บไซต์ Ketshopweb แล้วทำตามขั้นตอนดังนี้

• 1 คลิก "ปรับแต่ง"
• 2 เลือกเมนู "Page Layouts"
• 3 เลือกเมนู "ปรับแต่งเนื้อหา"

• 4 คลิก "Add Section"

เมื่อคลิกไปแล้วจะมีหน้า Pop up ให้กดเพิ่ม Section

• 5 เลือก "Custom Column" จากนั้นคลิก "Add Section"

จะปรากฏ Custom Column ขึ้นในหน้า Page Layout พร้อมตัวอย่างหน้า Home

การตั้งค่า Custom Column

คลิกที่ ตั้งค่า Section เพื่อตั้งค่า Custom Column

เมื่อคลิกเสร็จแล้วจะมี Pop up "Custom Column Setting" ขึ้นมาเพื่อตั้งค่ารูปแบบของคอลัมน์ เครื่องมือการตั้งค่าต่างๆ มีดังนี้

• 1 เปลี่ยนรูปภาพ
• 2 กำหนดระยะห่างระหว่างคอลัมน์
• 3 ค่าความทึบแสงของคอลัมน์
• 4 ประเภทของเอฟเฟค (ต้องเปิด "Background parallax" ในตำแหน่งที่ 8 ก่อน)
• 5 ปรับสีพื้นหลัง
• 6 ปรับ Custom Columns ให้เต็มจอได้
• 7 เว้นระยะขอบซ้าย-ขวา
• 8 เปิดการตั้งค่า Parallax
• 9 ใส่ความเร็วของเอฟเฟคภาพได้
• 10 ปรับความเบลอของภาพได้
• 11 กำหนดระยะห่างบน-ล่างได้
• 12 เลือกจำนวนคอลัมน์ได้สูงสุด 4 คอลัมน์

การตั้งค่าและเพิ่ม Element ใน Column Section

คลิกพื้นที่ว่างในกรอบ

• 6 คลิก "Add Element"

• 7 เลือก Element ตามที่ต้องการ ตัวอย่างเลือก Space Column จากนั้นกด "Add Element" และสามารถปรับแต่งได้ตามต้องการ

• 8 คลิก "Save" หลังจากตั้งค่าสำเร็จ