Cara Mengubah Warna Address Bar Browser Ketika di Akses dengan Smartphone

Selamat sore sobat dzulcyber, sambil menunggu buka puasa ane mau bagi-bagi sedikit tips ngeblog nih. Postingan kali ini ane bakal bahas tentang cara gampang mengubah warna address bar browser mobile ketika blog kita diakses.

Cara merubah warna address bar pada browser smartphone
Pernahkah sobat mengakses web detik.com, goal.com, atau yang lainnya melalui smartphone sobat? Kalo pernah tentu sobat bakal melihat warna address bar yang berbeda-beda bukan? warna address bar berubah sesuai dengan  karakter warna web tersebut misalnya ketika kita mengakses detik sepakbola maka warna address bar di browser smartphone kita berubah menjadi hijau.

Dengan terus berkembangnya teknologi tentu bukan hal yang sulit untuk menerapkan hal seperti di atas pada blog kita. Kita dapat mengubah warna address bar di browser ketika blog kita diakses via smartphone hanya sekejap saja. Simak caranya!

1. Mengubah warna address bar pada browser android

Anda cukup menambahkan kode berikut:
<meta name="theme-color" content="#006699" />

2. Mengubah warna address bar pada browser Windows Phone

Tips juga bisa diterapkan untuk smartphone dengan OS windows phone, walaupun agak sedikit berbeda tapi juga masih sangat mudah.

Sobat hanya perlu menambahkan kode berikut:
<meta name="msapplication-navbutton-color" content="#006699" />

3. Mengubah warna address bar pada browser Safari

Untuk menerapkan pada browser safari juga  harus menambahkan kode meta tag yang berbeda, walaupun sedikit lebih banyak tapi caranya juga sama seperti sebelumnya.

Sobat hanya perlu menambahkan kode berikut:
<meta name="apple-mobile-web-app-status-bar-style" content="#006699" />
<meta name="apple-mobile-web-app-capable" content="yes" />

Jika digabung maka kira-kira akan seperti ini:
<!-- Untuk Android -->
<meta name="theme-color" content="#006699" />
<!-- Untuk Windows Phone -->
<meta name="msapplication-navbutton-color" content="#006699" />
<!-- Untuk iOS Safari -->
<meta name="apple-mobile-web-app-status-bar-style" content="#006699" />
<meta name="apple-mobile-web-app-capable" content="yes" />

Cara Memasang di Blogger:

  1. Login ke akun blogger anda
  2. Masuk ke Dashboard > Template
  3. Edit HTML
  4. Copy kode di atas lalu paste tepat di atas kode </head> 
  5. Save Template
Note: Ganti kode #006699 sesuai dengan warna kesukaan anda. Lihat kode warna.

Selanjutnya silahkan akses blog Anda melalui smartphone dan lihat apa yang terjadi dengan address barnya. Jika warna berubah maka tips ini berhasil. Saya hanya mencoba di browser google chrome android saja dan berhasi.

Demikian saja tips untuk hari ini tentang Cara Mengubah Warna Address Bar Browser Ketika di Akses dengan Smarphone. Semoga bermanfaat!

Artikel Terkait Lainnya:

Blogger
Disqus
Pilih Sistem Komentar

Berkomentarlah dengan topik yang relevan dan tidak melakukan SPAM