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

การใช้งาน การปรับแต่งรูปแบบ Header

"Header" เป็นส่วนที่อยู่ตอนบนสุดของหน้าแรกเว็บไซต์ อีกทั้งยังเป็นส่วนที่สำคัญที่ช่วยดึงดูดผู้ชมให้ติดตามเนื้อหา สินค้า หรือข้อมูลอื่นๆ ที่อยู่ภายในเว็บไซต์

K
KetShopWeb Team
2022-12-20 12:27:39
การใช้งาน การปรับแต่งรูปแบบ Header
Header เป็นส่วนที่อยู่ตอนบนสุดของหน้าแรกเว็บไซต์ อีกทั้งยังเป็นส่วนที่สำคัญที่ช่วยดึงดูดผู้ชมให้ติดตามเนื้อหา สินค้า หรือข้อมูลอื่นๆ ที่อยู่ภายในเว็บไซต์


การปรับแต่งรูปแบบ Header ส่วนของ Header จะแบ่งเป็น 2 ส่วนหลักๆ คือ Navigation Menu กับ Top Bar


การใช้งาน การปรับแต่งรูปแบบ Header

การตั้งค่า Navigation Menu

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

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

(ตำแหน่งที่ 2) คลิก "Header"


การใช้งาน การปรับแต่งรูปแบบ Header


(ตำแหน่งที่ 3) คลิกเมนู "Navigation" 


การใช้งาน การปรับแต่งรูปแบบ Header


เลือกรูปแบบ Navigation Layout ที่ต้องการโดยมีทั้งหมด 4 รูปแบบดังนี้


การใช้งาน การปรับแต่งรูปแบบ Header


ตัวอย่างการใช้งาน "Navigation Layout"

1. รูปแบบมาตรฐาน 

การใช้งาน การปรับแต่งรูปแบบ Header

        

2. รูปแบบเน้นใช้งานเมนู

การใช้งาน การปรับแต่งรูปแบบ Header

     

3. รูปแบบสมัยใหม่

การใช้งาน การปรับแต่งรูปแบบ Header


4. แฮมเบอร์เกอร์เมนู

การใช้งาน การปรับแต่งรูปแบบ Header


สีพื้นหลัง Navigation 

สามารถปรับแต่งสีได้ในหน้าเดิม โดยมีเครื่องมือปรับแต่งดังนี้

(ตำแหน่ง A) เปลี่ยนสีพื้นหลัง 

(ตำแหน่ง B) ใช้งานพื้นหลังโปร่งใส 

(ตำแหน่ง C) เปิดใช้งานพื้นหลังเมนู ในกรณีที่เปิดใช้งานพื้นหลังโปร่งใส 


การใช้งาน การปรับแต่งรูปแบบ Header


 ตัวอย่าง การปิดใช้งานพื้นหลังโปร่งใส

การใช้งาน การปรับแต่งรูปแบบ Header


ตัวอย่าง การเปิดใช้งานพื้นหลังโปร่งใส

การใช้งาน การปรับแต่งรูปแบบ Header


รูปภาพ

สามารถตั้งค่าโดยใส่ Logo ร้านค้าและรูปภาพตะกร้าสินค้า

การใช้งาน การปรับแต่งรูปแบบ Header


การตั้งค่าอื่นๆ
เต็มหน้าจอ เป็นเปิดการใช้งานการตั้ง Header ให้ขยายใหญ่ขึ้นตามความกว้างของหน้าจอ

การใช้งาน การปรับแต่งรูปแบบ Header


ตรึงเมนู  เป็นเปิดการใช้งานการตั้งค่าสกอร์ลงข้างล่างเมนู ส่งผลให้แถบเมนูตรึงอยู่ด้านบนเสม

การใช้งาน การปรับแต่งรูปแบบ Header



การตั้งค่า Menu

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

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

(ตำแหน่งที่ 2) คลิก "Header"


การใช้งาน การปรับแต่งรูปแบบ Header


(ตำแหน่งที่ 3) สามารถทำการตั้งค่ารูปแบบเมนูได้โดยการคลิกที่แท็บ "Menu"


การใช้งาน การปรับแต่งรูปแบบ Header

เลือกรูปแบบเมนู โดยมีทั้งหมด 6 รูปแบบ ดังนี้


การใช้งาน การปรับแต่งรูปแบบ Header


1.กรอบเต็ม

ตัวอย่างเมนูแบบกรอบเต็ม

การใช้งาน การปรับแต่งรูปแบบ Header

2.กรอบพอดีเมนู

ตัวอย่างเมนูแบบกรอบพอดีเมนู

การใช้งาน การปรับแต่งรูปแบบ Header

3. กรอบโค้ง

ตัวอย่างเมนูแบบกรอบโค้ง

การใช้งาน การปรับแต่งรูปแบบ Header


4. เส้นขอบล่าง

ตัวอย่างเมนูแบบเส้นขอบล่าง

การใช้งาน การปรับแต่งรูปแบบ Header

5. เส้นขอบรอบ

ตัวอย่างเมนูแบบเส้นขอบรอบ

การใช้งาน การปรับแต่งรูปแบบ Header

6. เส้นขอบมน

ตัวอย่างเมนูแบบเส้นขอบมน

การใช้งาน การปรับแต่งรูปแบบ Header




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

http://www.ketshopweb.com

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

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

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