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

ปรับเว็บไซต์ให้รองรับ theme-color ใน Chrome

อัปเดตล่าสุด / เผยแพร่เมื่อ
ปรับเว็บไซต์ให้รองรับ theme-color ใน Chrome

Chrome 39 สำหรับแอนดรอยด์เพิ่มการรองรับเมตาแท็ก theme-color ทำให้สามารถปรับสีแถบเครื่องมือของ Chrome เมื่อเปิดเว็บของเราได้ตามใจชอบ

ขั้นตอนการใช้งานนั้นง่ายมาก เพียงเพิ่มเมตาแท็กเข้าไป 1 บรรทัดภายในแท็ก ของเว็บไซต์ดังนี้

<meta name="theme-color" content="#โค้ดสี" />

และเมื่อเปิดเว็บโดยใช้ Chrome บนแอนดรอยด์ ตัวแถบเครื่องมือก็จะเปลี่ยนสีไปตามที่เรากำหนด อันนี้เป็นตัวอย่างของ Facebook ครับ

ตัวอย่างการใช้งาน theme-color ในเว็บไซต์ Facebook บนมือถือ
อัปเดต
นอกจาก Chrome แล้ว เบราว์เซอร์อื่นๆ ที่มีพื้นฐานจาก Chromium เช่น Brave, Samsung Internet Browser ก็รองรับเช่นกัน รวมถึงแอป Google บน iOS ด้วยครับ

ข้อมูลเบราว์เซอร์ที่รองรับ

Data on support for the meta-theme-color feature across the major browsers from caniuse.com

อ่านเพิ่มเติม: Google Developers

ความคิดเห็น

แสดงความคิดเห็นได้โดยไม่ต้องเข้าสู่ระบบ พิมพ์ความคิดเห็นแล้วกด Post ได้เลยครับ

RSS สร้างด้วย Hugo ซอร์สโค้ด