Monday, May 21, 2018

Cara Ubah Warna Address Bar Website Versi Mobile


rudypratama.com -  Pernahkah kita melihat sebuah website saat dibuka melalui browser google chrome dari smartphone tampak terlihat pada bagian address bar atau header browsernya berubah menjadi warna tertentu? jika pernah melihatnya, anda juga bisa menerapkannya diwebsite anda agar lebih terlihat profesional.

Sebenarnya normal dari warna ini adalah berwarna putih abu-abu, namun pada beberapa website ada yang berwarna merah, hitam, biru atau warna lainnya. Warna header browser mobile tersebut bisa kita atur dengan menuliskan kode warnanya pada meta tag dibagian [head] di kode html.

Warna tersebut bisa kita gunakan untuk penanda sebuah website, jika website tersebut dominan warna biru maka ada baiknya menyertakan warna biru untuk address bar atau header browsernya seperti pada website saya ini. Caranya sangat mudah, kita cukup menambahkan satu baris kode meta tag pada bagian [head] di kode html, seperti berikut ini.
<!-- URL Theme Color untuk Chrome, Firefox OS, Opera dan Vivaldi -->
<meta name="theme-color" content="#001b2a" />
<!-- URL Theme Color untuk Windows Phone -->
<meta name="msapplication-navbutton-color" content="#001b2a" />
<!-- URL Theme Color untuk iOS Safari -->
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="#001b2a" />
Penerapan di WordPress

  • Untuk pengguna WordPress cukup masuk ke menu Appearance -> Editor.
  • Kemudian pilih Theme Header di bagian kanan, lalu ketik kode diantara tag head.

Penerapan di Blogger

  • Masuk ke Dashboard Blogger, pilih Template->Edit Html.
  • Kemudian masukan kode tersebut diantara tag head.
Artikel Menarik Lainya
Untuk hasilnya Anda bisa membuka website rudypratama.com pada browser Google Chrome yang ada di smartphone Anda. akhir kata terima kasih semoga bermanfaat.(Senin, 21/05/2018)


EmoticonEmoticon