การตกแต่งเว็บไซต์, การจัดการส่วน Header เว็บไซต์ (Top), คู่มือการใช้งาน, การตกแต่งเว็บไซต์(Design)

วิธีการตกแต่งส่วนบนของเว็บไซต์ (Header)

วิธีการตกแต่งส่วนบนของเว็บไซต์ (Header) เป็นการปรับแต่งส่วนด้านบนของเว็บไซต์ให้มีความสวยงามตามที่ต้องการ เช่น ปรับรูปแบบเลเอาท์ ตำแหน่งการแสดงผลเมนู ตำแหน่งรูปโลโก้ ข้อความ การเปิด-ปิดแสดงผล widget ต่างๆ รวมถึง social network ตามที่ต้องการ มีขั้นตอนดังนี้

layout1Top

การเลือกปรับแต่งส่วนบนของเว็บไซต์

  1. ไปที่เมนู Design
  2. เลือกเมนู Top
    เลือก top

การเพิ่มโลโก้ ในส่วน top ของเว็บไซต์ 

การเพิ่มโลโก้ในเว็บไซต์ สามารถเลือกเพิ่มรูปภาพหรือข้อความได้ และสามารถเลือกขนาดของรูปภาพและปรับแต่งข้อความตามความต้องการได้

– การใช้งาน Logo ในรูปแบบ ไฟล์รูปภาพ 

  1. โลโก้รูปภาพ (Logo)
  2. เลือกเมนู Logo
  3. เลือกใช้โลโก้เป็น Image (รูปภาพ)
    เลือก logoภาพ
  4. เลือกขนาดภาพโลโก้ (Logo size) ที่ต้องการ
    การกำหนดขนาดของ Logo สามารถทำได้ 2 แบบ  คือ
    – Auto : ขนาดของภาพโลโก้จะปรับขนาดอัตโนมัติ ตามขนาดไฟล์ภาพจริงของ Logo นั้นๆ

    – Fixed : ขนาดภาพโลโก้จะถูกกำหนดขนาดไซต์ตามที่ระบุ
    ตามตัวอย่าง ทีมงานจะเลือกขนากของ Logo เป็น แบบ Auto เพื่อ ให้  Logo แสดงผลตามขนาดที่ได้ออกแบบไว้
  5. คลิก บันทึก ข้อมูล
    ขนาดโลโก้
    .

ตัวอย่าง โลโก้รูปภาพที่อยู่ในส่วน Top ของเว็บไซต์
logoภาพ

การใช้งาน Logo ในรูปแบบ ตัวอักษร 

  1. เลือกเมนู Logo
  2. เลือกใช้ โลโก้เป็น ข้อความ (Text)
  3. ปรับแต่งข้อความตามที่ต้องการ
  4. คลิก บันทึก
    เลือกtext

ตัวอย่างโลโก้ข้อความที่อยู่ในส่วน Top ของเว็บไซต์

logoข้อความ

การปรับแต่ง background (พื้นหลัง) ในส่วน top ของเว็บไซต์
– การปรับแต่ง Top Background

  1. เลือกเมนู Background
  2. เลือก Top Background
  3. เลือกเมนู สี
  4. คลิกเลือกสีตามที่ต้องการ
  5. เลือก Choose เพื่อยืนยันการเลือกสี
  6. คลิก บันทึก ยืนยันสีที่ต้องการ
    backgroud สี

ตัวอย่าง สี background (พื้นหลัง) ในส่วน top ของเว็บไซต์

ตย.สีback

 

การปรับแต่งสี Top Bar

  1. เลือกเมนู Top Bar
  2. คลิก เลือกสีตามที่ต้องการ
  3. คลิก Choose สีที่ต้องการ
  4. บันทึก ยืนยันสีที่ต้องการ
    .
    เปลี่ยนสีtop bar

ตัวอย่าง การแสดงผล สี Top Bar

ตย.สีtopbar

 

การปรับใช้รูปภาพใน Top Background

  1. เลือกเมนู รูปภาพ
  2. คลิก Choose รูปภาพที่ต้องการ
  3. เลือก Background Position ที่ต้องการ
  4. บันทึก ยืนยันสีที่ต้องการ
    เลือกรูปtop background

ตัวอย่าง การแสดงผล รูป Top Background

ตย.รูปtop background

 

การเปิด-ปิด widget ในส่วน top ของเว็บไซต์

  1. ไปที่เมนู Widget
  2. เลือกเปิด ON-Off widge ที่ต้องการ
    widget
    .

หากต้องการแก้ไขรูปแบบของ widget ที่ต้องการ สามารถคลิกเมนู Style หรือ Manage เพื่อปรับแต่งรูปแบบหรือแก้ไขข้อมูลตามต้องการได้
ตัวอย่าง การแสดงผล widget ในส่วน top ของเว็บไซต์

 

ตย.wigget top

 

การปรับ layout ในส่วน Top ของเว็บไซต์

  1. ไปที่เมนู Layout
  2. เลือกรูปแบบ layout ที่ต้องการ
  3. คลิก บันทึก
    เมนูlayout
    .

ตัวอย่าง การแสดงผล layout ในส่วน Top ของเว็บไซต์

ตย.wigget top

เจ้าของเว็บไซต์ สามารถเลือกปรับแต่งความสวยงามในส่วนต่างๆของเว็บไซต์ ได้ตามรายละเอียดข้างต้นนี้ ได้ตามต้องการเลยค่ะ

หากมีข้อสงสัยหรือแนะนำสามารถส่งมาได้ตามช่องทางเหล่านี้