ข้ามไปยังเนื้อหาหลัก

ส่วนหัว

1. หน้านี้ใช้ทำอะไร​

หน้า ส่วนหัว ใช้เลือกเค้าโครงของแถบนำทางด้านบน (Navbar) และรูปแบบแถบเมนูเกมที่ผู้เล่นเห็นเมื่อเปิดเข้าสู่หน้าล็อบบี้ผ่านหน้าจอคอมพิวเตอร์และแท็บเล็ต ช่วยปรับแต่งการจัดวางโลโก้ ปุ่มคำสั่ง และแท็บค่ายเกมให้เหมาะสมกับความต้องการของเว็บไซต์ เหมาะสำหรับผู้ดูแลระบบและฝ่ายออกแบบแบรนด์

เค้าโครงที่เลือกในหน้านี้จะใช้เฉพาะบนหน้าจอคอมพิวเตอร์และแท็บเล็ตเท่านั้น ส่วนหน้าจอมือถือจะใช้การจัดวางจากเมนู เมนูมือถือ แยกต่างหากโดยอัตโนมัติ


2. ก่อนเริ่ม​

  • สิทธิ์การใช้งาน: ต้องได้สิทธิ์ 'ส่วนหัว' จากผู้ดูแลระบบก่อน จึงจะเปิดดูและเปลี่ยนเค้าโครงส่วนหัวในหน้านี้ได้ (หากไม่มีสิทธิ์แก้ไข จะดูตัวอย่างได้อย่างเดียว)
  • สิ่งที่ต้องเตรียม:
    • ตรวจสอบว่าได้ตั้งค่า โลโก้ และ สีธีม แล้ว หน้าตาตัวอย่างจะได้แสดงครบถ้วนสมบูรณ์
    • การพิจารณาจำนวนแท็บเกมที่เปิดใช้งานในระบบ หากมีแท็บเกมหลายแท็บ เค้าโครงบางแบบ (เช่น เมนูข้าง หรือปุ่มกระชับ) อาจช่วยให้ผู้เล่นเลื่อนหาเกมได้สะดวกขึ้น

3. หน้าตาของหน้านี้​

เมื่อเปิดเข้ามา จะพบส่วนประกอบสำคัญเรียงจากบนลงล่างดังนี้:

  1. ส่วนหัวของหน้า (Page Header): แสดงชื่อหน้า ส่วนหัว, คำอธิบายสั้น ๆ และแถบนำทาง (การตั้งค่า / ธีม / ส่วนหัว)
  2. การ์ดตัวอย่างบนหน้าเว็บ (Preview Card): กรอบจำลองหน้าจอขนาดใหญ่ที่วาดขึ้นจากโลโก้ สีธีม และแท็บเกมจริงของเว็บไซต์ ตามความกว้างหน้าจอของคุณในขณะนั้น
  3. สวิตช์สลับมุมมองตัวอย่าง (Preview Toggles): อยู่มุมขวาบนของการ์ดตัวอย่าง ใช้ทดสอบการแสดงในสถานะต่าง ๆ:
    • สวิตช์ ผู้เล่นเข้าสู่ระบบแล้ว: สลับดูหน้าตาของแถบส่วนหัวระหว่างผู้เยี่ยมชมทั่วไปกับผู้เล่นที่ล็อกอินแล้ว
    • สวิตช์ หุบเมนูข้าง: สลับดูหน้าตาเมนูข้างระหว่างแบบกางออกเต็มความกว้างกับแบบหุบย่อเหลือแต่ไอคอน (จะแสดงขึ้นมาเฉพาะเมื่อเลือกเค้าโครงแบบที่ 4: เมนูข้าง)
  4. แถบประวัติการแก้ไข (Page Audit): แสดงเวอร์ชันข้อมูล, ชื่อผู้บันทึกล่าสุด, ประเภทผู้ใช้ และวันเวลาที่แก้ไขล่าสุด
  5. ส่วนเลือกเค้าโครงส่วนหัว (Select Layout): แผงการ์ดเค้าโครงทั้งหมด 6 รูปแบบ พร้อมภาพจำลองขนาดเล็กและคำอธิบายจุดเด่นของแต่ละแบบ
  6. แถบคำสั่งด้านล่าง (Action Bar): แถบลอยแสดงปุ่ม ยกเลิก และปุ่ม บันทึก จะเปิดให้กดเมื่อมีการเลือกเค้าโครงที่ต่างไปจากที่ใช้งานอยู่

