WordPress Menüleri: Navigasyon Mimarisine Tam Teknik Kılavuz

WordPress menüleri, ziyaretçileri sitenizin genelindeki sayfalara, gönderilere, kategorilere, özel URL’lere veya taksonomilere bağlayan — HTML <nav> öğeleri olarak işlenen — yapılandırılmış bir gezinme bağlantıları koleksiyonudur. Temalar tarafından register_nav_menus() kullanılarak kaydedilir ve WordPress yönetici arayüzü veya Özelleştirici aracılığıyla yönetilir; bu sayede site sahiplerine koda dokunmadan navigasyon hiyerarşisi üzerinde tam kontrol sağlar.

Çoğu WordPress kurulumunda menüler, birincil yön bulma sistemidir. Bunları doğru yapılandırmak yalnızca kullanıcı deneyimini değil, aynı zamanda tarama verimliliğini, dahili bağlantı değeri dağılımını ve arama motorlarının sitenizin içerik hiyerarşisini nasıl yorumladığını da etkiler.

WordPress Menüleri Arka Planda Nasıl Çalışır?

Yönetici paneline dokunmadan önce mimariyi anlamak faydalıdır. WordPress menüleri, birbiriyle bağlantılı üç katman üzerinden çalışır:

• Tema kaydı: Bir tema, functions.php içinde register_nav_menus() kullanarak mevcut menü konumlarını bildirir. Bu çağrı olmadan, Menüler yönetici ekranında atanabilir konum görünmez.
• Veritabanı depolama: Menü öğeleri, wp_posts içinde özel bir gönderi türü (nav_menu_item) olarak depolanır; ilişkiler wp_term_relationships aracılığıyla yönetilir. Her öğe URL, etiket, üst öğe kimliği ve konum gibi meta veriler taşır.
• Şablon işleme: Tema, şablon dosyalarında wp_nav_menu() çağırır ve bir theme_location argümanı iletir. WordPress atanan menüyü çözümler, öğe ağacını oluşturur ve anlamsal HTML çıktısı üretir.

Bunu anlamak, bir şeyler bozulduğunda tam olarak nereye bakacağınızı bilmenizi sağlar — şablonda eksik bir wp_nav_menu() çağrısı, konumu hiç kaydetmemiş bir tema veya veritabanında bozuk bir terim ilişkisi.

Adım 1: WordPress Menü Yöneticisine Erişin

WordPress kontrol panelinize giriş yapın ve Görünüm > Menüler bölümüne gidin. Bu ekran, tüm menü işlemleri için merkezi kontrol panelidir.

Kenar çubuğunda Görünüm menüsünü göremiyorsanız, kullanıcı rolünüz muhtemelen edit_theme_options yetkisine sahip değildir. Yönetici hesabı gereklidir.

Özelleştirici üzerinden alternatif yol:

Görünüm > Özelleştir > Menüler bölümüne gidin. Bu yol, düzenleyicinin yanında canlı önizleme paneli sunar; bu görsel konumlandırma için kullanışlıdır ancak özel Menüler ekranına kıyasla daha az toplu düzenleme seçeneği sunar.

Adım 2: Yeni Bir Menü Oluşturun

Menüler ekranında, sayfanın üst kısmındaki “Yeni bir menü oluştur” bağlantısına tıklayın.

1. Açıklayıcı bir dahili ad girin — örneğin Primary Navigation, Footer Legal Links veya Mobile Sidebar. Bu ad ziyaretçilere hiçbir zaman gösterilmez; yalnızca birden fazla menüyü yönetirken referans olarak kullanılır.
2. Menü Oluştur‘a tıklayın.

En iyi uygulama, menüleri “Menü 1” gibi genel etiketler yerine işlevlerine ve konumlarına göre adlandırmaktır. Bir site beş veya altı menüye ulaştığında, net adlandırma maliyetli atama hatalarını önler.

Adım 3: Menünüze Öğe Ekleyin

Menüler ekranındaki sol panel, menü öğesi olarak ekleyebileceğiniz tüm mevcut içerik türlerini sunar.

Sayfalar

