Aldhinya Web – Tutorial Petunjuk Panduan langkah langkah bagaimana gimana how to Mudah Simple Ampuh merubah mengubah mengganti Warna Address Bar Browser di Smartphone Android Ketika Membuka Blog Kita. Pernahkan anda melihat address bar sebuah website atau blog yang berubah warna ketika kita mengunjungi blog tersebut? Hal seperti ini tidak jauh dari perkembangan teknologi yang dilengkapi dengan perkembangan desain yang semakin menarik.

Cara Mengubah Warna Address Bar Browser di Smartphone Ketika Membuka Blog Kita

Warna address bar yang bermacam-macam bisa digunakan sebagai ciri dari sebuah situs. Dengan berubahnya warna tertentu pada address bar akan membuat kesan tersendiri bagi orang yang mengunjungi blog anda. Ada baiknya anda menerapkan warna sesuai dengan warna tema pada blog atau website anda.

Untuk kali ini saya hanya menemukan perubahan pada browser Google Chrome saja pada smartphone android saya. Silahkan ikuti langka-langkah berikut

Mengubah warna address bar pada browser androidCaranya cukup mudah, hanya menambahkan kode di bawah ini :

<meta name="theme-color" content="#e74c3c" />

Mengubah warna address bar pada browser Windows Phone

Tidak hanya pada smartphone android saja, namun juga bisa diterapkan pada browser di Windows Phone, karena Windows Phone juga sudah mendukung pergantian warna address bar ini, namun caranya agak sedikit berbeda, karena menggunakan meta tag dengan nama msapplication-navbutton-color.

Kodenya adalah sebagai berikut :

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

Mengubah warna address bar pada browser Safari

Penerapan pada Browser Safari caranya juga berbeda, kita harus menambahkan dua baris script yaitu “apple-mobile-web-app-status-bar-style” dan “apple-mobile-web-app-capable”.

Berikut kodenya :

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

Kode Lengkapnya

Jadi di bawah ini adalah kode lengkap yang bisa Anda pasang di bagian head pada kode HTML blog Anda agar bisa support di berbagai browser. Berikut kodenya :

<!-- Untuk Android -->
<meta name="theme-color" content="#e74c3c" />
<!-- Untuk Windows Phone -->
<meta name="msapplication-navbutton-color" content="#e74c3c" />
<!-- Untuk iOS Safari -->
<meta name="apple-mobile-web-app-status-bar-style" content="#e74c3c" />
<meta name="apple-mobile-web-app-capable" content="yes" />

Cara Memasang di Blogger

Login ke akun blogger anda
Masuk ke Dashboard > Template
Edit HTML
Copy kode di atas lalu paste tepat di atas kode </head>
Lalu Simpan

Cara Memasang di WordPress

Login ke dashboard WordPress
Kemudian, pilih Appearance > Editor
Lalu, pada bagian kanan klik themes header (header.php)
Copy kode di atas lalu paste tepat di atas kode </head>
Lalu Simpan

Ganti Kode #e74c3c sesuai dengan warna selera Anda !

Silahkan buka blog anda pada smartphone android anda. Jika warna address bar pada browser smartphone android anda berubah maka anda berhasil menerapkannya. Ingat! cara di atas hanya saya coba pada browser Google Chrome saja.

Sekiat Tutorial tentang Cara Merubah Warna Address Bar Browser di Smartphone Ketika Membuka Blog Kita. Terima kasih dan semoga artikel di atas bermanfaat.

7 Comments