Mobile theme color |
Dostlarım bir önceki yazımda bahsettiğim gibi ufak bir başlık etiketi (meta tag) ile mobil cihazlarda nasıl farklılık elde edebiliriz konusuna yer verdim bu yazımda. Web sitelerimize, bloglarımıza ekleyeceğimiz bu basit kodlar sayesinde, mobil görünümde internet tarayıcılarının adres çubuğu kısmına renk verebiliyoruz. Bu sayede mobil cihazlarda tam anlamıyla renk uyumu yakalayıp ufak bir artı katmış olacağız.
Konuyu fazla uzatmadan hemen mobil internet tarayıcılarının adres çubuğuna nasıl renk ekleyebiliriz adım adım uygulayalım:
Google Blogger (blogspot) için:
Blogger HTML |
<head>
kodunu buluyoruz. Bulduğumuz bu kodun altına
<!-- Google Chrome, Firefox ve Opera içim -->
<meta name="theme-color" content="#3cafe0">
<!-- iOS Safari için -->
<meta name="apple-mobile-web-app-status-bar-style" content="#3cafe0">
<!-- Windows Phone için -->
<meta name="msapplication-navbutton-color" content="#3cafe0">
Bu kodları ekliyoruz. Son olarak kırmızı kısımda belirttiğim alana dilediğiniz rengin Hex color kodunu ekleyip temanızı kaydedin.
WordPress için:
Wordpress header |
WordPress için de admin paneline ulaşıp, sol tarafta yer alan Görünüm ve ardından Tema düzenleyici kısmına giriyoruz.
Bu kısımda sağ tarafta yer alan seçeneklerden Tema üst bölümü yani header.php seçeneğini seçiyoruz. Kodların olduğu kısımda Ctrl F yardımıyla
<head>
kodunu bulup hemen altına yukarıya eklediğim kodları ekliyoruz. Ve yine aynı şekilde kırmızı renkle belirttiğim kısma dilediğiniz rengin Hex color kodunu ekleyip Dosyayı güncelle butonu ile kaydediyoruz.
HTML Hex color kodları ile ilgili şu siteyi ziyaret edebilirsiniz. Bu sitede dilediğiniz rengin Hex color koduna ulaşabilirsiniz.
Tabi bu özellik yeni çıkan bir şey değil dostlarım. Ama muhtemelen Google'un Android mobil cihazlarında ilk uyguladığı bir konu. Altı yıl önce Google bunun duyurusunu yapmış. Ben de geçtiğimiz günlerde tesadüf eseri karşılaştım ve hemen Blog Tecrübem'e ekledim.😊
Konuyla ilgili sorularınız olursa yorum yaparak bana bildirebilirsiniz.
Tabi bu özellik yeni çıkan bir şey değil dostlarım. Ama muhtemelen Google'un Android mobil cihazlarında ilk uyguladığı bir konu. Altı yıl önce Google bunun duyurusunu yapmış. Ben de geçtiğimiz günlerde tesadüf eseri karşılaştım ve hemen Blog Tecrübem'e ekledim.😊
Konuyla ilgili sorularınız olursa yorum yaparak bana bildirebilirsiniz.
Siteye estetik bir dokunuş İçin uygulanabilir. Teşekkürler
YanıtlaSilEvet, kesinlikle. Teşekkürler yorumunuz için.
SilHocam iOS’da olmuyor sanırım. Sizin blogunuzu renkli görmüyorum ben
YanıtlaSilBen arka plan rengini (#f9f9f9) kullanıyorum. Sarı ve mavi pek hoşuma gitmedi açıkçası :)
SilYıllar önce bu konu ile ilgili bir yazı yazmıştım. Fakat IOS ve Windows Phone için geçerli değildi. Uzun zamandır da kullanmıyorum. Fakat görsellik adına hoş bir detay. Belki kullanmaya devam edebilirim. Blogunuzda header ile bütünlük sağlama adına #369dc9 renk kodu en uygunu olacaktır.
YanıtlaSilArka plan rengini eklemiştim #f9f9f9, ama senin önerin daha iyi oldu, teşekkür ederim.
SilSitelere güzellik katacak bir kod :) Denerim ben de :)
YanıtlaSil:) Evet, ufak bir dokunuş. Teşekkür ederim yorumunuz için.
SilKeşke iOS kısmında bu özellik çalışssa, gerçekten hoş bir görüntü olurdu.
YanıtlaSil