คู่มือการใช้งานversion 8ตกแต่งเว็บไซต์

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

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

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

Image gallery element 


เข้าสู่ระบบจัดการเว็บไซต์ Ketshopweb

(ตำแหน่งที่ 1) คลิก "ปรับแต่ง" 

(ตำแหน่งที่ 2) เลือกเมนู "Page Layouts" 

(ตำแหน่งที่ 3) คลิก "ปรับแต่งเนื้อหา" 



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


(ตำแหน่งที่ 4) คลิก "Add section" 



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



(ตำแหน่งที่ 5)  เลือกContent  คลิก “Add Section”


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



(ตำแหน่งที่ 6) คลิก "พื้นที่ว่างในกรอบSection ที่เพิ่มมาใหม่จะอยู่ขวามือ 


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


(ตำแหน่งที่7) คลิก "Add Element"


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


(ตำแหน่งที่ 8) เลือก Image Gallery element  แล้วกด “Add Element”


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



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


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



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

การใส่รูป 

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

1. คือการเพิ่มรูปภาพทั้งหมดภายใน Folder เป็นการอัพโหลดทีเดียวหลายๆภาพ
2. คือการเพิ่มรูปภาพทีละภาพ


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



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


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



ตัวอย่าง หลังนำรูปภาพมาใส่ใน Image gallery element แล้ว


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



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


(ตำแหน่งที่ 2) คลิก ตั้งค่า


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



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


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



(ตำแหน่งที่ 1) ตั้งค่าความกว้าง 

ตัวอย่าง ปรับขนาดความกว้างจาก 365 เป็น 200


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



(ตำแหน่งที่ 2) ตั้งค่าระยะห่างระหว่างรูป 


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


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

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

(ตำแหน่งที่ 1) Title ชื่อหัวข้อ เมื่อเปลี่ยนแล้วตำแหน่งของ Title จะแสดงผลดังภาพ

(ตำแหน่งที่ 2) Alt text ใส่รายละเอียดเพิ่มเติม นอกเหนือจากนั้นผู้ใช้งานยังสามารถแก้ไขสีหรือตัวหนังสือได้ตามต้องการ


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


ตัวอย่าง


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





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





Ketshopweb | ระบบร้านค้าออนไลน์ ขายคล่อง ส่งสะดวก ครบในที่เดียว

www.ketshopweb.com

เรายินดีให้คำปรึกษาการทำเว็บไซต์ฟรี ไม่มีค่าใช้จ่าย

ติดต่อมาที่ 02-038-5588 , email : sales@ketshopweb.com

คู่มือการใช้งานversion 8ตกแต่งเว็บไซต์KetShopWebE-commerce
แชร์: