สั่งซื้อเทมเพลต
คลิปวิดีโอนี้เป็นคู่มือสอน "การจัดการตำแหน่ง HEAD IMAGE" สำหรับเว็บไซต์ที่ใช้ Template จาก Hitztheme ครับ โดยปกติตำแหน่งนี้จะใช้แสดงในหน้าอื่นๆ เพื่อความสวยงาม แต่ก็สามารถประยุกต์ใช้ในหน้าแรกเพื่อเพิ่มชุดข้อมูลต่อจากส่วนสไลด์ได้เช่นกันครับ [01:21]
สรุปเนื้อหาและขั้นตอนการปรับแต่งมีดังนี้:
1. การเข้าถึงเมนูตั้งค่า [01:49]
- ไปที่หลังบ้านของเว็บไซต์ เลือกเมนู Extensions > Templates > Styles
- คลิกเลือก Template ที่ใช้งาน และไปที่แถบ "ปรับโครงสร้างหน้าอื่นๆ" (Other Page Structure)
- เลื่อนลงมาที่หัวข้อที่ 3 "ส่วน Head Image" [02:16]
2. การปรับขนาดและการแสดงผล [02:27]
- การใช้งาน: สามารถเปิดหรือปิดตำแหน่ง Head Image ได้ตามต้องการ [02:32]
- ขนาด (Width): เลือกได้ระหว่าง แบบเต็มหน้าจอ (Full Screen) หรือ แบบกึ่งกลาง (Center) ตาม Body หลักของเว็บ [03:00]
3. การจัดการรูปภาพพื้นหลัง (Background) [03:31]
- การใส่รูปพื้นหลัง: สามารถอัปโหลดรูปภาพ (แนะนำขนาดกว้างประมาณ 1920-2000px) เพื่อใช้เป็น Background ของส่วนนี้ได้ [06:45]
- ตำแหน่งรูป: เลือกให้รูปชิดบนหรือชิดล่างเพื่อโชว์ส่วนสำคัญของภาพ [08:10]
- Background Fix: กำหนดได้ว่าจะให้รูปเลื่อนตามการสกอร์หน้าจอ หรือให้รูปอยู่กับที่ (Fixed) เพื่อสร้างมิติให้เว็บไซต์ [09:03]
- สีพื้นหลัง: หากไม่ใช้รูป สามารถกำหนดสีพื้นหลังแบบเรียบๆ ได้ [04:10]
4. การปรับระยะห่าง (Spacing) [04:55]
- ระยะห่างภายใน (Padding): กำหนดช่องว่างจากขอบ Head Image เข้ามาหาเนื้อหา [05:01]
- ระยะห่างภายนอก (Margin): กำหนดระยะห่างระหว่างส่วน Head Image กับส่วนประกอบอื่นๆ ของเว็บ (เช่น เว้นระยะบน-ล่างให้ดูไม่ติดกันจนเกินไป) [05:22]
5. การปรับแต่งตัวอักษรและหัวข้อ [09:40]
- สีข้อความและลิงก์: สามารถกำหนดสีตัวอักษร สีลิงก์ และสีเมื่อเอาเมาส์ไปชี้ (Hover) ได้ [09:45]
- หัวข้อ (H1-H5): ปรับแต่งสีและความหนาของตัวอักษรที่เป็นส่วนหัวข้อในตำแหน่งนี้ได้ [10:30]
ข้อแนะนำเพิ่มเติม: ตแหน่ง Head Image นี้เน้นการแสดงผลรูปภาพเป็นหลัก หากมีการนำไปใช้ในหน้าแรกจะช่วยให้คุณสามารถเพิ่มชุดข้อมูลใหม่ๆ เข้าไปได้อีกหนึ่งตำแหน่งต่อจากสไลด์โชว์ครับ [11:09]
