การใช้งาน Image gallery element

เลือกรูปภาพแต่งเว็บไซต์ให้ดูดี มีระดับได้ด้วย Image gallery element

K
Ketshopweb Team
2022-12-14 14:45:21
การใช้งาน Image gallery element

User Guide · Image Gallery Element

Image Gallery Element วิธีเพิ่มและตั้งค่าแกลเลอรีรูปภาพบนเว็บไซต์

คู่มือการใช้งาน · ระบบ Ketshopweb · อัปเดตล่าสุด กรกฎาคม 2026

Image Gallery Element ช่วยให้ร้านค้าสามารถจัดแสดงรูปภาพหลายรูปในรูปแบบแกลเลอรีบนหน้าเว็บไซต์ได้อย่างสวยงาม พร้อมปรับแต่งความกว้าง ระยะห่างระหว่างรูป และใส่ข้อความบนรูปได้ตามต้องการ

วิธีเพิ่ม Image Gallery Element

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

  • 1 คลิก "ปรับแต่ง"
  • 2 เลือกเมนู "Page Layouts"
  • 3 คลิก "ปรับแต่งเนื้อหา"
เมนูปรับแต่ง Page Layouts และปรับแต่งเนื้อหา
  • 4 คลิก "Add Section"
ปุ่ม Add Section
  • 5 เลือก "Content" คลิก "Add Section"
เลือก Content แล้วคลิก Add Section
  • 6 คลิก "พื้นที่ว่างในกรอบ" Section ที่เพิ่มมาใหม่จะอยู่ขวามือ
คลิกพื้นที่ว่างในกรอบ Section
  • 7 คลิก "Add Element"
ปุ่ม Add Element
  • 8 เลือก "Image Gallery element" แล้วกด "Add Element"
เลือก Image Gallery element แล้วคลิก Add Element

เมื่อเพิ่ม Image Gallery element จะแสดงผลดังภาพตัวอย่าง

ตัวอย่างการแสดงผล Image Gallery element

การใส่รูปภาพเข้าไปใน Image Gallery Element

การใส่รูป

มีทั้งหมด 2 แบบในการนำภาพเข้ามา ได้แก่

  • 1 เพิ่มรูปภาพทั้งหมดภายใน Folder เป็นการอัปโหลดทีเดียวหลายๆ ภาพ
  • 2 เพิ่มรูปภาพทีละภาพ
สองวิธีในการนำภาพเข้าสู่ Image Gallery

เลือกรูปที่ต้องการได้เลย

เลือกรูปภาพที่ต้องการเพิ่มเข้าแกลเลอรี
ตัวอย่างหลังนำรูปภาพมาใส่ใน Image Gallery element แล้ว
ตัวอย่างหลังนำรูปภาพมาใส่ใน Image Gallery element แล้ว

การตั้งค่า Image Gallery Element มีรายละเอียดดังนี้

  • 1 คลิก "ตั้งค่า"
คลิกตั้งค่า Image Gallery element

การตั้งค่าจะแบ่งเป็นสองส่วน

สองส่วนของการตั้งค่า Image Gallery element
  • 1 ตั้งค่าความกว้าง ตัวอย่างเช่น ปรับขนาดความกว้างจาก 365 เป็น 200
ปรับขนาดความกว้างของรูปภาพจาก 365 เป็น 200
  • 2 ตั้งค่าระยะห่างระหว่างรูป
ตั้งค่าระยะห่างระหว่างรูปภาพ

การใส่ข้อความบนรูป

ดับเบิลคลิกที่รูปภาพ เพื่อทำการตั้งค่าข้อความที่แสดงในรูป

  • 1 Title ชื่อหัวข้อ เมื่อเปลี่ยนแล้วตำแหน่งของ Title จะแสดงผลดังภาพ
  • 2 Alt text ใส่รายละเอียดเพิ่มเติม นอกจากนั้นยังสามารถแก้ไขสีหรือตัวหนังสือได้ตามต้องการ
ตั้งค่า Title และ Alt text บนรูปภาพ
ตัวอย่างข้อความบนรูปภาพ
ตัวอย่าง
ตัวอย่างการแสดงผล Image Gallery พร้อมข้อความบนรูป

พร้อมสร้างแกลเลอรีรูปภาพสวยๆ ให้เว็บไซต์แล้วหรือยัง?

ลองใช้ Image Gallery Element วันนี้ เพื่อนำเสนอสินค้าและผลงานของร้านค้าได้อย่างเป็นระบบและสวยงาม

บทความโดยทีม Ketshopweb · ระบบจัดการร้านค้าออนไลน์หลายช่องทางแบบครบวงจร
Unified Commerce Platform · OMS + CRM + CDP for Thai Businesses
แชร์: