มีหลายวิธีทำได้ แต่ผมจะแนะนำทั้งแบบ ใช้ปลั๊กอินสำเร็จรูป และ โค้ด CSS เอง
ใช้ปลั๊กอินสำเร็จรูป
ปลั๊กอินบางตัวสามารถปรับสีเว็บได้ทั้งหน้า:
ตัวอย่างปลั๊กอิน
- WP Accessibility Helper (WAH)
- มีฟีเจอร์ “High Contrast” และปรับโทนสี
- สามารถปรับให้เป็น Grayscale / ขาวดำ ได้
- ใช้งานง่าย ปรับสีได้ทั้งเว็บ
- ลิงก์ปลั๊กอิน
- Accessibility Tools
- ฟีเจอร์ปรับสีเว็บ เช่น grayscale, dark mode, high contrast
- เพิ่มปุ่มให้ผู้ใช้เลือกหรือบังคับทั้งเว็บ
- ลิงก์ปลั๊กอิน
- Custom CSS / Simple Custom CSS
- ใช้ใส่ CSS เอง (ง่ายและเบา)
- ไม่ต้องติดตั้งปลั๊กอินใหญ่
ใช้ CSS เปลี่ยนเป็น Grayscale
ถ้าไม่อยากใช้ปลั๊กอินใหญ่ สามารถใส่ CSS ง่าย ๆ ได้:
/* ใส่ใน Appearance → Customize → Additional CSS */
html {
filter: grayscale(100%);
}
ข้อดี
- ใช้งานง่ายมาก
- ไม่ต้องติดตั้งปลั๊กอินเพิ่ม
- เปลี่ยนได้ทั้งเว็บโดยอัตโนมัติ
ข้อเสีย
- เปลี่ยนเฉพาะ การแสดงผล ของสี ไม่ได้แก้รูปภาพจริง
- บางปลั๊กอินหรือธีมอาจ override filter
สรุป
- ถ้าต้องการง่ายสุด → ใช้ CSS
filter: grayscale(100%);
