Update! Merubah Warna Tema Blog bagian Address Bar Google Chrome

Cara Merubah Warna Address Bar Chrome Menjadi Hitam

Bagaimana mengubah warna address bar di browser Google Chrome agar sesuai dengan warna tema blog kamu.

Apakah kamu pernah memperhatikan bahwa banyak situs populer seperti Kompas dan Facebook menggunakan warna brand mereka sendiri untuk warna alamat di browser versi seluler.

Biasanya warna address bar ini hanya menggunakan warna abu-abu saja, tapi ada beberapa website yang menggunakan warna address bar sesuai dengan warna tema situs yang digunakan.

Sebenarnya cara melakukannya cukup mudah, bahkan kamu tidak perlu pusing-pusing cari kode HTML yang gak jelas jika ingin menggubah warna address bar semua browser HP.

Berikut ini, kami akan memberikan tutorial cara merubah warna address bar buat pengguna blog versi blogspot dan juga WordPress.

Mengubah Warna Background Address Bar pada browser Chrome & Opera

Salin kode dibawah ini dan letakan kodenya tepat dibagian bawah <head>

<meta name="theme-color" content="#000000">

Warnanya akan berwarna hitam, karena kode warna yang saya gunakan adalah #000000 (Hitam). Untuk menganti warnanya, kamu bisa cari kode warna sesuai dengan keinginan kamu lewat halaman ini.

Tampilan ini hanya mendukung browser Google Chrome dan Operamini jika di akses lewat seluler.

Untuk menambah kelengkapan maka kita perlu menambahkan kode lagi agar mendukung disemua browser seluler.

Perlu di ingat, Warna Address bar ini suport versi AMP dan non-AMP

Membuat Warna Address Bar Browser di Windows Phone

Salin lagi kodenya yang ada dibawah ini, peletakannya tetap dibagian bawah kode <head>

<meta name="msapplication-navbutton-color" content="#000000" />

Tampilan ini berlaku hanya tampil di setiap browser yang ada di Window Phone.

Mengganti Warna Address Bar Browser Safari iOS

Kode kali ini sedikit berbeda, karena ada 2 baris meta tag, dengan nama apple-mobile-web-app-status-bar-style dan apple-mobile-web-app-capable, untuk baris yang kedua cukup mengisi dengan " yes " saja.

Salin kode dibawah ini

<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="#000000" />

Maka untuk keseluruhan kode yang kita buat sebelumnya, adalah seperti kode dibawah ini.

<!-- Background Theme Color untuk Chrome dab Opera -->
<meta name="theme-color" content="#000000" />
<!-- Background Theme Color untuk Windows Phone -->
<meta name="msapplication-navbutton-color" content="#000000" />
<!-- Background Theme Color untuk iOS Safari -->
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="#000000" />

Memasang Warna Tema Blog Bagian Addres Bar

Pengguna WordPress

Buka dashbor Wordpress
Pilih Tampilan > Editor > cari dipilihan header.php
Letakan kode tadi, dibagian bawah <head>

Maka contoh kodenya seperti dibawah ini.

<head>
<!-- Background Theme Color untuk Chrome dab Opera -->
<meta name="theme-color" content="#000000" />
<!-- Background Theme Color untuk Windows Phone -->
<meta name="msapplication-navbutton-color" content="#000000" />
<!-- Background Theme Color untuk iOS Safari -->
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="#000000" />
</head>

Untuk memilih warna sesuai selera, silahkan akses kodenya disini.

Buat Pengguna Blogspot

Buka Blogger > Template / Tema > Edit HTML > <head>

Update! Cara Merubah Warna Tema Blog bagian Address Bar Google Chrome

Akhir Kata

Demikian informasi yang dapat kami sampaikan dalam penjelasan kali ini tentang warna tema blog bagian address bar yang bisa kamu rubah di tampilan layar HP.

Jika ada pertanyaan lainnya jangan ragu untuk menulis komentarnya.

Posting Komentar untuk "Update! Merubah Warna Tema Blog bagian Address Bar Google Chrome"

Kami memiliki kebijakan dalam berkomentar di Blog ini :

— Dilarang promosi suatu barang
— Dilarang jika memasang link aktif di komentar
— Dilarang keras melakukan promosi iklan
— Dilarang menulis komentar yang berisi sara, bully atau cemuhan

NB :Komentar yang melanggar tidak akan ditampilkan

Kebijakan komentar yang bisa Anda temukan selengkapnya disini

Dukungan :

Jika menyukai dengan artikel blog kami, silahkan Ikuti blog ini