İlgili içeriği birkaç ilişkili alt sayfaya bölmek, bilim olduğu kadar sanattır. Bir WordPress web yöneticisi olarak tekil bir sayfaya çok fazla içerik koymak isteyebilirsiniz. Fakat buna karşı koymalısınız! Dağınıklığı azaltmak, sayfanızın okunabilirliğini artıracaktır. Ve içeriğinizi birkaç sayfaya yaymak, karışıklığı önlemenin en yaygın yollarından biridir. Fakat yine de ziyaretçileriniz için orijinal sayfa ile sonraki alt sayfaların bağlantılı olduğunu açıkça belirtmeniz gerekir. Ve bu alt sayfalara kolayca erişilebildiğinden emin olun.
Orijinal sayfaya bağlı tüm alt sayfaların bir dizinini ekleyerek bu sorunu çözebilirsiniz. Dizin, web sitesi kullanıcılarının aradıkları içeriği hızlı bir şekilde görüntülemelerine ve içerik arasından seçim yapmalarına ve hatta yeni bir şey keşfetmelerine yardımcı olacaktır.
Alt sayfalar oluşturmak oldukça kolaydır, çünkü WordPress bunu yapmanıza yardımcı olacak yerleşik bir seçeneğe sahiptir. Bir sayfayı diğerinin ana sayfası olarak atayarak çalışır (alt sayfa olarak anılır). Bununla birlikte zor olan kısım, ana sayfaya bir alt sayfalar dizini eklemektir. Bu yüzden bu makalede, belirli bir ana sayfaya ait alt sayfaların bir dizininin nasıl gösterileceğine bakacağız. Ve size bu sorunu birkaç küçük adıma bölerek nasıl çözeceğinizi göstereceğiz. Ama önce, alt ve üst sayfaların ne olduğuna bir bakalım. Bu konuda zaten akıcıysanız, aşağı kaydırarak pratik adımlara geçebilirsiniz.
WordPress’teki alt ve üst sayfalar nelerdir?
Alt ve üst sayfalar, web sitenizin içerik hiyerarşisini düzenlemenin ve yapılandırmanın bir yoludur. Bunlar web sitenizin Hakkımızda, İletişim veya Hizmetler gibi içeriği için statik sayfalar oluşturmanıza izin veren WordPress sayfa sisteminin bir özelliğidir.
Üst sayfa, diğer sayfalar için kapsayıcı veya kategori görevi gören üst düzey bir sayfadır. İlgili alt sayfaları veya alt sayfaları gruplandırabileceğiniz ana sayfa veya bölüm görevi görür. Bu alt sayfalar, ana sayfanın URL yapısı ve menü yerleşimi gibi belirli özellikleri üst sayfalarından devralır. Belirli bir üst sayfanın altındaki alt sayfalar olarak kabul edilebilecek alt sayfalar, düzenleyicide üst sayfalarının altında girintili ve iç içe yerleştirilmiştir ve net bir hiyerarşik ilişki korunur.
Bununla ilgili daha fazla bilgi edinmek için, ana sayfaların ne olduğunu daha ayrıntılı olarak açıklayan makalemize göz atın.
Belirli bir WordPress sayfasına eklenmiş tüm alt sayfaların bir dizinini iki farklı yöntem kullanarak gösterebilirsiniz. İlki, uygun bir eklenti kullanmayı içerir ve ikincisi, bu özelliği özel kod kullanarak etkinleştirmeyi içerir. Size her iki yöntem için de adımları göstereceğiz. Fakat öncelikle bir üst sayfanın başka bir WordPress sayfasına nasıl atanacağını açıklamamız gerekiyor.
-
Bir üst sayfayı başka bir sayfaya atama
-
Bir eklenti kullanarak alt sayfaları gösterme
-
Alt sayfaları özel kod kullanarak gösterme
WordPress içinde başka bir sayfaya bir ana sayfa atama
Hangi sayfanın alt sayfa olacağına karar vererek başlayın. Ardından düzenlemek için açın ve sağdaki Sayfa Özellikleri bölümüne gidin. Varsayılan WordPress sayfa oluşturucusu olan Gutenberg’i kullanıyorsanız, bölüm Belge sekmesinde yer alacaktır. Ardından Ana Sayfa seçeneğini bulun, açılır menüden bir sayfa seçin ve sayfayı güncellemek için ekranın sağ üst köşesindeki Güncelle düğmesine basın.
Bu durum açılır menüden seçtiğiniz sayfayı düzenlemekte olduğunuz sayfanın ebeveyni olarak ayarlayacaktır. Başarılı bağlantı, Tüm Sayfalar listesinden de görülebilir. Alt sayfalar, karşılık gelen üst sayfanın altında gösterilir ve adlarının önünde kısa çizgi kullanılarak girintilenir.
Ana sayfaları zaten var olan ana sayfalara da atayabilirsiniz. Bu durum birden çok derinliğe sahip alt sayfalar oluşturur. Çocuk derinlik seviyesi daha sonra sayfa başlığından önceki tire sayısıyla not edilir.
Bir eklenti kullanarak alt sayfaları gösterme
Neredeyse her amaca yönelik çok sayıda WordPress eklentisi nedeniyle, yeni bir özellik veya işlevsellik eklerken her zaman önce uygun bir eklenti bulmaya çalışmalısınız. Bu yazıda kullanacağımız eklenti CC Child Pages eklentisidir. Bu eklentiyi kurduktan sonra iki şekilde kullanabilirsiniz.
İlk yol, widget kullanmayı gerektirir. CC Child Pages widget’ını istediğiniz widget alanına ekleyin ve ardından mevcut widget seçeneklerini ayarlayın.
CC Child Pages widget’ını Kullanılabilir Widget’lar bölümünün listesinin üst kısmına yakın bir yerde bulacaksınız. Eklediğinizde, hangi seçeneklerin sizin için yararlı olacağını seçebilirsiniz. Örneğin Sayfa Başlığını Göster seçeneği işaretlendiğinde, Başlık alanındaki statik başlığı geçerli üst sayfanın adıyla değiştirir, böylece alt sayfa dizini, yalnızca Alt sayfalar demek yerine yararlı bir başlığa sahip olur. Hariç Tut seçeneğine sayfa kimlikleri ekleyerek hangi sayfaların gösterilmeyeceğini seçebilirsiniz.
Başvuru için, bir sayfa kimliği, bir sayfanın kalıcı bağlantısında, içinde ?post= olan kısımdan sonra bulabileceğiniz bir sayıdır. Örneğin bizim durumumuzda, Bize Ulaşın sayfasının kimliği 1114’tür.
Hatta Kardeş Sayfaları Göster’i işaretleyerek, aynı ebeveyne sahip ve aynı alt derinlikte olan sayfaları göstereceksiniz.
Widget içeriğinin Powerlift temasıyla yapılmış bir web sitesinde nasıl görünebileceğine dair bir örneği burada bulabilirsiniz.
CC Child Pages eklentisini kullanmanın ikinci yolu, kısa kodu doğrudan eklemektir. Gutenberg sayfa oluşturucuyu kullanarak sizi adımlardan geçireceğiz. Bunların ne olduğundan ve sayfanıza eklerken hangi biçimde kullanılacağından emin değilseniz, özel kısa kodlarla ilgili makalemizi okumanızı şiddetle tavsiye ederiz. Makale ayrıca, tercih ettiğiniz sayfa oluşturucular olarak Elementor veya WPBakery kullanıyorsanız, sayfanıza özel bir kısa kod eklemeyi de kapsar.
Özel kısa kodu bir sayfaya eklemek için, bir Gutenberg bloğu eklemek için + işaretini tıklayın ve bir Kısa kod bloğu seçin. Ardından içine kısa kod adını girin ve Güncelle düğmesine basın. Kısa kod adı child_pages’dir, yani basitçe ekleyebilirsiniz [child_pages]. Bunu yaparak, olası her işlev parametresi, karşılık gelen eklenti dosyasında tanımlanan varsayılan değerine ayarlanacaktır. Fakat bazı parametreleri belirtmek için bağımsız değişkenlerinizi de ekleyebilirsiniz. Olası bağımsız değişkenler listesi bir ilişkisel dizi olarak ayarlandığından, bağımsız değişkenleri şu biçimde eklemelisiniz: key=’value’. Birden fazla giriş yapıyorsanız, bunları bir boşlukla ayırmalısınız.
Örnek olarak aşağıdakileri belirledik:
[child_pages cols=’2’ depth=’0’]
Bu durum dizin listemizin 2 sütunda (cols=’2′) görüntülenmesini sağlar ve üst ve tüm alt sayfaları hiyerarşik ve girintili (derinlik=’0′) bir listede sunar. Mevcut bağımsız değişkenler ve bunların nasıl dahil edileceği hakkında daha fazla bilgi edinmek istiyorsanız, resmi eklenti sayfasını ayrıntılı olarak incelemenizi öneririz.
Örnek kısa kodu ekledikten sonra, aşağıda gösterilen aşağıdaki sonucu aldık.
Bu eklentinin dezavantajı, çok az ek seçeneğe sahip olmasıdır. Stil amacıyla, hazır eklenti stillerini kullanıp kullanmayacağınızı seçebilirsiniz. Bu durum Ayarlar > Alt Sayfalar’da Dış Görünüm CSS’yi Sıraya Al seçeneğinin yanındaki Evet veya Hayır onay kutusunu işaretleyerek yapılır.
Alt sayfa sonuçlarınızın stilini iyileştirmek için aşağıdaki Özel CSS seçeneğine ek, özel hazırlanmış CSS de ekleyebilirsiniz.
Ayarlarda herhangi bir değişiklik yaptıktan sonra, bu değişikliklerin geçerli olması için aşağıdaki Güncelleme Seçenekleri düğmesine basmayı unutmayın.
Alt sayfaları özel kod kullanarak gösterme
Bir alt sayfalar dizini oluşturmanın başka bir olası yolu, özel yapım kod kullanmaktır. Bu yöntemin yararı, özelleştirme özgürlüğüdür. Herhangi bir eklentiye ihtiyaç duymadan, alt sayfaların dizin bölümünü tam olarak ihtiyacınıza göre değiştirebilirsiniz. Fakat özel kod oluşturmak, ağırlıklı olarak daha deneyimli WordPress kullanıcılarına yönelik bir yöntemdir.
Bu yöntem için gerekli adımlara geçmeden önce, yapmak istediğimiz birkaç öneri var. İlk olarak FTP kullanımı konusundaki bilgilerinizi tazelemenizi öneririz. İkinci olarak yanlış kod kullanımı web sitenizi bozabileceğinden, WordPress dosyalarınızın yedeğini önceden almak doğru bir politikadır.
Bunu söyledikten sonra, bu yöntemin açıklamasına geçelim. Öncelikle, FTP kimlik bilgilerinizi kullanarak sunucunuza bağlanmanız ve genellikle public_html olarak adlandırılan kök WordPress dizininize gitmeniz gerekir.
Daha sonra /wp-content/themes dizinine gidin ve açmak için mevcut temanızın dizinine tıklayın.
İçinde functions.php dosyasını bulun, üzerine sağ tıklayın ve Görüntüle/Düzenle seçeneğini seçin.
Tercih ettiğiniz metin düzenleyiciyi kullanarak dosyayı açın ve aşağıda verilen kodu dosyanın sonuna ekleyin.
function qode_children_list() {
global $id;
$child_pages = wp_list_pages( array(
'title_li' => '',
'child_of' => $id,
'sort_column' => 'post_date',
'sort_order' => 'desc',
'echo' => 0
) );
if ( $child_pages){
$output="<ul>" . $child_pages . '</ul>';
}
else
$output="";
return $output;
}
add_shortcode( 'children_list', 'qode_children_list', 11 );
Yukarıdaki koda daha yakından bakalım.
Bu kod, children_list adlı küçük bir özel kısa koddur. Kısa kodun kullanıldığı bir sayfanın ilgili alt sayfalarına giden sırasız bir bağlantı listesi görüntüler. Bu sayfanın alt sayfası yoksa, kod hiçbir şey yapmaz (çıktı HTML’si boş olur).
Kod tamamen wp_list_pages() işlevine dayanır. Bu fonksiyon, çok az kullanmamıza rağmen birçok olası parametre alabilir. Dikkate değer olanlar, uygun bağlantıları sıralamak için kullandığımız iki tanesidir. Daha doğrusu bağlantılar, alt sayfaların yayınlanma tarihlerini takiben azalan sırada sıralanır. Bu yüzden listedeki girişler en yeniden başlayacak ve en eskiye doğru inecektir.
Parametreleri ve kullanımı hakkında daha fazla bilgi için wp_list_pages() işleviyle ilgili belgeleri incelemenizi şiddetle öneririz. Bununla birlikte bu kısa kodu web sitemizde nasıl kullanabileceğimize bakalım.
Kısa kodu sayfanıza eklemek istiyorsanız, sayfa oluşturucunuz olarak Gutenberg’i kullanarak bunu yapabilirsiniz. Yeni bir blok eklemek için + işaretine basın, Kısa kod bloğunu seçin ve ekleyin [children_list]. Son olarak sayfanın sağ üst köşesindeki Güncelle düğmesine basın. Sayfa oluşturucularınız olarak Elementor veya WPBakery’yi tercih ederseniz, bunlar için gerekli adımları özel kısa kodların kullanımıyla ilgili makalemizde bulabilirsiniz.
Örnek olarak verdiğimiz aynı kısa kodu sayfanızın içeriğinde kullandıysanız, aşağıdaki sonucu alırsınız:
Kısa kodu bir Metin parçacığına da yerleştirebilir ve alt sayfa dizinini tercih ettiğiniz pencere öğesi alanında görüntüleyebilirsiniz. Bu kullanım ayrıca özel kısa kodlar hakkındaki makalemizde daha ayrıntılı olarak açıklanmaktadır. Şimdilik, basitçe ekleyebilirsiniz [children_list] Metin widget’ının içine girin ve Kaydet düğmesine basın. Örneğimizde bunu yapmamayı seçmiş olmamıza rağmen, alt sayfa dizininiz için bir başlık bile ekleyebilirsiniz.
Kenar çubuğu alanına eklendikten sonra kısa kodun Powerlift temasında nasıl göründüğü aşağıda açıklanmıştır.
Bu listenin görünümünü daha da stilize etmeyi seçebilirsiniz. Bu durum bazı özel CSS oluşturarak yapılabilir. Bunu yapmayı seçerseniz, yönetici kontrol panelinizin Görünüm > Özelleştir bölümünde yer alan Ek CSS altına eklemenizi tavsiye ederiz.
Son düşünceler
Belirli bir üst sayfanın tüm alt sayfalarını göstermenin birçok faydası vardır. Birkaç isim vermek gerekirse, web sitenizde gezinmeyi kolaylaştırmak ve kullanıcı deneyimini geliştirmek. Bir WordPress ana sayfasının alt sayfalarını göstermek kolay görünse de, WordPress’te yerleşik seçeneklerin olmaması biraz karmaşık hale geldi. Fakat yazıda özetlediğimiz adımları takip ederseniz, bunu hızlı bir şekilde ve minimum çabayla başarabilirsiniz. Ek olarak her iki yöntemin de kapsamlı bir açıklamasını sağlamak için elimizden gelenin en iyisini yaptık. Şimdi hangisini kullanmayı tercih edeceğinizi seçmek size kalmış.