Cara Membuat Warna pada Address Bar dan Toolbar Chrome Android

912
Theme Color
Theme Color via developers.google.com

GULANGGULING.COM | KODING – Wuuuiiih akhirnya nulis babagan koding lagi. Kali ini mau berbagi sekalian mencatat soal ilmu atau cara membuat browser Chrome berwarna jika mengakses website kita.

Semenjak Android memasuki versi Lollipop dan Chrome diatas versi 39, kita sudah diperbolehkan mengubah style warna dari address bar browser dan toolbar dari sistem Android itu sendiri.

Jika anda sering mengakses situs tertentu dengan Google Chrome di Android, maka kadang anda akan melihat beberapa situs tampil dengan warna address bar dan toolbar yang seragam dengan situs mereka. Nah pertanyaannya bagaimanakah cara membuat website atau situs kita memiliki kemampuan untuk mengganti warna dari address bar dan toolbar tersebut?

Google Developers merilis bahwa fitur ini dapat kita gunakan dan pasang di setiap website untuk mengubah warna style tersebut. Caranya cukup mudah. Untuk mengubah warna address bar dan toolbar pada browser google chrome kita cukup menambahkan kode meta yang bernama “theme-color” pada header seperti code dibawah :

Nah, dengan kode diatas kita sudah dapat melihat tampilan website kita mampu membuat warna style yang berbeda pada browser Chrome.

Theme Color Chrome Android
Theme Color Chrome Android

Pengaturan Meta Theme color ini ternyata tidak hanya berlaku pada Android, namun juga berlaku pada sistem Windows Phone dan IOS Apple, walaupun ada script atau kode tersendiri yang harus kita tambahkan lagi. Theme color juga tidak hanya untuk browser Chrome, browser seperti Firefox OS, Safari, Internet Explorer and Opera juga sudah dibekali kemampuan untuk mengenali meta tag ini.

Status Bar Translucent via developers.google.com
Status Bar Translucent via developers.google.com

Untuk dapat mengatur theme color pada windows phone dan IoS kita hanya perlu menambahkan meta tag lagi pada header seperti berikut:

Jika ingin lengkap, maka masukan saja semua tag meta theme color dibawah ini pada header website anda, maka niscaya akan bewarna disetiap OS..Hehehe.

 

Sekian dulu dan semoga bermanfaat.

Salam!

 

Source |  Bacaan Soal Koding lainnya disini

 

 

4 COMMENTS

LEAVE A REPLY