การตั้งค่าการสร้างแบรนด์ช่วยให้คุณนำเอกลักษณ์ธุรกิจไปใช้กับหน้าการจองสาธารณะ ตรงกับสีของคุณ เลือกแบบอักษรที่เสริมกัน และสร้างประสบการณ์ที่สม่ำเสมอซึ่งสร้างความเชื่อมั่นของลูกค้าตั้งแต่คลิกแรก
การเข้าถึงการตั้งค่าการสร้างแบรนด์
- ไปที่ การตั้งค่า ในเมนูนำทางหลัก
- คลิกแท็บ การสร้างแบรนด์
สีแบรนด์
ตั้งค่าสีหลักและสีเน้นที่ใช้ทั่วหน้าการจองสาธารณะของคุณ ปุ่ม ลิงก์ การไฮไลต์ และองค์ประกอบแบบโต้ตอบสะท้อนถึงจานสีของคุณ
| บทบาทสี | ที่ปรากฏ |
|---|---|
| สีหลัก | ปุ่มคำกระตุ้นการตัดสินใจหลัก (จองเลย ยืนยัน) สถานะที่ใช้งาน ช่วงเวลาที่เลือก |
| สีเน้น | ปุ่มรอง สถานะ hover การไฮไลต์ตกแต่ง |
| สีพื้นหลัง | พื้นหลังหน้า ค่าเริ่มต้นเป็นสีขาว ปรับสำหรับสุนทรียภาพที่อบอุ่นหรือเข้มขึ้น |
| สีข้อความ | ข้อความเนื้อหาบนหน้าการจอง |
ป้อนสีเป็นรหัสฮีกซ์ (เช่น #2D6A4F) หรือใช้ตัวเลือกสี การเปลี่ยนแปลงจะแสดงตัวอย่างแบบเรียลไทม์ในแผง ตัวอย่าง ทางด้านขวา
เคล็ดลับ: มุ่งหาอัตราส่วนความเปรียบต่างอย่างน้อย 4.5:1 ระหว่างสีข้อความและพื้นหลังเพื่อความสามารถในการอ่าน WellDesk จะแสดงคำเตือนความเปรียบต่างหากการรวมกันของคุณต่ำกว่าระดับที่เข้าถึงได้
แบบอักษร
เลือกตัวพิมพ์ที่ใช้บนหน้าการจองสาธารณะของคุณ:
| การตั้งค่า | ตัวเลือก |
|---|---|
| แบบอักษรหัวเรื่อง | การเลือก Google Fonts ที่เหมาะสำหรับหัวเรื่อง — Playfair Display, Raleway, Poppins และอื่น ๆ |
| แบบอักษรเนื้อหา | แบบอักษรที่สะอาดและอ่านง่ายสำหรับข้อความเนื้อหา — Inter, Lato, Open Sans และอื่น ๆ |
| ขนาดแบบอักษร | ขนาดพื้นฐานสำหรับข้อความเนื้อหา (ค่าเริ่มต้น 16px) หัวเรื่องปรับขนาดตามสัดส่วน |
เลือกแบบอักษรที่ตรงกับบุคลิกของแบรนด์ สปาหรูอาจเลือกแบบอักษรหัวเรื่องแบบ serif (Playfair Display) กับแบบอักษรเนื้อหาที่สะอาด (Inter) สตูดิโอฟิตเนสสมัยใหม่อาจใช้ Poppins สำหรับทั้งคู่
โลโก้และ Favicon
อัปโหลดหรืออัปเดตโลโก้ธุรกิจและ favicon เบราว์เซอร์โดยตรงจากแท็บการสร้างแบรนด์ สิ่งเหล่านี้ยังปรากฏในแท็บ ข้อมูลร้านค้า การเปลี่ยนแปลงในทั้งสองตำแหน่งจะสะท้อนในทั้งคู่
| สินทรัพย์ | รูปแบบที่แนะนำ | ขนาดขั้นต่ำ |
|---|---|---|
| โลโก้ | PNG (พื้นหลังโปร่งใส) หรือ SVG | 200 × 200 px |
| Favicon | PNG หรือ ICO | 32 × 32 px |
CSS ที่กำหนดเอง
สำหรับการปรับแต่งขั้นสูงนอกเหนือจากการควบคุมในตัว ช่อง CSS ที่กำหนดเอง ช่วยให้คุณใช้กฎสไตล์ชีทของตัวเองกับหน้าการจอง
/* ตัวอย่าง: ทำให้ปุ่มทั้งหมดโค้งมน */
.booking-btn {
border-radius: 2rem;
}CSS ที่กำหนดเองจะถูกนำไปใช้หลังสไตล์เริ่มต้นของ WellDesk ดังนั้นกฎของคุณจึงมีความสำคัญมากกว่า ใช้เครื่องมือนักพัฒนาเบราว์เซอร์เพื่อตรวจสอบชื่อคลาสองค์ประกอบก่อนเขียนกฎ
คำเตือน: CSS ที่กำหนดเองมีประสิทธิภาพแต่ไม่ได้รับการสนับสนุน — การเปลี่ยนแปลงโครงสร้างหน้าการจอง WellDesk อาจทำให้กฎที่กำหนดเองเสียหายหลังจากการอัปเดต ทดสอบอย่างละเอียดหลังจากการอัปเดตแพลตฟอร์ม WellDesk ทุกครั้ง
การดูตัวอย่างการเปลี่ยนแปลง
แผง ตัวอย่าง จะอัปเดตเมื่อคุณทำการเปลี่ยนแปลง เพื่อดูหน้าการจองเต็มรูปแบบในบริบท:
- คลิก เปิดตัวอย่างในแท็บใหม่
- นำทางผ่านขั้นตอนการจองอย่างที่ลูกค้าจะทำ
- กลับมาที่การตั้งค่าการสร้างแบรนด์และปรับแต่งตามต้องการ
- คลิก บันทึกการเปลี่ยนแปลง เมื่อพอใจ
เคล็ดลับและแนวทางปฏิบัติที่ดี
- ใช้สีแบรนด์ที่มีอยู่ — แยกรหัสฮีกซ์จากโลโก้หรือสื่อการตลาดที่มีอยู่โดยใช้เครื่องมือเลือกสีเพื่อความสม่ำเสมอ
- ทดสอบบนมือถือ — ลูกค้าส่วนใหญ่จองบนสมาร์ทโฟน เปิดตัวอย่างบนอุปกรณ์มือถือหรือใช้เครื่องมือนักพัฒนาเบราว์เซอร์เพื่อตรวจสอบเลย์เอาต์มือถือ
- จำกัดแบบอักษรไว้สองแบบ — การผสมแบบอักษรมากกว่าสองแบบ (หนึ่งสำหรับหัวเรื่อง หนึ่งสำหรับเนื้อหา) สร้างสัญญาณรบกวนทางภาพ ใช้คู่หนึ่งเพื่อผลลัพธ์ที่ขัดเกลา
- อัปโหลด favicon — favicon ที่มีแบรนด์ทำให้หน้าการจองของคุณดูเป็นมืออาชีพมากขึ้นและช่วยให้ลูกค้าระบุแท็บของคุณเมื่อมีหลายแท็บเปิดอยู่