Cara Agar Warna Address Bar Mengikuti Warna Blog - Arcomp Design

    Social Items

Web Address Bar

Selamat datang kembali sobat blogger, pada postingan kali ini saya akan berbagi tips tentang Cara Merubah Warna Address Bar Mengikuti Warna Utama Blog KetikaDikunjungi Melalui Mobile Browser.

Mungkin sobat pernah mengunjungi suatu website menggunakan browser mobile, dan ketika di teliti ternyata website yang sobat kunjungi ada yang Address Barnya sewarna dengan warna utama website tersebut dan ada yang tidak sama. Seperti blog ini, jika sobat mengunjunginya melalui mobile browser, secara otomatis Address Bar tersebut warnanya menjadi mengikuti warna utama blog ini.

Cara Agar Warna Address Bar Mengikuti Warna Blog


Mengubah warna address bar sebenarnya cukuplah mudah, sobat hanya perlu menambahkan beberapa baris script meta tag. Berhubung mobile browser ini memiliki jenis yang berbeda seperti Chrome, Firefox, Safari iOS, Opera, dll. Jadi scriptnya juga berbeda.

Buka halaman Blogger > Klik menu Template > Klik tombol Edit HTML > Tambahkan script di bawah ini sesudah kode <head> atau &lt;head&gt;

Mengubah Warna Address Bar pada Browser Chrome dan Opera


Untuk mengubah warna pada mobile browser Chrome dan Opera, scriptnya seperti dibawah ini.



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

Mengubah Warna Address Bar pada Browser Windows Phone


Sedangkan untuk mengubah warna pada mobile browser Windows Phone, scriptnya seperti dibawah ini.

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

Mengubah Warna Address Bar pada Browser Safari iOS


Dan untuk mengubah warna pada mobile browser Windows Phone, scriptnya seperti dibawah ini.

<meta name="apple-mobile-web-app-capable" content="yes"> 

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

Sehingga jika script di atas kita jadikan satu, maka scriptnya akan terlihat seperti di bawah ini.

<!-- Untuk Google Chrome, Firefox & Opera --> 

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

<!-- Untuk Windows Phone --> 

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

<!-- Untuk Safari iOS --> 

<meta name="apple-mobile-web-app-capable" content="yes"/> 

<meta name="apple-mobile-web-app-status-bar-style" content="#01a3a4"/>
Edit kode warna yang saya tandai sesuai dengan keinginan sobat
Kemudian Simpan Template dan silahkan buka blog sobat melalui mobile browser dan lihat hasilnya.

Sekian tips tentang Cara Merubah Warna Address Bar Mengikuti Warna Utama Blog KetikaDikunjungi Melalui Mobile Browser dari saya. Semoga bermanfaat bagi kita semua, terima kasih.

Cara Agar Warna Address Bar Mengikuti Warna Blog

Web Address Bar

Selamat datang kembali sobat blogger, pada postingan kali ini saya akan berbagi tips tentang Cara Merubah Warna Address Bar Mengikuti Warna Utama Blog KetikaDikunjungi Melalui Mobile Browser.

Mungkin sobat pernah mengunjungi suatu website menggunakan browser mobile, dan ketika di teliti ternyata website yang sobat kunjungi ada yang Address Barnya sewarna dengan warna utama website tersebut dan ada yang tidak sama. Seperti blog ini, jika sobat mengunjunginya melalui mobile browser, secara otomatis Address Bar tersebut warnanya menjadi mengikuti warna utama blog ini.

Cara Agar Warna Address Bar Mengikuti Warna Blog


Mengubah warna address bar sebenarnya cukuplah mudah, sobat hanya perlu menambahkan beberapa baris script meta tag. Berhubung mobile browser ini memiliki jenis yang berbeda seperti Chrome, Firefox, Safari iOS, Opera, dll. Jadi scriptnya juga berbeda.

Buka halaman Blogger > Klik menu Template > Klik tombol Edit HTML > Tambahkan script di bawah ini sesudah kode <head> atau &lt;head&gt;

Mengubah Warna Address Bar pada Browser Chrome dan Opera


Untuk mengubah warna pada mobile browser Chrome dan Opera, scriptnya seperti dibawah ini.



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

Mengubah Warna Address Bar pada Browser Windows Phone


Sedangkan untuk mengubah warna pada mobile browser Windows Phone, scriptnya seperti dibawah ini.

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

Mengubah Warna Address Bar pada Browser Safari iOS


Dan untuk mengubah warna pada mobile browser Windows Phone, scriptnya seperti dibawah ini.

<meta name="apple-mobile-web-app-capable" content="yes"> 

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

Sehingga jika script di atas kita jadikan satu, maka scriptnya akan terlihat seperti di bawah ini.

<!-- Untuk Google Chrome, Firefox & Opera --> 

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

<!-- Untuk Windows Phone --> 

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

<!-- Untuk Safari iOS --> 

<meta name="apple-mobile-web-app-capable" content="yes"/> 

<meta name="apple-mobile-web-app-status-bar-style" content="#01a3a4"/>
Edit kode warna yang saya tandai sesuai dengan keinginan sobat
Kemudian Simpan Template dan silahkan buka blog sobat melalui mobile browser dan lihat hasilnya.

Sekian tips tentang Cara Merubah Warna Address Bar Mengikuti Warna Utama Blog KetikaDikunjungi Melalui Mobile Browser dari saya. Semoga bermanfaat bagi kita semua, terima kasih.

Subscribe Our Newsletter

Notifications

Disqus Logo