4. ค้นหาและตัวกรอง​

หน้านี้ไม่มีช่องค้นหาหรือตัวกรองตาราง แต่มีเครื่องมือสลับมุมมองตัวอย่าง 2 ตัวเลือกที่มุมขวาบนของการ์ดตัวอย่าง:

สวิตช์สลับมุมมองเมื่อเปิดใช้งาน (สีน้ำเงิน)เมื่อปิดใช้งาน (สีเทา)ประโยชน์ในการตรวจสอบ
ผู้เล่นเข้าสู่ระบบแล้วแสดงปุ่ม ฝากเงิน, ถอนเงิน, ยอดเงินคงเหลือในกระเป๋า และชื่อบัญชีผู้เล่นแสดงปุ่ม เข้าสู่ระบบ และปุ่ม สมัครสมาชิก สำหรับผู้เยี่ยมชมทั่วไปตรวจสอบว่าปุ่มการเงินและข้อมูลผู้เล่นจัดวางได้สมดุล ไม่ล้นแถบส่วนหัว
หุบเมนูข้าง (เฉพาะเค้าโครงที่ 4)เมนูเกมด้านซ้ายจะหดเหลือเพียงไอคอนขนาด 88 pxเมนูเกมด้านซ้ายจะกางออกเต็มความกว้าง 224 px พร้อมชื่อหมวดหมู่ตรวจสอบว่าหน้าเว็บยังคงใช้งานง่ายเมื่อผู้เล่นเลือกหุบเมนูเพื่อเพิ่มพื้นที่ดูเกม

5. ตารางข้อมูล​

รายละเอียดเค้าโครงส่วนหัวทั้ง 6 รูปแบบ​

รูปแบบชื่อเค้าโครงการจัดวางแถบบน (Navbar)ลักษณะแถบเมนูเกม (Game Menu)ความเหมาะสมในการใช้งาน
1แยกสองบาร์ (Two bars)โลโก้อยู่ฝั่งซ้าย ปุ่มการเงินและปุ่มสมาชิกอยู่ฝั่งขวาแท็บเกมแบบกล่องไอคอนขนาดใหญ่ในแถวถัดลงมา (สูง 96 px)รูปแบบคลาสสิก ไอคอนเด่นชัด เหมาะสำหรับเว็บทั่วไป
2โลโก้กลางสองบาร์ (Logo in the middle)โลโก้อยู่ตรงกึ่งกลาง แยกลิงก์เมนูและปุ่มสมาชิกไว้สองฝั่งแท็บเกมแบบกล่องไอคอนขนาดใหญ่เหมือนแบบแรกเหมาะสำหรับแบรนด์ที่ต้องการเน้นความโดดเด่นของโลโก้
3แบบแท็บ (Tabs)โลโก้อยู่ฝั่งซ้าย ปุ่มสมาชิกรวมอยู่ในแถวเดียวกันแท็บเกมบรรทัดเดียว มีเส้นสีธีมขีดใต้แท็บที่เลือก (สูง 72 px)ดูสะอาดตา เรียบหรู ประหยัดพื้นที่แนวตั้ง
4เมนูข้าง (Side menu)แถบบนแคบลง แสดงเฉพาะข้อมูลสำคัญและปุ่มผู้เล่นเมนูเกมถูกย้ายไปอยู่เป็นแถบแนวตั้งด้านซ้ายมือเหมาะสำหรับเว็บที่มีหมวดเกมเยอะ ผู้เล่นหุบเมนูข้างได้
5ปุ่มแนวนอนกระชับ (Compact buttons)แถบบนมาตรฐาน พร้อมแถบแท็บเกมในแถวเดียวแท็บเกมเป็นปุ่มสี่เหลี่ยมมุมมนกระชับเรียงในแนวนอนเหมาะสำหรับเว็บที่ต้องการความคล่องตัวและทันสมัย
6ปุ่มแคปซูลมีขอบ (Outlined capsules)แถบบนมาตรฐาน โลโก้ซ้าย ปุ่มขวาแท็บเกมเป็นปุ่มทรงแคปซูลมน มีเส้นขอบบางล้อมรอบสไตล์มินิมอล โมเดิร์น และดูสบายตา