Mevcut sayfaların (ör. Ana Sayfa, Hakkında, Hizmetler, İletişim) yanındaki kutuları işaretleyin ve Menüye Ekle‘ye tıklayın. WordPress varsayılan olarak yalnızca en son sayfaları gösterir. Tam listeyi görmek için Tümünü Görüntüle‘ye tıklayın veya belirli bir sayfayı başlığına göre bulmak için Arama sekmesini kullanın.

Gönderiler ve Özel Gönderi Türleri

Bireysel gönderiler de aynı şekilde eklenebilir. Temanız veya bir eklenti özel gönderi türleri (ör. portfolio, product) kaydediyorsa, bu gönderi türleri ayrı paneller olarak görünür — bunların show_in_nav_menus => true ile kaydedilmiş olması koşuluyla.

Kategoriler ve Etiketler

Taksonomi terimleri, içerik ağırlıklı siteler için güçlü menü öğeleridir. Bir kategori bağlantısı eklemek, ziyaretçileri o kategorinin arşiv sayfasına yönlendirir ve ilgili tüm gönderileri otomatik olarak ortaya çıkarır. Bu, içeriğin konuya göre düzenlendiği haber siteleri veya çok konulu bloglar için özellikle etkilidir.

Özel Bağlantılar

Özel bağlantılar, istediğiniz bağlantı metniyle eşleştirilmiş herhangi bir URL’yi — dahili veya harici — kabul eder. Kullanım durumları şunlardır:

