Wordpress header renkli menü yapımı_?

Arkadaşlar headerdeki menulerin herbirinin farklı renkte olmasını istiyorum bunu nasıl yapabilirim.

css ile ayrı divler oluşturarak yapılabilir ama headere adminden menu eklediğimiz için nasıl yapabiliriz bunu merak ediyorum

cvp yazanların şimdiden eline sağlık

Merhaba,

Olması gereken renkleri array içerisinde tanımlarsınız. Sonra wp menü fonksiyonunda rasgele array_rand ile rasgele renk seçimi yapıp, style içerisinde basın. Bunu isterseniz css olarak da tanımlayıp rasgele selektör seçimi de yapabilirsiniz.

// Bu şekilde renkleri tanımlarsınız, alttan rasgele seçersiniz.
$renkler[0] = "#00000";
$renkler[1] = "#ff0000";
$renkler[2] = "blue";

$sectim = $renkler[array_rand($renkler)];

Arkadaşlar headerdeki menulerin herbirinin farklı renkte olmasını istiyorum bunu nasıl yapabilirim.

css ile ayrı divler oluşturarak yapılabilir ama headere adminden menu eklediğimiz için nasıl yapabiliriz bunu merak ediyorum

cvp yazanların şimdiden eline sağlık

Hangi sitedeki menüleri değiştirmek istiyorsun, link atarsan, gerçek tema üzerinde nasıl yapacağına dair yardımcı olabilirim.

Temel mantığı, wp-menu de yer alan ul ve li öğeleri ile css üzerinde oynama/değişiklik yapmaktır. Tabi bu kısımlar uygun/düzgün şekilde kodlanmış ise sorunsuz bir şekilde çalışacaktır. Ayrıca ufak bir detay, sanırım istediğiniz header deki menüde yer alan linklerin/bağlantıların her birinin farklı renkte olması?

Evet hocam her link farklı renkte olacak örneğin http://www.egonomik.com/ arkadaşın sitesindeki menu tema istediğim şekilde ama renkleri bu şekilde wordpresste nasıl çektiririm çözemedim

Böyle ise işin kolay.

Aşağıdaki yolu izleyerek ve css kodlarını ekleyerek renklendirebilirsin.


Wordpress Admin Paneli Üzerinde "Görünüm -> Menüler" kısmında ilgili menüyü seçin. Menü içerisindeki bağlantılar listelenecektir. Menü elemanının en sağ kısmında "Menü elemanını düzenle" şeklinde bir "AŞAĞI OK" yer alacaktır. Bunu tıklayarak, menü eleman özelliklerini açın. "CSS sınıfları (seçime bağlı)" kısmına ilgili css sınıfı renk kodunu yazın, örneğin "red", "yellow", "green". Kaydedin ve kapatın.

Ardından, sağlıklı olması açısından css üzerinde miraslı çalışmanızı tavsiye ederim. Kabaca şöyle bir kod işinizi görecektir.

Arkaplan değişiklikleri için

ul li.red {background:red;}
ul li.yellow {background:yellow;}
ul li.green {background:green;}

Border değişiklikleri için

ul li.red {border-bottom:1px solid red;}
ul li.yellow {border-left:1px solid yellow;}
ul li.green {border:1px dashed green;}

Hover efektleri için

ul li.red:hover {background:#242220; color: white:}

Kodları çeşitli yazmaya çalıştım, umarım işinizi görür.
Kolay gelsin.