ปุ่มคำสั่งบนการ์ดเค้าโครง​

ปุ่ม / องค์ประกอบลักษณะที่พบผลลัพธ์เมื่อกดเงื่อนไข
การ์ดเค้าโครงกรอบสี่เหลี่ยมพร้อมภาพพรีวิวจำลองเปลี่ยนภาพตัวอย่างในการ์ดด้านบนตามรูปแบบที่กดเลือกทันทีกดเลือกได้ตลอดเวลา
ป้าย "ใช้อยู่"ป้ายสีเขียวบนการ์ดบ่งบอกว่าเค้าโครงนี้คือรูปแบบที่หน้าเว็บจริงกำลังใช้งานอยู่ในปัจจุบันแสดงบนการ์ดเดียวเท่านั้น
เครื่องหมายถูกสีขาววงกลมสีฟ้าที่มุมขวาบนของการ์ดบ่งบอกว่าเค้าโครงนี้กำลังถูกเลือกอยู่ในแบบร่างแสดงบนการ์ดที่ถูกกดเลือก

6. ทีละขั้นตอน​

1. การเปลี่ยนเค้าโครงส่วนหัว​

  1. ไปที่เมนู รูปลักษณ์เว็บ > ส่วนหัว จากแถบเมนูด้านซ้าย
  2. เลื่อนลงมาที่ส่วน เลือกเค้าโครงส่วนหัว
  3. กดเลือกรูปแบบเค้าโครงที่ต้องการจาก 6 ตัวเลือก
  4. เลื่อนขึ้นไปดูการ์ด ตัวอย่างบนหน้าเว็บ ด้านบนเพื่อตรวจสอบผลลัพธ์
  5. ทดลองกดสลับสวิตช์ ผู้เล่นเข้าสู่ระบบแล้ว เพื่อตรวจดูความเรียบร้อยของปุ่มฝากเงินและยอดเครดิต
  6. เมื่อพอใจแล้ว ให้กดปุ่ม บันทึก ที่แถบลอยด้านล่าง
  7. ระบบจะแสดงข้อความแจ้งเตือนสีเขียวว่า "บันทึกเค้าโครงส่วนหัวแล้ว"

2. การยกเลิกและคืนค่าเดิมก่อนบันทึก​

  1. หากกดเลือกเค้าโครงใหม่แล้วต้องการเปลี่ยนใจกลับไปใช้รูปแบบเดิม ให้กดปุ่ม ยกเลิก ที่แถบคำสั่งด้านล่าง
  2. ระบบจะคืนค่าการแสดงกลับเป็นเค้าโครงที่มีป้าย ใช้อยู่ ทันที

7. หน้าแก้ไขหรือหน้าเพิ่ม​

หน้านี้เป็นการเลือกรูปแบบโดยตรง ไม่มีช่องกรอกข้อความยาว โดยมีตัวเลือกการตั้งค่าดังนี้:

ช่อง / ตัวเลือกต้องกรอกไหมใส่อะไรตัวอย่างข้อจำกัด
เลือกเค้าโครงส่วนหัวต้องเลือกกดเลือกหนึ่งใน 6 เค้าโครงมาตรฐานที่ระบบกำหนดแบบแท็บ (Tabs)เลือกได้ครั้งละ 1 รูปแบบเท่านั้น มีผลกับหน้าจอคอมพิวเตอร์และแท็บเล็ต

8. หน้าต่างป็อปอัพ (Popup / Modal)​

