WordPress'te Bir Üst Sayfa İçin Alt Sayfalar Listesi Nasıl Görüntülenir

Yakın zamanda okuyucularımızdan biri bize bir WordPress sayfasının alt sayfalarının nasıl görüntüleneceğini sordu? Bu, WPBeginner'da sıkça aldığımız bir sorudur ve web sitesi navigasyonunu ve kullanıcı deneyimini iyileştirme konusundaki yaygın bir ihtiyacı vurgulamaktadır. 

WordPress web sitenizi üst ve alt sayfalarla düzenlerseniz, alt sayfalarınızı veya alt sayfalarınızı ana üst sayfada görüntülemek isteyebilirsiniz. Bu, kullanıcıların belirli bir bölümdeki tüm mevcut bilgileri kolayca görmelerine ve ilgili alt konulara hızlıca göz atmalarına yardımcı olur.

Ayrıca, kolay gezinme için her alt sayfada ana üst sayfa bağlantısını göstermek isteyebilirsiniz, bu da bir ekmek kırıntısı benzeri etki yaratır. Bu akıcı gezinme, kullanıcıların sitenizin derinliklerinde kaybolmasını önler ve genel gezinme deneyimlerini geliştirir.

Bu makalede, WordPress'te bir üst sayfanın alt sayfalarının bir listesini kolayca nasıl göstereceğinizi anlatacağız.

Alt Sayfaların Bir Listesini Ne Zaman Göstermeniz Gerekir?

WordPress, yazılar ve sayfalar adında iki varsayılan gönderi türüyle birlikte gelir. Yazılar blog içeriğidir ve genellikle kategoriler ve etiketlerle düzenlenir.

Sayfalar, örneğin 'Hakkımızda' veya 'Bize Ulaşın' sayfası gibi, tek seferlik veya bağımsız, kalıcı içeriklerdir.

WordPress'te sayfalar hiyerarşik olabilir, bu da onları üst ve alt sayfalara göre düzenleyebileceğiniz anlamına gelir. Örneğin, Özellikler, Fiyatlandırma ve Destek için alt sayfalara sahip bir Ürün sayfası oluşturmak isteyebilirsiniz.

Bir alt sayfa oluşturmak için, WordPress'te alt sayfa oluşturma rehberimizi izleyin.

Üst ve alt sayfalarınızı oluşturduktan sonra, alt sayfaları ana üst sayfada listelemek isteyebilirsiniz.

Bunu yapmanın kolay bir yolu, üst sayfayı manuel olarak düzenlemek ve bağlantıları tek tek eklemektir.

Ancak, bir alt sayfa eklediğinizde veya sildiğinizde üst sayfayı her seferinde manuel olarak düzenlemeniz gerekecektir.

Bir alt sayfa oluşturup otomatik olarak üst sayfada bir bağlantı olarak görünmesini sağlamak daha güzel olmaz mıydı?

Bununla birlikte, WordPress'te üst sayfada bir alt sayfa listesini hızlı bir şekilde görüntülemenin bazı dinamik yollarına bakalım. Size üç yöntem göstereceğiz, böylece sizin için en iyi olanı seçebilirsiniz:

• Yöntem 1. Eklenti Kullanarak Üst Sayfada Alt Sayfaları Görüntüleme
• Yöntem 2. Kod Kullanarak Bir Üst Sayfanın Alt Sayfalarını Listeleme
• Yöntem 3. Kısa Kod Olmadan Alt Sayfaları Dinamik Olarak Görüntüleme

Yöntem 1. Eklenti Kullanarak Üst Sayfada Alt Sayfaları Görüntüleme

Bu yöntem, üst sayfada alt sayfaları görüntülemenin en kolay yoludur ve tüm kullanıcılar için önerilir.

İlk olarak, Page-list eklentisini yükleyip etkinleştirmeniz gerekir. Daha fazla ayrıntı için, bir WordPress eklentisinin nasıl kurulacağına dair adım adım kılavuzumuza bakın.

Etkinleştirdikten sonra, üst sayfayı düzenlemeniz ve alt sayfa listesini görüntülemek istediğiniz yere aşağıdaki kısa kodu eklemeniz yeterlidir.

[alt sayfalar]

Artık sayfanızı kaydedebilir ve yeni bir tarayıcı sekmesinde önizleyebilirsiniz. Tüm alt sayfaların basit bir madde işaretli listesini görüntülediğini fark edeceksiniz.

İsterseniz, listenin görünümünü değiştirmek için özel CSS ekleyebilirsiniz.

Başlangıç noktası olarak kullanabileceğiniz bazı örnek CSS'ler aşağıdadır.

ul.page-list.subpages-page-list {
    list-style: none;
    list-style-type: none;
    background-color: #eee;
    border: 1px solid #CCC;
    padding: 20px;
}

Özel CSS'nizi uyguladıktan sonra üst sayfayı önizleyebilirsiniz.

Test WordPress web sitemizde böyle görünüyordu:

Eklenti, derinliği ayarlamanıza, sayfaları hariç tutmanıza, öğe sayısını ve daha fazlasını belirlemenize olanak tanıyan bir dizi kısa kod parametresi sunar.

Ayrıntılar için, ayrıntılı belgeler için lütfen eklenti sayfasını inceleyin.

Yöntem 2. Kod Kullanarak Bir Üst Sayfanın Alt Sayfalarını Listeleme

Bu yöntem biraz gelişmiştir ve WordPress web sitenize kod eklemenizi gerektirir. Bunu daha önce yapmadıysanız, lütfen WordPress'te kodu nasıl kopyalayıp yapıştıracağınıza dair rehberimize göz atın.

