Tabii ki bu temayı da güzelleştirmenin (hızdan kesmeden) yolları mevcut.
İşte bu hususta sizlere Generate Press temasını nasıl daha güzel bir hale getirebileceğinizi gösteren bir seriye başladık bildiğiniz üzere.
Bugün 5. bölüme geldik
Navigasyon barını nasıl düzenleyebiliriz bugünde bu konuya değiniyoruz.
Güzel tatlış bir görünüm yakalatmak amacımız çünkü normal hali gerçekten çok dümdüz.
Olmazsa olmazımızla başlayalım
After'da kullandığım sitenin önceki halini çekmeyi unutmuşum başka site kullandım
Before:
After:
Şimdi gelelim bu hale nasıl getiriyoruz sitemizi.
Öncelikle eklememiz gereken CSS kodları bulunmakta bunun için
Görünüm > Özelleştir > Ek CSS bölümüne giriyoruz.
Aşağıdaki kodları bu bölüme ekleyelim:
/* Site navigation */
.menu-bar-item a svg{
color:#fff;
font-size:18px;
}
#site-navigation{
background-color:#4d0000;
}
#menu-header-menu .menu-item a{
font-size:19px;
font-weight:500;
color:#000;
transform:translatex(0px) translatey(0px);
box-shadow:none;
}Ben bordoya kaçan bir renk seçtim bu rengi değiştirmek istersenizbackground-color: #4d0000;
Yazan satırdaki 4d0000 değerini değiştirmeniz yeterlidir.
Ben dilerseniz size mavi ve sarı renklerini de ekleyeyim örnek olarak hazır
Mavi:
Sarı:
Bu kodları ekledikten sonra işimiz bitmedi tabii ki.
Şimdi ise Görünüm > Özelleştir > Renkler > Ana Navigasyon kısmına geliyoruz.
Sırasıyla buradaki renkleri şu şekilde yapalım.
Navigation Background: #e4e0e0
Navigation Text: #ffffff - 2. ve 3. için : #515151
Sub-Menu Background: #f0eeee
Sub-Menu Text: 1. #515151 2. #7a8896 3. #8f919e
Biraz karışık gelmiş olabilir bitirince paneldeki olması gereken görüntü şu şekildedir:
Bu şekilde yayımladıktan sonra varsa önbelleğinizi temizleyin ve işlemlerimiz bitti
Hayırlı olsun diyelim mi?
Gelecek bölümlerde sizin özellikle istediğiniz şurayı da güzelleştirelim, düzenleyelim dediğiniz yerler de var ise yorumlarda belirtebilirsiniz.
Şuanki aklımda bulunan yerlerin planına göre en az 10 bölüme tamamlamış olacağız sizlerin istekleriyle bunu arttırabiliriz
Umuyorum ilginizi çeken, işinize yarayan bir içerik olmuştur.
Şuradan da asıl içeriğe erişebilirsiniz: GeneratePress Teması Nasıl Özelleştirilir?
İyi forumlar dilerim esen kalın
Serinin diğer içerikleri:
- FAQ Bölümü Rank Math
- Entry Meta - Yazar ve İçerik Metası
- İçerik & Makale Gölgesi
- Alıntılar