1. หน้าต่างแจ้งเตือนข้อมูลขัดแย้ง (Version Conflict)​

  • เปิดขึ้นมาเมื่อไหร่: เมื่อกดปุ่ม บันทึก แต่มีผู้ดูแลระบบคนอื่นบันทึกเค้าโครงส่วนหัวตัดหน้าไปก่อน
  • สิ่งที่เห็นในหน้าต่าง: ข้อความแจ้งเตือนสีแดงว่า "มีแอดมินคนอื่นบันทึกส่วนหัวก่อน โหลดค่าล่าสุดมาให้แล้ว กรุณาเลือกใหม่อีกครั้ง"
  • สิ่งที่ต้องทำ: ระบบจะดึงเค้าโครงล่าสุดที่บันทึกไว้มาแสดง ให้ตรวจดูความถูกต้องและกดเลือกรูปแบบที่ต้องการใหม่อีกครั้งก่อนกดบันทึก
  • ผลลัพธ์: ป้องกันการเขียนทับการตั้งค่าของผู้ดูแลระบบคนอื่น

2. หน้าต่างเตือนก่อนออกจากหน้า (Dirty Form Guard)​

  • เปิดขึ้นมาเมื่อไหร่: เมื่อกดเลือกเค้าโครงใหม่แล้วพยายามปิดหน้าต่างเบราว์เซอร์หรือเปลี่ยนไปเมนูอื่นโดยไม่ได้กดบันทึก
  • สิ่งที่เห็นในหน้าต่าง: หน้าต่างแจ้งเตือนของเบราว์เซอร์ว่ามีการตั้งค่าที่ยังไม่ได้รับการบันทึก
  • สิ่งที่ต้องทำ: กด ยกเลิก เพื่อกลับมาบันทึก หรือกดยืนยันออกจากหน้าหากต้องการละทิ้งการเปลี่ยนแปลง

9. สถานะและป้ายสี​

ป้ายสถานะ / สัญลักษณ์สีของป้ายความหมายสิ่งที่ต้องทำต่อ
ใช้อยู่เขียวเค้าโครงที่เปิดใช้งานอยู่บนหน้าเว็บไซต์จริงในปัจจุบันหากไม่ต้องการเปลี่ยนรูปแบบ ไม่ต้องทำอะไร
เครื่องหมายถูกสีขาวในวงกลมฟ้ารูปแบบที่กำลังถูกเลือกอยู่ในแบบร่างขณะนี้ตรวจดูพรีวิวด้านบนแล้วกดปุ่มบันทึก
กรอบเส้นขอบสีฟ้าฟ้าการ์ดเค้าโครงที่กำลังถูกเลือกและได้รับโฟกัสช่วยให้มองเห็นชัดเจนว่าเลือกแบบใดอยู่

10. คำถามที่เจอบ่อย / แก้ปัญหาเบื้องต้น​

  • ถ้าเปลี่ยนเค้าโครงส่วนหัวแล้ว แต่หน้าจอมือถือไม่เปลี่ยน:
    • รูปแบบในหน้านี้มีผลเฉพาะบนหน้าจอคอมพิวเตอร์และแท็บเล็ตเท่านั้น หากต้องการปรับเปลี่ยนการจัดวางแถบล่างของมือถือ ให้ไปที่เมนู รูปลักษณ์เว็บ > เมนูมือถือ
  • ถ้าปุ่มบันทึกเป็นสีเทา กดไม่ได้:
    • ตรวจสอบว่ารูปแบบที่เลือกอยู่คือรูปแบบเดิมที่มีป้าย ใช้อยู่ หรือไม่ หากไม่มีการเปลี่ยนรูปแบบ ปุ่มบันทึกจะไม่เปิดให้กด
  • ถ้าเลือกเค้าโครงแบบที่ 4 (เมนูข้าง) แล้วเมนูบังหน้าจอเกม:
    • เมนูข้างออกแบบมาให้ผู้เล่นกดปุ่มหุบเมนูย่อเหลือเพียงไอคอนขนาด 88 px ได้ตลอดเวลา ช่วยคืนพื้นที่หน้าจอสำหรับดูเกมได้อย่างเต็มที่
  • ถ้าภาพตัวอย่างบนหน้าจอตัดคำหรือแสดงไม่พอดี:
    • ภาพตัวอย่างจะคำนวณตามความกว้างจริงของหน้าจอคอมพิวเตอร์ที่คุณกำลังใช้งานอยู่ หากย่อหน้าต่างเบราว์เซอร์ลง ขนาดพรีวิวจะปรับลดสัดส่วนตามจริงอัตโนมัติ