Hazır Site Kodları Web Siteniz İçin Hazır Site Kodları

  • Onur YURT
  • iletisim@hazirsitekodlari.com
  • 57

    Makale

  • 3

    Yorum

  • 8

    Kategori

Webmaster adına tüm bilgi ve paylaşım platformudur.

Senin Kodun

Ana Sayfa / Web Tasarım / Mobil Sitede, Tarayıcının Sekme Rengi Nasıl Değiştirilir?

Mobil Sitede, Tarayıcının Sekme Rengi Nasıl Değiştirilir?

Google Chrome yeni çıkardığı bir özellik ile artık web siteleriyle daha uyumlu.  Google Chorome sekme rengi

güncellemesiyle kendisini vazgeçilmez kılmaya devam ediyor, mobil ziyaretlerde geçerli olan bu işlemde Google Chrome kendi sekme rengini sizin belirlediğiniz bir renk ile değiştirerek sitenizin bir parçasıymış gibi davranarak temanıza bir renk ahengi içerisinde açılarak ziyaretçilerinize güzel bir görünüm sunuyor.

Şu günlerde bu özellik bir çok güncel sitede aktif olarak ziyaretçilere sunuluyor. Tam olarak bu renk değişikliğinin nerede yapıldığını anlayabilmek yandaki resmin adres çubuğuna dikkat etmeniz yeterli.

Peki bu işlem nasıl yapılıyor

Sitenizde bulunan <head>….</head> tagları arasına;

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

metasını eklemeniz yeterli olacaktır. Google Chrome bu metayı tanıyacak ve tarayıcınıza belirlediğiniz rengi yalnızca sizin siteniz için ayarlayacaktır. Renk belirlemek için meta da bulunan #FFBA02 renk kodunu değiştirmeniz yeterli.

Renk kodu bulamadınız mı?

Renk kodu çıkarıcı programlar ile bu işlemi çok zahmetsiz şekilde yapabilirsiniz. Colorpic ve Color Finder programlarıyla kodunu almak istediğiniz bölgenin üstüne tıkladıktan sonra size 4 farklı türden renk kodunu verecektir.  Biz buradan RGB HTMLkodunu kullanacağız. Yani ‘#’ işaretiyle başlayın kodu.

Aşağıdaki sitelerden web sitenize uygun veya istediğiniz renk kodunu kullanabilirsiniz.

 

WordPress’de kodun temaya yerleştirilmesi ve aktif edilmesi

WordPress admin paneline giriş yaptıktan sonra ‘Görünüm‘ sekmesinden ‘Düzenleyici‘ bölümüne giriş yapıyoruz. Karşınıza çıkan CSS düzenleme ekranında hiçbir değişiklik yapmadan, sağ tarafta listelenen tema dosyalarından “Tema üst bölümü (header.php)” dosyasına tıklıyoruz.

Uygulama öncesi karşınıza en üstte şöyle veya benzer bir kod çıkması gerekir;

<!DOCTYPE html>
<html>
<head>

yukarıdakine benzer bir kod yapısı yok ise endişelenmeye gerek yok. Mevcut sayfada CTRL+F yaparak <head> kodunu aratıyoruz. Bu etiketten sonraki satıra aşağıdaki kodu yerleştirip kaydediyoruz.

Uygulama sonrası;

<!DOCTYPE html>
<html>
<head>
<meta name="theme-color" content="#FFBA02"> <-- Kalınlaştırılmış kod eklenecek.

Kodumuzu yukarıda belirttiğimiz şekilde uyguladıktan sonra dosyamızı kaydediyoruz ve mobil cihazdan Chrome’a girerek test yapıyoruz. Not: #FFBA02 belirlediğimiz rengin kodudur arkadaşlar siz istediğiniz gibi değiştirebilirsiniz.

Renk kodu gözükmedi mi?

1- Web sitenizde önbellekleme (cache) eklentisi kullanıyor musunuz? Evet ise önbelleği temizleyip tekrar deneyin.

2- Sürekli girdiğiniz tarayıcıdan mı denediniz? Evet ise tarayıcı ayarlarından geçmişi silerek tekrar deneyin.

BENZER KONULAR

Seo için en iyi bilgiler
Seo için en iyi bilgiler DEVAMI
  • 18 Haziran 2020 | 0 | 276
Web Tasarım | Kategorisine Ait Yazıların Daha Fazlası...

KONU HAKKINDA (Yorum Yapılmamış) | SENDE YORUM YAP DESTEK OL!

Yazı hakkında görüşlerinizi belirtmek istermisiniz?

BEN KİMİM?

Onur YURT

Web Developer And Coder

Merhaba arkadaşlar Adım Onur YÜRT Bursada doğdum ve yaşıyorum 2009 yılından itibaren web hayatına adım attım ve şuanda bulunduğum sayfayı açtım amaçım sizlere birşeyler öğretmek ve kazandırmak Web tasarım konusunda kendimi yeterince geliştirdiğime inanıyorum bu bilgileri zamanla siz değerli takipçilerime sunmak yeterince bildiğim kodlama diller Css3, Html5, Javascript ve Php dir.

POPULER KONULAR

Hazır Site Kodları Web Siteniz İçin Hazır Site Kodları...