Bir üst sayfanın altındaki alt sayfaları listelemek için, aşağıdaki kodu bir kod parçacığı eklentisine veya temanızın functions.php dosyasına eklemeniz gerekir:

function wpb_list_child_pages() { 
 
global $post; 
 
if ( is_page() && $post->post_parent )
 
    $childpages = wp_list_pages( 'sort_column=menu_order&title_li=&child_of=' . $post->post_parent . '&echo=0' );
else
    $childpages = wp_list_pages( 'sort_column=menu_order&title_li=&child_of=' . $post->ID . '&echo=0' );
 
if ( $childpages ) {
 
    $string = '<ul class="wpb_page_list">' . $childpages . '</ul>';
}
 
return $string;
 
}
 
add_shortcode('wpb_childpages', 'wpb_list_child_pages');

WPBeginner olarak, kodları WordPress'e eklemek için her zaman WPCode eklentisini kullanmanızı öneririz.

WPCode, temanızın dosyalarını düzenlemeden özel kod eklemenizi kolaylaştırır, böylece sitenizi bozma endişesi taşımanıza gerek kalmaz.

Öncelikle, ücretsiz WPCode eklentisini yüklemeniz ve etkinleştirmeniz gerekir. Adım adım talimatlar için, WordPress eklentisinin nasıl kurulacağına dair bu rehbere bakın.

Eklenti etkinleştirildikten sonra, WordPress kontrol panelinizden Kod Parçacıkları » Parçacık Ekle bölümüne gidin.

Oradan, fare imlecini 'Özel Kodunuzu Ekleyin (Yeni Parça)' seçeneğinin üzerine getirin ve 'Özel Parça Ekle' düğmesine tıklayın.

Ardından, ekranda beliren seçenekler listesinden kod türü olarak ‘PHP Snippet’ seçmeniz gerekir.

Ardından, kodun ne işe yaradığını hatırlamanıza yardımcı olacak bir başlık ekleyin.

Şimdi, yukarıdaki kodu ‘Code Preview’ kutusuna yapıştırmanız yeterlidir.

Ardından, anahtarı ‘Inactive’ konumundan ‘Active’ konumuna getirin ve sayfanın üst kısmındaki ‘Save Snippet’ düğmesine tıklayın.

Bu kod, önce bir sayfanın üst öğesi olup olmadığını veya sayfanın kendisinin bir üst öğe olup olmadığını kontrol eder.

Eğer bir üst sayfa ise, ona bağlı alt sayfaları görüntüler. Eğer bir alt sayfa ise, üst sayfasının diğer tüm alt sayfalarını görüntüler.

Son olarak, eğer bu sadece alt veya üst sayfası olmayan bir sayfa ise, kod hiçbir şey yapmayacaktır. Kodun son satırında, sayfa şablonlarınızı değiştirmeden alt sayfaları kolayca görüntüleyebilmeniz için bir kısa kod ekledik.

Alt sayfaları görüntülemek için, kenar çubuğundaki bir sayfaya veya metin widget'ına aşağıdaki kısa kodu eklemeniz yeterlidir:

[wpb_childpages]

Değişikliklerinizi kaydetmeyi ve bir tarayıcı sekmesinde önizlemeyi unutmayın. Sitemizde bu şekilde görünüyor.

Bu sayfa listesini özel CSS kullanarak stilleyebilirsiniz.

Başlangıç noktası olarak kullanabileceğiniz örnek CSS kodu aşağıdadır:

ul.wpb_page_list {
    list-style: none;
    list-style-type: none;
    background-color: #eee;
    border: 1px solid #CCC;
    padding: 20px;
}

Yöntem 3. Kısa Kod Olmadan Alt Sayfaları Dinamik Olarak Görüntüleme

Kısa kodları kullanmak uygundur, ancak onlarla ilgili sorun, üst veya alt sayfaları olan tüm sayfalara kısa kodlar eklemeniz gerekeceğidir.

Birçok sayfada kısa kodlar olabilir ve bazen eklemeyi unutabilirsiniz bile.

Daha iyi bir yaklaşım, temanızdaki sayfa şablon dosyasını düzenlemek olacaktır, böylece alt sayfaları otomatik olarak görüntüleyebilir.

Bunu yapmak için ana page.php şablonunu düzenlemeniz veya temanızda özel bir sayfa şablonu oluşturmanız gerekir.

Ana temanızı düzenleyebilirsiniz, ancak temanızı değiştirir veya güncellerseniz bu değişiklikler kaybolur. Bu nedenle, bir alt tema oluşturup değişikliklerinizi alt temada yapmanız daha iyi olur.

Sayfa şablonu dosyanızda, alt sayfaları görüntülemek istediğiniz yere bu kod satırını eklemeniz gerekir.

<?php wpb_list_child_pages(); ?>

Hepsi bu kadar. Temanız artık alt sayfaları otomatik olarak algılayacak ve düz bir liste halinde gösterecektir.

Stilleri CSS ve biçimlendirme ile özelleştirebilirsiniz.

OptinMonster web sitesinin üst sayfayı ve alt sayfaları nasıl gösterdiğine dair bir örnek aşağıdadır:

Umarım bu makale, WordPress'te bir üst sayfa için alt sayfaları listelemenize yardımcı olmuştur. Ayrıca, yeni bir WordPress web sitesinde oluşturmanız gereken en önemli sayfalar hakkındaki rehberimize ve özel düzenler oluşturmak için en iyi sürükle ve bırak WordPress sayfa oluşturucuları karşılaştırmamıza da göz atmak isteyebilirsiniz.

Bu makaleyi beğendiyseniz, lütfen WordPress video eğitimleri için YouTube Kanalımıza abone olun. Bizi ayrıca Twitter ve Facebook'ta da bulabilirsiniz.