Branding
ปรับแต่งแบรนด์ โดยเมนูย่อยประกอบด้วย
- Colors ปรับชุดสีหลักของแบรนด์
- Fonts ปรับฟอนต์หลักของแบรนด์
- Icons ปรับไอคอนที่ใช้ในธีม
- Social ข้อมูล Social ต่างๆ เช่น Facebook, Line, X
Colors
ปรับแต่งชุดสี
โดยด้านบน สีที่ 1 จะใช้เป็นสีหลัก และ สีที่ 2 เป็นสีกรณีที่นำเมาส์ไปชี้ลิงก์ (hover)
สีอื่นๆ จะเป็นต้นแบบเวลาสร้าง Block แล้วต้องการตั้งค่าสี
ส่วนด้านล่าง เป็นสีของข้อความ (2 ระดับ) สีของพื้นหลัง (2 ระดับ) และสีขอบกรอบในฟอร์มต่างๆ (2 ระดับ)
Fonts
ปรับแต่งฟอนต์
เลือกชนิดของฟอนต์ที่ต้องการนำมาแสดง โดย
Source → System
คือฟอนต์ตามในระบบ จะเลือกได้แค่แบบไม่มีเชิง (Sans Serif) แบบมีเชิง (Serif) และแบบความกว้างเท่ากันทุกตัวอักษร (Monospace) เท่านั้น
ส่วน Normal และ Strong เป็นการเลือกนำหนักสำหรับตัวธรรมดาและตัวหนาของเนื้อหาเว็บไซต์
Source → Google
เลือกจาก Google Fonts โดยให้ดูรายชื่อฟอนต์ที่ fonts.google.com แล้วนำชื่อฟอนต์มากรอกให้ถูกต้อง ทั้งตัวใหญ่ ตัวเล็ก เว้นวรรค
Source → Adobe
เลือกฟอนต์จาก Adobe Fonts โดยต้องสร้าง Project ในระบบก่อน แล้วนำโค้ดมากรอกตามรูป
(รอเพิ่มเติมรายละเอียด)
Source → Upload
สามารถอัปโหลดฟอนต์นามสกุล woff2 มาใช้ได้ (แปลงฟอนต์ได้ที่ FontSquirrel หรือ Transfonter)
Set Heading Font
กรณีต้องการให้ฟอนต์พาดหัวแตกต่างจากฟอนต์เนื้อหา สามารถนำมาใส่ตรงนี้ได้ แล้วระบบจะกำหนดให้ h1, h2, h3, h4, h5, h6, nav, button, label, legend, blockquote ใช้ฟอนต์ Heading นี้แทน
Set Alt Heading Font
กรณีต้องการฟอนต์พาดหัวอีกฟอนต์ สามารถระบุเพิ่มตรงนี้ได้ แล้วเวลาเรียกใช้ ให้เพิ่ม Class _h_alt ไว้ที่ Block ต่างๆ ที่ต้องการ (อยู่มุมขวาล่าง ตามรูป)
Icons
เลือกไอคอนที่มากับธีม ซึ่งมักแสดงในกรณีที่ติดตั้ง WooCommerce
หากต้องการใช้ไอคอนที่ออกแบบเอง ให้คลิกปุ่ม ••• แล้วแปะโค้ด SVG ของไอคอนนั้นๆ ได้
ไอคอนที่มีให้ จะประกอบด้วย
- User สำหรับเมนูสมาชิก (My Account)
- Cart สำหรับเมนูตะกร้าสินค้า (Cart)
- Filter สำหรับแสดง WooCommerce Shop Sidebar เพื่อให้ผู้ใช้เลือกกรองหรือค้นหาสินค้าได้
- Category สำหรับแสดงในหน้า Post ด้านล่าง กรณีที่มีหลายหมวดหมู่
- Tags สำหรับแสดงในหน้า Post ด้านล่าง กรณีที่มีแท็ก
- Date และ Time ยังไม่ได้นำมาใช้งาน
Social
ตั้งค่า Social ต่างๆ ซึ่งสามารถนำไปแสดงหน้าเว็บผ่าน shortcode [s_social]
Social Network
กดที่รายการที่ต้องการแสดงผล (แสดงกรอบสีเข้ม)
สามารถลากขึ้นลงเพื่อจัดลำดับได้
Custom 1-3
สามารถตั้งค่าลิงก์และใส่รูปที่ต้องการเองได้
Icon Size
ปรับขนาดไอคอนในแต่ละหน้าจอ
URL
ใส่ค่า URL ของ Social ต่างๆ