WordPress 3 İçin Menü Yapımı

WordPress 3.0 ile gelen özelliklerden “Özel Menü (Custom Menu)” özelliğinden biraz bahsedeyim istedim.

Temel Bilgiler

WordPress 3.0 yüklediğinizde “Görünüm (Appearance)” sekmesinde “Menüler (Menus)” isimli bir bölüm göreceksiniz. Menüler bölümünü açtığınızda ise karşınıza; kendinize özel menünüzü hazırlayabileceğiniz, bir ekran çıkacak.

Tema hazırlama ekranının üst kısmında “Kullandığınız temanın, menü bölgesi içermediği fakat hazırlayacağınız menüyü gereç olarak kullanabileceğinize…” dair bir uyarı görebilirsiniz. Temanızı hazır olarak edindiyseniz; yeni sürümünün bulunup bulunmadığına bakabilirsiniz ya da uyarıyı takmayıp, bir menü hazırlayıp gereç olarak kullanmaya başlayabilirsiniz.

Tema hazırlama ekranında “Menü İsmi (Menu Name)” kısmına bir menü adı yazıp, “Menüyü Kaydet (Create Menu)” butonuna tıklayarak menünüzü hazırlamaya başlayabilirsiniz. Bu aşamadan sonra “Özel Bağlantılar (Custom Links)”, “Sayfalar (Pages)” ve “Kategoriler (Categories)” sekmeleri aktif duruma gelecek. İlgili sekmelerden istediğiniz sayfaları, kategorileri işaretleyerek ya da bir bağlantı adresi girip menüye ekle diyerek menüye ekleyebilirsiniz. Menüye eklediğiniz öğeleri sürükle-bırak yaparak istediğiniz sıralama ile kaydedebilirsiniz. Hatta menü öğelerini sağa doğru sürükleyerek alt öğeler oluşturabilirsiniz. “Otomatik olarak ilk seviye sayfaları ekle (Automatically add new top-level pages )” seçeneğini işaretleyerek yeni oluşturduğunuz sayfaların menünüze otomatik olarak eklenmesini sağlayabilirsiniz. (Oluşturduğunuz sayfa için üst sayfa belirlemişseniz menüye otomatik eklenmez.)

Eğer temanız “Tema Konumları (Theme Locations)” destekliyorsa bu kısımdan; hangi menünün hangi konumda yayınlayacağını seçip kaydederek, menünüzü kullanmaya başlayabilirsiz.

Oluşturdunuz menünün görünümü ise hayal gücünüze ve “CSS” yeteneğinize bağlı olarak düzenleyebilirsiniz.

Temanıza Menü Desteği

Kullandığınız tema “Tema Konumları”nı desteklemiyorsa ve biraz kod bilginiz varsa, bu özelliği temanıza kendiniz de kazandırabilirsiniz. Temanızın klasöründe bulunan “functions.php” dosyasını bir kod editörü ile açın (Windows yüklü bilgisayarlarda hazır bulunan “Notepad” işinizi görür. Daha gelişmiş özellikler için Eclipse, Sublime Text gibi bir editör de kullanabilirsiniz). Bu dosyada “<?php ?>” kodları (tırnaklar hariç) arasında kalacak şekilde;

register_nav_menus(array(
'menubar' => 'Konum açıklaması'
));

kodunu eklerseniz temanızda “menubar” isimli bir konum oluşturmuş olacaksınız. Birden fazla konum eklemek için;

register_nav_menus(array(
'menubar' => 'Konum açıklaması',
'footer' => 'Konum açıklaması'
));

gibi bir kod kullanabilirsiniz. Bu kod ile temanızda “menubar” ve “footer” isimlerinde iki konum oluşturmuş olabilirsiniz. (“Konum açıklaması” kısmına konumu açıklayacak bir yazı ekleyebilirsiniz.)

Konumu tanımladık şimdi de bu konumu kullanan menünün sitenin neresinde görüneceğini belirleyelim. Şimdi “menubar” ismini verdiğimiz konumu, sayfanın üst kısmına yerleştirelim. “header.php” dosyası wordpress temanızın üst kısmının görünümünü belirler. “header.php” dosyasını kod editörümüz ile açın ve uygun bir yere;

<?php wp_nav_menu( array( 'container_id' => 'menubar', 'theme_location' => 'menubar' ) ); ?>

kodunu ekleyin. Burada “container_id” menü öğelerinden oluşan listeyi, kapsayan “div” tagının “id” değeridir. “theme_location” ise menüyü biraz önce tanımladığımız konuma yerleştirir.

Artık wordpress yönetim panelinden bir menu hazırlayıp, tema konumlarından “menubar”ı seçtiğinizde; menümüz, biraz önce “header.php” dosyasına eklediğimiz kısımda gösterilmeye başlanacaktır.

Menü Kancaları

Eğer menünüz sizin için yetersiz kalıyorsa, başına ya da sonuna eklemek istediğiniz kodlar varsa ya da menüyü belirli bir kod filtresinden geçirmek istiyorsanız; wordpress içerisindeki “kancaları (hook)” kullanabilirsiniz. Örneğin menünüzün başına özel bir menü elemanı eklemek için;

function bizim_ menu_extra($content) {
$content = '<li class="menu-item">Özel içerikli öğe</li>' . $content;
return $content;
}
add_filter('wp_nav_menu_items', 'bizim_ menu_extra');

gibi bir kod kullanabilirsiniz. Yalnız bu kod tüm menüleri etkiler. Özel olarak wordpress admin panelinde oluşturduğunuz “Header” isimli bir menü için;

function bizim_ menu_extra($content) {
$content = '<li class="menu-item">Özel içerikli öğe</li>' . $content;
return $content;
}
add_filter('wp_nav_menu_header_items', 'bizim_ menu_extra');

fonsiyonunu kullanmanız gerekir. Üstteki iki fonksiyon arasındaki tek fark ikincide “wp_nav_menu_items” yerine “wp_nav_menu_{menu kısa ismi}_items” kullanılmasıdır. Menünüzün kısa ismini bilmiyorsanız; menü başlığınız ile aynı isimli bir etiket oluşturup bu etiketin kısa ismine bakarak menünüzün kısa adını öğrenebilirsiniz.