Display Mode รูปแบบหน้าจอและการปรับแต่งธีม • บทที่ 4/7

2.2 ปรับแต่งสีธีม โลโก้ และข้อความหัวตาราง (Theme Customizer)

ออกแบบโทนสีหัวตาราง สีตัวเลขคิว ฟอนต์ภาษาไทย 10 สไตล์ ข้อความหัวตาราง และภาพพื้นหลังแบรนด์ร้านได้อย่างอิสระผ่านหน้าจอปรับแต่งเต็มจอพร้อมระบบดูผลลัพธ์สด (Live Preview)

ขั้นตอนการปฏิบัติทีละขั้น

แตะปุ่ม "ปรับแต่งธีม" บนการ์ดเทมเพลตเพื่อเปิดหน้าปรับแต่งเต็มจอพร้อม Live Preview

Live Preview แบบเรียลไทม์

ในแท็บ "1. ธีม & จอแสดงผล" ให้แตะปุ่ม "ปรับแต่งธีม" บนการ์ดเทมเพลตที่ต้องการตกแต่ง แอปจะเปิดหน้า Theme Customizer แบบเต็มจอ แสดงหน้าจอตัวอย่างการแสดงผลจริงด้านซ้ายควบคู่กับแผงตั้งค่ารายหมวดทางด้านขวา เห็นทุกการเปลี่ยนแปลงแบบเรียลไทม์ทันที

ขั้นตอนที่ 1: แตะปุ่ม "ปรับแต่งธีม" บนการ์ดเทมเพลตเพื่อเปิดหน้าปรับแต่งเต็มจอพร้อม Live Preview — 2.2 ปรับแต่งสีธีม โลโก้ และข้อความหัวตาราง (Theme Customizer) (Display Mode) | EaterQ — แตะปุ่ม "ปรับแต่งธีม" บนการ์ดเทมเพลตเพื่อเข้าสู่หน้าปรับแต่งเต็มจอพร้อมดูผลลัพธ์สดด้านซ้าย

กำหนดสีหัวตาราง สีตัวเลขคิว และสีไฮไลท์กระพริบให้ตรงกับแบรนด์ร้าน (CI)

ถาดสี 32 เฉด & รหัส #HEX

แตะปุ่ม SELECT ท้ายองค์ประกอบที่ต้องการเปลี่ยนสี ไม่ว่าจะเป็นสีหัวตาราง สีพื้นหลังกล่องคิว สีตัวเลขคิวปกติ สีคิวกำลังจัดเตรียม หรือสีกระพริบแจ้งเตือนตอนเรียกคิว สามารถจิ้มเลือกจากถาดสีมาตรฐาน 32 เฉด หรือพิมพ์รหัสสีแบรนด์ (#HEX) ได้อย่างแม่นยำ

ขั้นตอนที่ 2: กำหนดสีหัวตาราง สีตัวเลขคิว และสีไฮไลท์กระพริบให้ตรงกับแบรนด์ร้าน (CI) — 2.2 ปรับแต่งสีธีม โลโก้ และข้อความหัวตาราง (Theme Customizer) (Display Mode) | EaterQ — แยกตั้งค่าสีได้ครบทุกจุด ทั้งเลือกจากถาดสี 32 เฉด หรือกรอกรหัสสี #HEX ประจำแบรนด์ร้าน

แก้ไขข้อความหัวตาราง เลือกฟอนต์ไทย 10 สไตล์ และตั้งจำนวนแถวคิว

ฟอนต์ 10 แบบ & ปรับคำอิสระ

ปรับเปลี่ยนข้อความหัวตารางทั้งภาษาไทยและซับไตเติลภาษาอังกฤษให้ตรงกับบริการของร้าน เช่น เปลี่ยนเป็น "เชิญเข้าโต๊ะ", "รับเครื่องดื่ม" หรือ "กำลังจัดเตรียม" พร้อมเลือกฟอนต์ไทยได้ 10 สไตล์ (เช่น Kanit, Prompt, Sarabun, Chakra Petch) และกำหนดจำนวนแถวคิว (5–10 แถว)

อัปโหลดภาพพื้นหลังแบรนด์พร้อมโลโก้ร้าน หรือเลือกจากคลัง Presets สำเร็จรูป

รองรับภาพ Full HD & Presets

กดปุ่ม "เลือกภาพจากเครื่อง (Browse)" เพื่อนำไฟล์ภาพพื้นหลังที่มีโลโก้และกราฟิกแบรนด์ของร้าน (แนะนำขนาด 1920×1080 px แนวนอน รองรับ JPG, PNG, WebP ผ่านเครื่องหรือ USB) ขึ้นแสดงเต็มจอทีวี หรือเลือกใช้ชุดภาพพื้นหลัง Presets ระดับพรีเมียมที่มีมาให้ในแอปได้ทันที

ขั้นตอนที่ 4: อัปโหลดภาพพื้นหลังแบรนด์พร้อมโลโก้ร้าน หรือเลือกจากคลัง Presets สำเร็จรูป — 2.2 ปรับแต่งสีธีม โลโก้ และข้อความหัวตาราง (Theme Customizer) (Display Mode) | EaterQ — อัปโหลดภาพพื้นหลังแบรนด์ร้านระดับ Full HD จากเครื่อง/USB หรือเลือกชุดภาพ Presets สำเร็จรูป

กดปุ่มสีส้ม "บันทึก" เพื่อใช้ดีไซน์ใหม่ทันที หรือกดรีเซ็ตกลับค่าเริ่มต้นได้ทุกเมื่อ

แยกจำค่าตามแต่ละเทมเพลต

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

ขั้นตอนที่ 5: กดปุ่มสีส้ม "บันทึก" เพื่อใช้ดีไซน์ใหม่ทันที หรือกดรีเซ็ตกลับค่าเริ่มต้นได้ทุกเมื่อ — 2.2 ปรับแต่งสีธีม โลโก้ และข้อความหัวตาราง (Theme Customizer) (Display Mode) | EaterQ — กดปุ่ม "บันทึก" มุมขวาบนเพื่อใช้งานดีไซน์ใหม่ทันที พร้อมปุ่มรีเซ็ตกลับค่ามาตรฐานได้ตลอดเวลา

สรุปจุดสำคัญที่ควรรู้

ดูตัวอย่างผลลัพธ์สด (Live Preview) ขณะปรับสีและข้อความได้ทันที
รองรับทั้งถาดสี 32 เฉด รหัสสี #HEX และฟอนต์ภาษาไทย 10 สไตล์
ใส่ภาพพื้นหลังโลโก้แบรนด์ร้านระดับ Full HD หรือเลือก Presets ในตัวได้
แยกบันทึกดีไซน์อิสระรายเทมเพลต และกดรีเซ็ตค่าเริ่มต้นได้เสมอ

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