• Bir alt alan adına veya harici araca bağlantı verme
• Kendi hedefi olmayan bir açılır menü tetikleyicisi olarak işlev gören yer tutucu üst öğe oluşturma (URL olarak # kullanın)
• Bir sayfa içindeki çapa hedeflerine bağlantı verme (ör. https://example.com/about/#team)

Özel bağlantı eklemek için:

1. Özel Bağlantılar panelini genişletin.
2. URL alanına tam URL’yi girin.
3. Bağlantı Metni alanına görünür etiketi girin.
4. Menüye Ekle‘ye tıklayın.

Adım 4: Menü Yapısını ve Hiyerarşisini Düzenleyin

Öğeler sağ taraftaki menü oluşturucuda göründükten sonra, sıralamayı ve hiyerarşiyi sürükle-bırak yöntemiyle kontrol edersiniz.

Öğeleri Yeniden Sıralama

Herhangi bir menü öğesine tıklayıp basılı tutun, ardından konumunu değiştirmek için yukarı veya aşağı sürükleyin. En soldaki öğeler yatay gezinme çubuklarında önce işlenir.

Alt Menüler Oluşturma (Açılır Gezinme)

Bir menü öğesini başka bir öğenin biraz sağına ve altına sürükleyin. Üst-alt ilişkisini gösteren görsel bir girinti belirir. Girintili öğe, üst öğesinin altındaki açılır menüde görünen bir alt menü girişi haline gelir.

Birden fazla seviye derinliğinde iç içe geçirebilirsiniz; ancak çoğu tema yalnızca iki veya üç seviyeyi biçimlendirir. Bunun ötesinde CSS ve JavaScript desteği değişkenlik gösterir ve mobil cihazlarda kullanıcı deneyimi bozulur.

Bireysel Menü Öğelerini Düzenleme

Ayarlarını genişletmek için herhangi bir menü öğesinin sağ tarafındaki oka tıklayın:

• Gezinme Etiketi: İşlenen menüde görüntülenen metin (sayfa başlığından bağımsız).
• Başlık Niteliği: Bağlantı etiketindeki HTML title niteliğini doldurur — erişilebilirlik için kullanışlıdır ancak etiket zaten açıklayıcıysa genellikle gereksizdir.
• Bağlantıyı yeni sekmede aç: target="_blank" ekler ve kritik olarak, WordPress ters sekme ele geçirmeyi önlemek için otomatik olarak rel="noopener noreferrer" ekler.
• CSS Sınıfları: Hedefli stil için bireysel öğelere özel sınıflar ekleyin.
• Bağlantı İlişkisi (XFN): Modern iş akışlarında nadiren kullanılır; XFN mikro biçimlerini kullanarak siz ve bağlantı hedefi arasındaki ilişkiyi tanımlamanıza olanak tanır.
• Açıklama: Bazı temalar menü etiketinin altında kısa bir açıklama görüntüler. Çoğu göstermez.

Not: CSS Sınıfları ve Açıklama alanları varsayılan olarak gizlidir. Bunları görünür kılmak için Menüler sayfasının sağ üst köşesindeki Ekran Seçenekleri‘ne tıklayın ve ilgili onay kutularını etkinleştirin.

Adım 5: Menüyü Bir Tema Konumuna Atayın

Menü oluşturmak onu sitenizde görünür kılmaz. Kayıtlı bir tema konumuna atamanız gerekir.

Menü oluşturucunun altındaki Menü Ayarları‘na gidin ve istenen konumun yanındaki kutuyu işaretleyin — etkin temanızın kaydettiğine bağlı olarak genellikle Birincil Menü, İkincil Menü, Alt Bilgi Menüsü veya Sosyal Bağlantılar Menüsü olarak etiketlenir.

Menüyü Kaydet‘e tıklayın.

Beklediğiniz bir tema konumu eksikse, tema onu kaydetmemiştir. Kayıtlı konumları programatik olarak doğrulayabilirsiniz:

print_r( get_registered_nav_menus() );

Mevcut konumları incelemek için bunu geçici bir şablon dosyasında veya Query Monitor gibi bir eklenti aracılığıyla çalıştırın.

Özelleştirici Aracılığıyla Menü Atama

Görünüm > Özelleştir > Menüler > Tüm Konumları Görüntüle bölümüne gidin. Her kayıtlı konumda hangi menünün görüntüleneceğini seçtiğiniz bir açılır menü bulunur. Buradaki değişiklikler yayınlanmadan önce canlı olarak önizlenir.

Adım 6: Gelişmiş Menü Özelleştirmesi

Menü Öğelerine Simge Ekleme

Çoğu tema, menü öğelerinde simgeleri yerel olarak desteklemez. Yaygın yaklaşımlar şunlardır:

• CSS sözde öğeleri: Menü öğesine bir sınıf ekleyin ve Font Awesome gibi bir kütüphaneden simge eklemek için stil sayfanızda ::before veya ::after kullanın.
• HTML ile Gezinme Etiketi: Bazı temalar Gezinme Etiketi alanında HTML’ye izin verir. Doğrudan bir <i> veya <svg> etiketi ekleyebilirsiniz; ancak bu kırılgandır ve tema etiketleri temizlerse bozulur.
• Eklenti tabanlı simge seçiciler: Max Mega Menu veya WP Menu Icons gibi eklentiler, menü öğesi düzenleyicisine doğrudan bir simge seçici ekler.

Mega Menüler

Derin içerik hiyerarşilerine sahip büyük siteler için standart açılır menüler hantal hale gelir. Mega menü, dar bir dikey liste yerine geniş, çok sütunlu bir panel görüntüler. Uygulama, özel bir eklenti veya bu kalıbı yerel olarak destekleyen bir tema gerektirir. WordPress’teki menü yapısı aynı kalır — fark tamamen temanın CSS ve JavaScript’inin iç içe geçmiş öğeleri nasıl işlediğindedir.

Duyarlı ve Mobil Menüler

Tüm modern temalar, küçük görünüm alanlarında yatay gezinmeyi hamburger düğmesine daraltır. Bu davranış, WordPress çekirdeği tarafından değil, temanın JavaScript ve CSS’i tarafından yönetilir. Temanızın mobil menüsü bozuk veya erişilemez durumdaysa, sorun neredeyse her zaman temanın navigation.js dosyasında veya geçiş düğmesinde eksik bir ARIA niteliğindedir.

Erişilebilirlik uyumluluğu (WCAG 2.1 AA) için geçiş düğmesinin şunlara sahip olması gerekir:

• Tıklamada true ve false arasında geçiş yapan bir aria-expanded niteliği
• Menü kapsayıcısının kimliğine işaret eden bir aria-controls niteliği
• Görünür bir odak göstergesi

Adım 7: Widget Alanlarındaki Menüler

Kaydedilmiş herhangi bir menüyü kenar çubuğu, alt bilgi widget alanı veya başka herhangi bir widget bölgesinde görüntüleyebilirsiniz.

Klasik widget’lar için (WordPress 5.8 öncesi):

1. Görünüm > Widget’lar bölümüne gidin.
2. Gezinme Menüsü widget’ını istenen widget alanına sürükleyin.
3. Açılır menüden menüyü seçin ve kaydedin.

Blok Düzenleyici widget ekranı için (WordPress 5.8+):

1. Görünüm > Widget’lar bölümüne gidin.
2. Blok eklemek için + simgesine tıklayın.
3. Gezinme bloğunu veya Özel HTML bloğunu arayın ve ekleyin.
4. Gezinme bloğu, mevcut bir menüye ada göre başvurabilir.

Tam Site Düzenleme (FSE) temaları için:

Blok tabanlı temalarda, geleneksel menülerin yerini Site Düzenleyici (Görünüm > Düzenleyici) içindeki Gezinme bloğu alır. Gezinme bloğu aynı menü verilerinden çeker ancak tamamen blok düzenleyici arayüzü içinde yönetilir. FSE temalarında klasik Görünüm > Menüler ekranı hiç görünmeyebilir.

WordPress Menü Türleri: Karşılaştırma

Birden Fazla Menüyü Yönetme

WordPress sınırsız sayıda kaydedilmiş menüyü destekler, ancak her tema konumuna aynı anda yalnızca bir menü atanabilir. Tipik bir iş sitesi için pratik çok menülü mimari:

• Birincil Menü: Üst düzey hizmet ve içerik sayfaları
• Alt Bilgi Menüsü (Sütun 1): Şirket ve yasal sayfalar
• Alt Bilgi Menüsü (Sütun 2): Destek ve kaynak bağlantıları
• Mobil Menü: Daha hızlı parmak gezinmesi için daha az öğeye sahip birincil menünün basitleştirilmiş versiyonu
• Kontrol Paneli/Hesap Menüsü: Yalnızca sitenin oturum açmış kullanıcı alanı varsa geçerlidir

Menüler ekranında menüler arasında geçiş yapmak için üstteki Düzenlenecek menüyü seçin açılır menüsünü kullanın ve Seç‘e tıklayın.

Programatik Menü Yönetimi

WordPress’i büyük ölçekte yöneten geliştiriciler için — özellikle dağıtımların betiklendiği VPS Hosting veya Dedicated Sunucular üzerinde — menüleri programatik olarak oluşturmak ve atamak, manuel yönetici tıklamalarından çok daha güvenilirdir.

Menü oluşturma ve bir konuma atama:

// Create the menu
$menu_id = wp_create_nav_menu( 'Primary Navigation' );

// Add a page item
wp_update_nav_menu_item( $menu_id, 0, array(
    'menu-item-title'   => 'Home',
    'menu-item-url'     => home_url( '/' ),
    'menu-item-status'  => 'publish',
    'menu-item-type'    => 'custom',
) );

// Assign to a theme location
$locations = get_theme_mod( 'nav_menu_locations' );
$locations['primary'] = $menu_id;
set_theme_mod( 'nav_menu_locations', $locations );

WP-CLI kullanarak ortamlar arasında menü dışa ve içe aktarma:

# Export the full site (includes menu data in the WXR file)
wp export --path=/var/www/html --dir=/tmp/exports

# On the target server, import
wp import /tmp/exports/site.xml --authors=create

WP-CLI ayrıca menü atamalarını doğrudan incelemenize de olanak tanır:

wp menu list
wp menu location list
wp menu location assign primary my-menu-slug

Bu, WordPress kurulumlarını cPanel’li VPS veya yalın Linux sunucusunda hazırlama ve üretim ortamları arasında taşırken son derece değerlidir.

Yaygın Menü Sorunları ve Çözüm Yolları

Menü Ön Yüzde Görünmüyor

• Menü oluşturuldu ancak bir tema konumuna atanmadı. Görünüm > Menüler > Menü Ayarları bölümüne gidin ve konum kutusunu işaretleyin.
• Temanın şablon dosyası, o konum için wp_nav_menu() çağırmıyor. Temanın header.php veya ilgili şablon parçasını inceleyin.
• Bir önbellek eklentisi eski bir sayfa sunuyor. Menüyü kaydettikten sonra önbelleği temizleyin.

Menü Öğeleri Yanlış URL Gösteriyor

• Site URL’si değişti (ör. HTTP’den HTTPS’ye geçiş veya yeni bir alan adına taşıma sonrasında). Özel bağlantı öğeleri mutlak URL’leri depolar ve manuel olarak veya veritabanı arama-değiştirme yoluyla güncellenmelidir:

wp search-replace 'http://olddomain.com' 'https://newdomain.com' --path=/var/www/html

Açılır Alt Menüler Görünmüyor

• Temanın fareyle üzerine gelme veya tıklama olayları için JavaScript’i yüklenmiyor. JS hataları için tarayıcı konsolunu kontrol edin.
• Bir CSS kuralı alt menü kapsayıcısını gizliyor. Öğeyi inceleyin ve karşılık gelen fareyle üzerine gelme/odak durumu olmayan display: none arayın.
• Menü öğeleri yönetici panelinde doğru şekilde iç içe geçirilmiş ancak tema yalnızca bir derinlik seviyesini destekliyor.

Tema Değişikliğinden Sonra Menü Kayboluyor

• Menüler veritabanında korunur, ancak tema konumları temalar arasında değişir. Geçiş yaptıktan sonra Görünüm > Menüler bölümüne gidin ve menülerinizi yeni temanın konumlarına yeniden atayın.

WordPress Gezinmesi için Güvenlik Değerlendirmeleri

Kullanıcı tarafından oluşturulan veya dinamik olarak oluşturulan URL’lere bağlantı veren menü öğeleri, diğer girdilerle aynı titizlikle ele alınmalıdır. Belirli riskler:

• Özel bağlantılar aracılığıyla açık yönlendirme: Siteniz sorgu parametrelerinden programatik olarak menü öğesi URL’leri oluşturuyorsa, girdiyi doğrulayın ve temizleyin. WordPress’in esc_url() işlevi herhangi bir URL çıktısını sarmalıdır.
• Menü görünürlüğü aracılığıyla ayrıcalık yükseltme: Bazı eklentiler “menü görünürlüğü” kuralları sunar (bu öğeyi yalnızca oturum açmış kullanıcılara, yöneticilere vb. göster). Bu kuralların yalnızca CSS ile gizlenmek yerine sunucu tarafında uygulandığından emin olun — DOM’da bir bağlantıyı gizlemek, hedef sayfaya erişimi kısıtlamaz.
• Gezinme Etiketlerinde XSS: WordPress çıktıda menü etiketlerini temizler, ancak item_spacing => 'discard' veya özel walker sınıflarına sahip özel wp_nav_menu() uygulamaları varsayılan kaçışı atlayabilir. Özel walker’larda her zaman esc_html() veya esc_attr() kullanın.

WordPress kurulumunuzu, temalarınızı ve eklentilerinizi güncel tutmak temel savunmadır. WordPress’i bir Paylaşımlı Web Hosting planında çalıştırıyorsanız, barındırıcınızın yönetici arayüzünü hedef alan yaygın enjeksiyon kalıplarını yakalayan sunucu düzeyinde WAF kuralları uyguladığını doğrulayın.

SSL ve Menü URL Bütünlüğü

Siteniz HTTPS üzerinde çalışıyorsa — Google HTTP’yi bir sıralama sinyali olarak değerlendirdiğinden çalışması gerekir — tüm menü öğesi URL’leri https:// şemasını kullanmalıdır. Bir menüdeki tek bir http:// bağlantısının tetiklediği karışık içerik uyarıları, tarayıcının güvenli kilit göstergesini bastırabilir ve ziyaretçi güvenini zedeleyebilir.

SSL yapılandırmanızın doğru olduğunu ve SSL Sertifikalarınızın menü öğelerinizde başvurulan tüm alt alan adlarını kapsadığını doğrulayın; özellikle shop.example.com veya docs.example.com gibi bir alt alan adına bağlantı veriyorsanız.

Bir SSL sertifikası yükledikten veya yeniledikten sonra tam bir menü denetimi yapın:

wp menu item list --menu=primary --fields=url --format=csv | grep "^http://"

Bu komuttan gelen her sonuç, HTTPS’ye güncellenmesi gereken bir menü öğesidir.

Temel Teknik Çıkarımlar

• Yönetici panelinde görünmelerini beklemeden önce functions.php içinde register_nav_menus() ile menü konumlarını kaydedin.
• Menüleri konumlara atayın — bir menüyü atamadan oluşturmak ön yüzde hiçbir şey işlemez.
• Menü öğesi düzenleyicisinde CSS Sınıfları, Açıklama ve Bağlantı İlişkisi alanlarını açmak için Ekran Seçenekleri‘ni kullanın.
• Tam Site Düzenleme temalarında, klasik Menüler ekranı yerine Site Düzenleyici’deki Gezinme bloğu aracılığıyla gezinmeyi yönetin.
• Birden fazla ortamda betiklenmiş dağıtımlar, taşımalar ve toplu güncellemeler için wp menu WP-CLI komutlarını kullanın.
• Herhangi bir alan adı taşıması veya HTTP’den HTTPS’ye geçişten sonra, menü öğesi URL’lerinde arama-değiştirme yapın — özel bağlantılar mutlak yolları depolar.
• Mobil menü erişilebilirliğini doğrulayın: aria-expanded, aria-controls ve klavye odak yönetimi uyumluluk için isteğe bağlı değildir.
• Nesne veya sayfa önbelleği çalıştıran üretim ortamlarında her menü kaydından sonra önbellek geçersiz kılma zorunludur.
• wp_nav_menu() içindeki özel walker sınıfları varsayılan kaçışı atlar — her zaman esc_html() ve esc_url() açıkça uygulayın.
• VPS Kontrol Panelleri üzerindeki çok ortamlı WordPress kurulumları için, menü yapılandırmalarını elle yeniden oluşturmak yerine güvenilir biçimde aktarmak amacıyla WP-CLI dışa aktarmalarını kullanın.

SSS

Aynı WordPress sitesinde mobil ve masaüstü için farklı menüler kullanabilir miyim?

Yalnızca WordPress menü sistemi aracılığıyla yerel olarak değil. Standart yaklaşım, iki tema konumu kaydetmektir — biri masaüstü için, biri mobil için — her birine farklı menüler atamak ve uygun konumu göstermek veya gizlemek için CSS medya sorguları kullanmaktır. Bazı mega menü eklentileri bunu yerleşik duyarlı yapılandırma panelleriyle otomatik olarak yönetir.

Menüm neden eklemediğim sayfaları gösteriyor?

Menü oluşturma sırasında Yeni üst düzey sayfaları bu menüye otomatik olarak ekle seçeneğini işaretlediyseniz, WordPress yeni yayımlanan her üst düzey sayfayı menüye ekler. Bu davranışı durdurmak için Menü Ayarları altındaki bu seçeneğin işaretini kaldırın ve kaydedin.

Menü konumu ile menü arasındaki fark nedir?

Menü konumu, tema tarafından tanımlanan bir yuvadır (ör. “Birincil Menü”). Menü ise yönetici panelinde oluşturduğunuz gerçek bağlantı koleksiyonudur. Bir menüyü bir konuma atarsınız. Bir menü birden fazla konuma atanabilir; bir konum aynı anda yalnızca bir menüyü barındırabilir.

Kısa kod veya blok kullanarak bir sayfaya WordPress menüsü nasıl eklerim?

WordPress çekirdeği, menüler için yerel bir kısa kod sağlamaz. Blok düzenleyicisindeki en temiz yöntem, bir Gezinme bloğu eklemek ve kaydedilmiş menünüzü seçmektir. Alternatif olarak, bir eklenti aracılığıyla PHP yürütme etkinleştirilmiş Özel HTML bloğunda wp_nav_menu() işlevini kullanın veya wp_nav_menu() sarmalayan bir kısa kod eklentisi kullanın.

Menü yapısı SEO’yu etkiler mi?

Evet, dolaylı ama anlamlı biçimde. Menü bağlantıları Googlebot tarafından taranır ve hedeflerine dahili bağlantı değeri aktarır. Birincil gezinmeden bağlantı verilen sayfalar genellikle daha yüksek tarama önceliği ve daha güçlü dahili PageRank sinyalleri alır. Önemli sayfaları birden fazla alt menü seviyesinin arkasına gömmek, etkin bağlantı değerlerini azaltır. En stratejik açıdan önemli sayfalarınızı birincil menü aracılığıyla ana sayfadan bir veya iki tıklama mesafesinde tutun.