Online Kimya Özel Dersi Al

ÜCRET

KONU

TARİH

4.11 Sayfalama (Pagination)

wordpress tema yapımı

BU DERSİN BAŞLIKLARI

Sayfalama özelliği, bir web sayfası için fazla uzun olduğunu düşündüğünüz bir içeriği, birden fazla sayfaya paylaştırma işlemidir.

WordPress’in, sayfalama özelliği, 3 amaçla kullanılır. Bu amaçlar şunlardır:

  1. Yazı listesini sayfalamak için: Blog sayfanız ya da kategori arşiviniz gibi arşiv sayfalarınızda gösterilen yazı listeniz sayfalara bölünür.
  2. Uzun bir yazıyı sayfalamak için: Bazı blog yazıları, normalden daha uzun olabilir. Uzun bir içerik yazarken, bu içeriği, tek sayfada sunmak yerine, sayfalara bölebilirsiniz.
  3. Önceki ve sonraki yazılara bağlantılar vermek için: Tek yazı sayfalarında, bir önceki yazıya ya da bir sonraki yazıya bağlantı verebilirsiniz.

Sayfalama için kullandığımız bu üç yöntemi sırasıyla görelim:

Aşağıda göreceğiniz, url değerlerinde, https://sitecenneti.com/ ifadesi ve bu ifadeye eklenen kategori isimleri gibi diğer parametreler semboliktir. Sizin temanızda, bu ifadeler, sitenizin url değeri ve ekrandaki sayfanıza özel diğer parametreler ile yer değiştirir.


1- Yazı Listelerini Sayfalama

Çok sayıda yazının olduğu bir blog ya da bir arşiv sayfasında, bütün yazıları tek sayfa olarak listelemek çok mantıklı bir yaklaşım değildir. Bunun yerine, bu listeyi sayfalara bölmek, daha doğru bir tercihtir. WordPress kurulumu, son yazılarımızı listelediğimiz blog sayfasında veya yazı arşivi sayfalarında en fazla 10 adet yazıyı sıralar.

Temamızda, yazı listelerimiz için sayfalama fonksiyonları kullandıysak, WordPress, yazılarımızın sıralandığı sayfalara, güçlü bir sayfalama özelliği ekler. Sayfalama fonksiyonları, gerekli HTML yapısını bizim için gerekli sayfalarda oluşturur. Örnek olarak, Twenty Nineteen temasının kullandığı sayfalama yapısının temadaki görüntüsü, beşinci sayfa tıklanmışken şöyledir:

WordPress ile Sayfalama

WordPress, varsayılan olarak, blog ya da arşiv sayfalarınızı, her sayfada 10 adet yazı listelenecek şekilde sayfalara böler. Dilerseniz bu sayıyı, Yönetim Paneli : Ayarlar->Okuma sayfasındaki “En fazla gösterilecek blog sayfası adedi” kısmından değiştirebilirsiniz:

WordPress ile Sayfalama – En Fazla Gösterilecek Blog Sayfası Adedi

Temamızın blog sayfasında veya arşiv sayfalarında, WordPress’in sayfalama özelliğini kullanabilmek için, şablon dosyalarına eklememiz gereken bazı fonksiyonlar vardır.

Yazı Listelerini Sayfalamak İçin Kullanılan Fonksiyonlar

Fonksiyonlara geçmeden önce, bu fonksiyonları şablon dosyalarınıza nasıl yerleştireceğinizi göstermek istiyorum.

Sayfalama özelliğini, listenin üstünde de kullanabiliriz, listenin altında da. Eğer listenin üstünde bir sayfalama yapmak istiyorsak, sayfalama fonksiyonları, WordPress döngüsünün başında, if ile while arasında kullanılmalıdır. Eğer, sayfalamayı, listenin altında yapmak istiyorsak, fonksiyonlar, endwhile ile endif arasında kullanılmalıdır. Bahsettiğimiz bölgeleri aşağıda görebilirsiniz:

<!-- WORDPRESS DÖNGÜSÜ -->
<?php if ( have_posts() ) : ?>
 
    <!-- YAZI LİSTELERİ İÇİN SAYFALAMA FONKSİYONLARI BURADA OLABİLİR. --Burası yazıların üst kısmıdır-- -->
 
    <!-- döngünün başı. -->
    <?php while ( have_posts() ) : the_post(); ?>
 
    <!-- döngünün içi -->
 
    <?php endwhile; ?>
    <!-- döngünün sonu -->
 
    <!-- YAZI LİSTELERİ İÇİN SAYFALAMA FONKSİYONLARI BURADA OLABİLİR. --Burası yazıların alt kısımıdır-- --> 
 
<?php else : ?>
 
  <?php _e('Üzügünüm, aradığınız içerik bulunamadı.'); ?>

<?php endif; ?>

Gelelim fonksiyonlara. Bir WordPress temasının arşiv ya da blog sayfalarına, sayfalama özelliği kazandırmak için kullanabileceğimiz fonksiyonlar şunlardır:

  • paginate_links()
  • posts_nav_link()
  • the_posts_navigation()
  • next_posts_link()
  • previous_posts_link()
  • the_posts_pagination()Tavsiyem

Bu fonksiyonlar, arşiv veya blog sayfanızda kullanılır. Bu yüzden, bu fonksiyonları, arşiv şablonlarınızda veya home.php şablonunuzda kullanmalısınız.

Fonksiyonları ve yaptıkları işleri daha yakından görelim:

I- Paginate_links() Fonksiyonu

Bu fonksiyon, WordPress’in ürettiği, temel sayfalama fonksiyonudur. Fonksiyon, zorunlu olmayan bir parametre ile çalışır:

paginate_links( $argumanlar = array() )

Argümanları daha yakından tanımaya geçmeden önce, fonksiyonu, varsayılan argümanları ile kullandığımızda karşımıza nasıl bir sayfalama yapısı çıkmaktadır, bir göz atalım.

paginate_links() fonksiyonunu, şablon dosyamızda, şu şekilde kullanıyoruz:

<?php echo paginate_links(); ?>

Bu kullanım ile üretilen sayfalama çıktıları şöyledir:

İlk sayfada iken:

WordPress ile Sayfalama – Paginate_links Fonksiyonu

2. sayfada iken:

WordPress ile Sayfalama – Paginate_links Fonksiyonu

3. sayfada iken:

WordPress ile Sayfalama – Paginate_links Fonksiyonu

4. sayfada iken:

WordPress ile Sayfalama – Paginate_links Fonksiyonu

5. sayfada iken:

WordPress ile Sayfalama – Paginate_links Fonksiyonu

Son sayfada iken:

WordPress ile Sayfalama – Paginate_links Fonksiyonu

Resimlerde de görüldüğü gibi, paginate_links() fonksiyonu, varsayılan değerler ile de oldukça kullanışlı ve yakışıklı bir sayfalama HTML’i üretilebilmektedir. (Yukarıdaki çıktılara CSS uygulanmıştır. Sizin çıktılarınız birebir aynı olmayabilir.)

HTML demişken, paginate_links() fonksiyonunun, resimlerde gördüğümüz çıktıyı vermek için nasıl bir HTML yapısı ürettiğine bir göz atalım. Fonksiyonun, 5. sayfa tıklanmışken ürettiği HTML yapısını şöyledir:

<a class="prev page-numbers" href="https://sitecenneti.com/category/block/page/4/">« Önceki</a>
<a class="page-numbers" href="https://sitecenneti.com/category/block/">1</a>
<span class="page-numbers dots">…</span>
<a class="page-numbers" href="https://sitecenneti.com/category/block/page/3/">3</a>
<a class="page-numbers" href="https://sitecenneti.com/category/block/page/4/">4</a>

<!-- Ekrandaki sayfa veya Son tıklanan sayfa -->
<span class="page-numbers current" aria-current="page">5</span>

<a class="page-numbers" href="https://sitecenneti.com/category/block/page/6/">6</a>
<a class="page-numbers" href="https://sitecenneti.com/category/block/page/7/">7</a>
<span class="page-numbers dots">…</span>
<a class="page-numbers" href="https://sitecenneti.com/category/block/page/12/">12</a>
<a class="next page-numbers" href="https://sitecenneti.com/category/block/page/6/">Sonraki »</a>

Görüldüğü gibi, paginate_links() fonksiyonunun ürettiği HTML, bize, CSS için yeterli imkan sunmaktadır.

Sayfalama yapısındaki, “Önceki” ve “Sonraki” ifadeleri, tercümeye göre veya bu ifadeleri yöneten argümanların değerlerine göre değişiklik gösterebilir.

Paginate_links Fonksiyonunun Argümanları

paginate_links() fonksiyonu, dizi tipinde bir parametre alır ve bu parametrenin argümanları vardır. Bu argümanlar ve varsayılan değerleri şöyledir:

//
// Argümanların varsayılan değerleri olarak gördüğünüz değişkenler,
// fonksiyonun vermediğimiz kısmında hesaplanmıştır.
//
$argumanlar= array(
        'base'               => $pagenum_link, // $pagenum_link = https://sitecenneti.com/all_posts.php%_% : %_% kısmı aşağıdaki 'format' argümanının değeri ile yer değşitirir
        'format'             => $format, // $format = ?page=%#% : %#% kısmı sayfa numarası ile yer değiştirir
        'total'              => $total, // toplam sayfa sayısıdır.
        'current'            => $current, // şimdiki sayfadır
        'aria_current'       => 'page',
        'show_all'           => false,
        'prev_next'          => true,
        'prev_text'          => __( '« Previous' ),
        'next_text'          => __( 'Next »' ),
        'end_size'           => 1,
        'mid_size'           => 2,
        'type'               => 'plain',
        'add_args'           => array(), // eklemek istediğiniz sorgular buradan eklenir
        'add_fragment'       => '',
        'before_page_number' => '',
        'after_page_number'  => '',
    );

Her ne kadar, varsayılan değerleri ile de oldukça kullanışlı bir sayfalama çıktısı oluştursa da, paginate_links() fonksiyonunun argümanlarını merak edeneler için, bu argümanlar aşağıda detaylı bir şekilde açıklanmıştır.

‘base’

Sayfalanacak olan içeriğin ana url değeridir. Varsayılan değeri, sonuna ‘%_%’ ifadesi eklenmiş olarak, ekrandaki arşiv sayfasının url değeridir. Bu url değerinin sonundaki ‘%_%’ ifadesi, 'format' argümanına verdiğimiz değer ile yer değiştirir.

Base argümanın varsayılan değeri, kalıcı bağlantı ayarınıza bağlıdır. Kalıcı bağlantı ayarlarınız, yönetim panelinden, Ayarlar->Kalıcı bağlantılar sayfasından yapılır:

WordPress ile Kalıcı Bağlantı Ayarları

Temanızın kalıcı bağlantı ayarı “Düz” ise, bu argüman şu değeri alır:

https://sitecenneti.com/%_%

Kalıcı bağlantı ayarınız “Düz” değil ise, görüntülediğiniz arşive bağlı olarak, farklı değerler alır. Aşağıda, “Block” adlı bir kategoriye ait bir arşiv sayfası için aldığı değeri görüyorsunuz:

https://sitecenneti.com/category/block/%_%

‘format’

Yukarıda bahsettiğimiz, 'base' argümanının sonundaki, “%_%” ifadesinin yerine geçer.

Kalıcı bağlantı ayarınız “Düz” iken varsayılan değeri şöyledir:

?page=%#%

Kalıcı bağlantı ayarınız başka bir seçenek ise, varsayılan değeri şöyledir:

page/%#%/

Bu değerde gördüğünüz ‘%#%’ ifadesi, arşivin ikici sayfasından itibaren görünecek olan sayfa numarası ile yerdeğiştirir. Mesela, “Block” kategorisindeki arşivin, beşinci sayfasında isek, sayfanın url değeri şöyle olacaktır:

https://sitecenneti.com/category/block/page/5/

Yukarıdaki ifadede geçen, page/5/ kısmı bu argümanın oluşturduğu kısımdır.

‘total’

(int) Sayfalanan arşivdeki toplam sayfa sayısıdır. Varsayılan değeri aşağıdaki gibi hesaplanmıştır:

'total' = isset( $wp_query->max_num_pages ) ? $wp_query->max_num_pages : 1;

‘current’

(int) Ekranda gösterilen sayfa numarasıdır. Varsayılan değeri aşağıdaki gibi hesaplanmıştır:

'current' = get_query_var( 'paged' ) ? intval( get_query_var( 'paged' ) ) : 1;

‘aria_current’

paginate_links() fonksiyonunun oluşturduğu HTML yapısında, son tıklanan sayfa numarası için özel bir HTML elemanı kullanılır.

Örnek olarak:

WordPress ile Sayfalama

Yukarıdaki HTML’de, 5. sayfa, son tıklanan sayfadır ve 5 sayısının HTML kodu şöyledir:

<span class="page-numbers current" aria-current="page">5</span>

Yukarıdaki HTML kodu, en son tıklanmış olan her sayfa için oluşturulur. Bu kodda gördüğünüz:

aria-current="page"

özelliğinin aldığı değer, bu argümandan gelir. Argümanın varsayılan değeri “page” dir. Bir kısıtlama olmamakla birlikte, bu argüman için ‘step‘, ‘location‘, ‘date‘, ‘time‘, ‘true‘, ‘false‘ gibi değerler tercih edilmektedir.

‘show_all’

(bool) Bütün sayfa numaralarının gösterilip gösterilmeyeceğini belirler. true değeri, bütün sayfaları göster, false değeri ise gösterme demektir. Varsayılan değeri false olarak ayarlanmıştır.

Toplam 12 sayfalık bir arşivde, bu argümanı, true olarak ayarlar isek:

<?php
echo paginate_links(array(
	'show_all'	 => true,
   ));
?>

karşımıza şöyle bir sayfalama HTML’i çıkar:

WordPress ile Sayfalama

Yukarıdaki HTML, 5. sayfaya tıklandığında oluşan HTML yapısıdır.


‘end_size’

(int) Sayfalama listesinin başında ve sonunda kaç adet sayfa numarası gösterileceğini belirler. Varsayılan değeri 1 olarak ayarlanmıştır.

WordPress ile Sayfalama

Bu argümana 1 değerini aldığı için, sayfalama listesinin başında sadece 1. sayfa ve sonunda sadece 12. sayfa gösterilmiştir. Bu argümanın değeri 2 olsaydı:

<?php
echo paginate_links(array(
	'end_size'	 => 2,
   ));
?>

sayfalama listesi, 6. sayfada iken şöyle görünürdü:

WordPress ile Sayfalama

‘mid_size’

(int) Son tıklanan sayfa numarasının sağında ve solunda kaç adet sayfa numarası bulunacağını gösterir. Varsayılan değeri 2 olarak ayarlanmıştır.

‘prev_next’

(bool) Sayfa numaralarının başında ve sonunda bulunan “Önceki” ve “Sonraki” yazılarını gösterir veya saklar. True değerini alırsa bu yazılar görünür, false değerini alırsa görünmez. Varsayılan değeri true olarak ayarlanmıştır.

‘prev_text’

Önceki sayfaya götüren linkin metnidir. Varsayılan değeri ‘« Önceki‘ olarak ayarlanmıştır.

‘next_text’

Sonraki sayfaya götüren linkin metnidir. Varsayılan değeri ‘Sonraki »‘ olarak ayarlanmıştır.

‘type’

Fonksiyonun döndürdüğü değeri, farklı biçimlerde döndürmesini sağlar. Üç farklı değer alır: ‘plain‘, ‘array‘ ve ‘list‘. varsayılan değeri ‘plain‘ olarak ayarlanmıştır.

Bu argümana ‘array‘ değerini verilirse:

<?php
echo paginate_links(array(
	'type'	 => 'array',
   ));
?>

çıktısı şu şekilde olur: Array.

type argümanına array değeri verdiğimizde, paginate_links() fonksiyonu, artık bir HTML değeri değil de bir dizi döndürür. Altıncı sayfaya tıklanmışken, oluşan dizi şu şekildedir:

array(11) { [0]=> string(106) "« Önceki" [1]=> string(80) "1" [2]=> string(47) "…" [3]=> string(87) "4" [4]=> string(87) "5" [5]=> string(63) "6" [6]=> string(87) "7" [7]=> string(87) "8" [8]=> string(47) "…" [9]=> string(89) "12" [10]=> string(106) "Sonraki »" }

Bu argümana ‘list‘ değeri verilirse, fonksiyonun ürettiği HTML bir listeye (<ul><li>...</li></ul>) dönecek ve altıncı sayfada iken çıktısı şu şekilde olacaktır:

WordPress ile Sayfalama – Paginate_links Fonksiyonunun Argümanları

6. sayfa tıklanmışken, fonksiyonun ürettiği HTLM ise şekilde olacaktır:

<ul class="page-numbers">
	<li><a class="prev page-numbers" href="https://sitecenneti.com/category/block/page/5/">« Önceki</a></li>
	<li><a class="page-numbers" href="https://sitecenneti.com/category/block/">1</a></li>
	<li><span class="page-numbers dots">…</span></li>
	<li><a class="page-numbers" href="https://sitecenneti.com/category/block/page/4/">4</a></li>
	<li><a class="page-numbers" href="https://sitecenneti.com/category/block/page/5/">5</a></li>
	<li><span aria-current="page" class="page-numbers current">6</span></li>
	<li><a class="page-numbers" href="https://sitecenneti.com/category/block/page/7/">7</a></li>
	<li><a class="page-numbers" href="https://sitecenneti.com/category/block/page/8/">8</a></li>
	<li><span class="page-numbers dots">…</span></li>
	<li><a class="page-numbers" href="https://sitecenneti.com/category/block/page/12/">12</a></li>
	<li><a class="next page-numbers" href="https://sitecenneti.com/category/block/page/7/">Sonraki »</a></li>
</ul>

Bu çıktı, biraz CSS ile çok şık bir hale getirilebilir.

‘add_args’

Bu parametre, sayfalamaya ait URL ifadesine, yeni parametreler eklemek içindir. Eklemek istenilen parametreler, bir dizi şeklinde girilir. Varsayılan değeri false olarak ayarlanmıştır.

Örneğin, bu argümana iki tane parametre eklemek istedik ve şu şekilde kullandık diyelim:

<?php
echo paginate_links(array(
	'add_args' => array( 'param_1' => 'deger_1', 'param_2' => 'deger_2' ),
   ));
?>

Sayfalanan içerikte, herhangi bir sayfaya tıkladığımızda, oluşan URL ifadesine dikkat edelim:

https://sitecenneti.com/category/block/page/5/?param_1=deger_1&param_2=deger_2

‘add_fragment’

Sayfalama URL’sindeki her bir linkin sonuna eklenecek bir metindir.

Mesela, her linkin sonuna bir ‘benim_fragmanım‘ ifadesi eklemek istersek, aşağıdaki kodu kullanırız.

<?php
echo paginate_links(array(
	'add_fragment' => 'benim_fragmanim',
   ));
?>

Bu kodun, beşinci sayfada iken ürettiği URL ifadesi, şöyle olactır:

https://sitecenneti.com/blog/page/5/benim_fragmanim

Bu argümanın varsayılan değeri boştur.

‘before_page_number’

Sayfa numaralarının önüne bir metin eklemek için kullanılırlar. Varsayılan değeri boşluktur.

‘after_page_number’

Sayfa numaralarının sonuna bir metin eklemek için kullanılırlar. Varsayılan değeri boşluktur.

Aşağıdaki örnekte, sizlere fikir vermesi açısından, sayfa numaralarının önüne “Ö” harfi sonunda da “S” harfi eklenmiştir:

<?php
echo paginate_links(array(
        'before_page_number' => 'Ö',
	'after_page_number' => 'S',
   ));
?>

Yukarıdaki kodun çıktsı şöyle olacaktır:

WordPress ile Sayfalama – Paginate_links Fonksiyonunun Argümanları

II- Posts_nav_link() Fonksiyonu

Bu fonksiyon, sadece önceki ve sonraki sayfalar için bir link oluşturur.

Fonksiyon, üç adet parametre alır. Parametreler string tipindedir ve hiç biri zorunlu değildir.

posts_nav_link( $ayraç= '', $önceki= '', $sonraki= '' )

Fonksiyonu yalın hali ile kullandığımızda:

<?php posts_nav_link(); ?>

Oluşturduğu çıktı şu şekildedir:

WordPress ile Sayfalama – Posts_nav_link Fonksiyonu

Tabi ki, ilk ve son sayfalarda, bu iki linkten sadece biri görünecektir ve link metinleri tercümeye göre değişiklik gösterebilir.

Posts_nav_link() Fonksiyonunun Paremetreleri

Fonksiyon üç adet parametre ile çalışır. Bu parametreler şu şekildedir:

$ayraç

Önceki ve sonraki sayfa linkleri arasına konulan ayraçtır.

$önceki

<< Önceki Sayfa” metnini bu parametre ile değiştirebilirsiniz. Dilerseniz, bu parametreye bir ikon ya da resim de atayabilirsiniz.

$sonraki

Sonraki Sayfa >>” metnini bu parametre ile değiştirebilirsiniz. Dilerseniz, bu parametreye bir ikon ya da resim de atayabilirsiniz.

Örnek kullanım – 1:

<div style="text-align:center;">
    <?php posts_nav_link( ' · ', 'Önceki', 'Sonraki' ); ?>
</div>

Örnek kullanım – 2

Bu örnekte, önceki ve sonraki linkler için, text değil de birer resim kullanılmıştır.

<div style="text-align:center;">
 <?php
  posts_nav_link( 
    ' ',
    '<img src="' . esc_attr( get_bloginfo( 'stylesheet_directory' ) . '/images/onceki.jpg . ')'" />',
    '<img src="' . esc_attr( get_bloginfo( 'stylesheet_directory' ) . '/images/sonraki.jpg . ')'" />' );
 ?>
</div>

III- The_posts_navigation() Fonksiyonu


Bu fonksiyon da, sadece önceki ve sonraki sayfalar için bir link oluşturur.

Fonksiyon, bir adet parametre alır. Parametre, dizi tipindedir, üç adet argümanı vardır ve zorunlu değildir.

the_posts_navigation( $argumanlar = array() )

Fonksiyonu yalın hali ile kullandığımızda:

<?php the_posts_navigation(); ?>

Oluşturduğu çıktı şu şekildedir:

WordPress ile Sayfalama – Posts_nav_link Fonksiyonu

Bu çıktıdaki metinler, tercümeye göre değişiklik gösterebilir ve tabi ki, ilk ve son sayfalarda, bu iki linkten sadece biri görünecektir. Bu çıktının HTML yapısı ise şöyledir:

<nav class="navigation posts-navigation" role="navigation">
   <h2 class="screen-reader-text">Yazı dolaşımı</h2>
   <div class="nav-links">
      <div class="nav-previous">
        <a href="https://sitecenneti.com/blog/page/5/">Daha eski yazılar</a>
      </div> 
      <div class="nav-next"><a href="https://sitecenneti.com/blog/page/3/">Daha yeni yazılar</a>
      </div> 
   </div>
</nav>

Görüldüğü gibi, bu fonksiyon, oluşturduğu HTML kodunu, bir nav elemanı ise sarmakta ve çıktıya bir ekran okuyucu başlık (screen_reader_text) eklemektedir.

Posts_nav_link() Fonksiyonunun Paremetreleri

Fonksiyon dizi şeklinde ve üç adet argümanı olan bir parametre ile çalışır. Bu parametre varsayılan şekliyle şöyledir:

<?php
the_posts_navigation( array(
        'prev_text'          => __( 'Older posts' ), // Daha eski yazılar metni
        'next_text'          => __( 'Newer posts' ), // Daha yeni yazılar metni
        'screen_reader_text' => __( 'Posts navigation' ), // ekran okuyucu metni
  )); 
?>

Yukarıdaki kod yapısını kullanarak, bu fonksiyonun argümanlarını dilediğiniz gibi düzenleyebilirsiniz.

IV- Next_posts_link() Fonksiyonu

Bu fonksiyon, sadece sonraki sayfaya ait bir link oluşturur.

Fonksiyon iki adet parametre alır:

next_posts_link( $link_metni, $son_sayfa )

Fonksiyonu varsayılan haliyle kullandığımızda;

<?php next_posts_link(); ?>

şu çıktıyı üretir:

WordPress ile Sayfalama – next_posts_link Fonksiyonu

Next_posts_link() Fonksiyonunun Parametreleri

$link_metni

Buraya girdiğiniz metin, sonraki sayfaya götüren linkin metni olarak kullanılır.

$son_sayfa

(int) Buraya girdiğiniz sayı, bu linkin götürdüğü son sayfanın numarasıdır. Bu sayfadan sonra bu link görünmez.

V- Previous_posts_link() Fonksiyonu

Bu fonksiyon, sadece sonraki sayfaya ait bir link oluşturur.

Fonksiyon bir adet parametre alır:

previous_posts_link( $link_metni )

Fonksiyonu varsayılan haliyle kullandığımızda;

<?php previous_posts_link(); ?>

şu çıktıyı üretir:

WordPress ile Sayfalama – previous_posts_link Fonksiyonu

Previous_posts_link() Fonksiyonunun Parametreleri

$link_metni

Buraya girdiğiniz metin, önceki sayfaya götüren linkin metni olarak kullanılır.

VI- The_posts_pagination() Fonksiyonu

Temaların arşiv sayfalarında, sayfalama özelliği kullanmak için tercih edilen fonksiyon budur.

Bu fonksiyon, paginate_links() fonksiyonunun özelleştirilmiş halidir ve aynı parametreler ile çalışır.

the_posts_pagination() fonksiyonun, paginate_links() fonksiyonunun parametrelerine eklenen bir parametresi daha vardır. Bu parametre, fonksiyonun HTML yapısına ekran okuyucular için bir metin ekler. Varsayılan değeri ile birlikte şöyledir:

'screen_reader_text' => 'Posts navigation',

screen_reader_text‘ argümanının varsayılan değeri olan, ‘Posts navigation‘ ifadesi, ‘Yazı dolaşımı‘ şeklinde tercüme edilir.

the_posts_pagination() fonksiyonunu, varsayılan değerleri ile birlikte kullanırsak, beşinci sayfada iken, şöyle bir sayfalama çıktısı verir:

WordPress ile Sayfalama – the_posts_pagination Fonksiyonu

Yine varsayılan değerleri ile, bu sayfalama çıktısının HTML yapısı şöyledir:

<nav class="navigation pagination" role="navigation">
	<h2 class="screen-reader-text">Yazı dolaşımı</h2>
	<div class="nav-links">
		<a class="prev page-numbers" href="https://sitecenneti.com/blog/page/4/">
			<span class="nav-prev-text">Önceki</span>
		</a>
		<a class="page-numbers" href="https://sitecenneti.com/blog/">1</a>
		<span class="page-numbers dots">…</span>
		<a class="page-numbers" href="https://sitecenneti.com/blog/page/3/">3</a>
		<a class="page-numbers" href="https://sitecenneti.com/blog/page/4/">4</a>
		<span aria-current="page" class="page-numbers current">5</span>
		<a class="page-numbers" href="https://sitecenneti.com/blog/page/6/">6</a>
		<a class="page-numbers" href="https://sitecenneti.com/blog/page/7/">7</a>
		<span class="page-numbers dots">…</span>
		<a class="page-numbers" href="https://sitecenneti.com/blog/page/12/">12</a>
		<a class="next page-numbers" href="https://sitecenneti.com/blog/page/6/">
			<span class="nav-next-text">Sonraki</span>
		</a>
	</div>
</nav>

Fonksiyonun verdiği çıktıya dikkat edecek olursak, HTML yapısı, oldukça düzenli ve CSS ile işlenmeye müsaittir.

2- Uzun Bir Yazıyı/Sayfayı Sayfalama

WordPress ile uzun bir yazıyı ya da bir sayfayı, kendi içinde sayfalara bölmek de mümkündür. Bunun için, öncelikle yönetim panelinde, yazıyı düzenlerken, sayfalara bölmek istediğiniz yerde, yazı içeriğine, aşağıdaki HTML kodunu eklemeniz yeterlidir:

<!--nextpage-->

Bu kodun eklendiği yerden itibaren, sayfanız ya da yazınız sayfalara bölünmüş olur.

Peki, yönetim panelinde yapmış olduğumuz bu sayfalama işlemini, temamıza taşımak için ne yapmalıyız?

Uzun Bir Yazıyı/Sayfayı Sayfalamak İçin Kullanılan Fonksiyonlar

  • wp_link_pages()

Wp_link_pages() Fonksiyonu

Yönetim panelinde, uzun bir yazı ya da sayfa için yaptığınız sayfalama işlemini temanıza taşımak için, önce, sayfalarınıza ait şablon dosyasını veya tek yazılarınıza ait şablon dosyasını açmalısınız. Bu dosyadaki döngünün, uygun yerine wp_link_pages() fonksiyonunu eklediğinizde, tek yazılarınızda yaptığınız sayfalama işlemi, temanızda görünecektir.

Aşağıda, WordPress döngüsünün, wp_link_pages() fonksiyonu için uygun olan yeri verilmiştir.

<?php if ( have_posts() ) : ?>
   
    <!-- WordPress döngüsü başlar -->
    <?php while ( have_posts() ) : the_post(); ?>
      
        <?php the_content(); ?>
        
        <!-- Uzun bir yazıyı/sayfayı sayfalamak için gereken fonksiyon burada kullanılır -->  
        <?php wp_link_pages(); ?> 
       
    <?php endwhile; ?>
  
<?php endif; ?>

wp_link_pages() fonksiyonu, uzun yazılarınızı/sayfalarınızı sayfalamak için kullanılır. Bu fonksiyon, tek yazılar için oluşturulan, single.php ve türevi olan şablon dosyalarında, sayfalar için ise page.php ve türevi olan şablon dosyalarında kullanılır.

wp_link_pages() fonksiyonu, zorunlu olmayan bir parametre almaktadır. Fonksiyon, varsayılan haliyle şöyle kullanılır:

<?php wp_link_pages(); ?>

Varsayılan haliyle kullanıldığında, wp_link_pages() fonksiyonu, şu çıktıyı verir:

WordPress ile Sayfalama – wp_link_pages Fonksiyonu

Varsayılan haliyle, wp_link_pages() fonksiyonunun ürettiği HTML şu şekildedir:

<p class="post-nav-links">
    Sayfalar: 
    <span class="post-page-numbers current" aria-current="page">1</span> 
    <a href="https://sitecenneti.com/2018/11/01/benim-yazim/2/" class="post-page-numbers">2</a>
</p>

Wp_link_pages() Fonksiyonunun Parametreleri

Wp_link_pages() fonksiyonu, argüman dizisi şeklinde bir parametre alır:

wp_link_pages( $argumanlar = array() );

Bu parametre, zorunlu değildir ve varsayılan değerleri şöyledir:

 $argumanlar = array(
        'before'           => '<p class="post-nav-links">' . __( 'Pages:' ),
        'after'            => '</p>',
        'link_before'      => '',
        'link_after'       => '',
        'aria_current'     => 'page',
        'next_or_number'   => 'number',
        'separator'        => ' ',
        'nextpagelink'     => __( 'Next page' ),
        'previouspagelink' => __( 'Previous page' ),
        'pagelink'         => '%',
        'echo'             => 1,
    );

Argümanları daha yakından inceleyelim:

‘before’

Sayfalama elemanlarını saran HTML elemanı, bu argüman ile açılır.

‘after’

Sayfalama elemanlarını saran HTML elemanı, bu argüman ile kapatılır.

Dilerseniz, sayfalama için kullanılacak HTML kodunuzu, bir div elemanının içine alabilirsiniz. Bunun için yapmanız gereken bu iki argümanı şu şekilde kullanmaktır:

wp_link_pages(
   array(
	'before' => '<div class="page-links">' . __( 'Sayfalar:', 'textdomain' ),
	'after'  => '</div>',
   )
);

‘link_before’

Sayfa numaralarının önüne eklenen bir metin ya da HTML kodudur. Son tıklanan sayfa numarasına da uygulanır.

‘link_after’

Sayfa numaralarının arkasına eklenen bir metin ya da HTML kodudur. Son tıklanan sayfa numarasına da uygulanır.

Fikir vermesi için, aşağıdaki basit bir uygulama ile, sayfa numaralarının önüne “Ö” harfi, sonunda da “S” harfi eklenmiştir:

<?php
   wp_link_pages(
      array(
        'link_before' => 'Ö ',
        'link_after' => ' S',
   ));
?>

Bu kod, şu çıktıyı üretecektir:

WordPress ile Sayfalama – wp_link_pages Fonksiyonu

‘aria_current’


Fonksiyonun, son tıklanan sayfa numarası için ürettiği span elamanı şudur:

<span class="post-page-numbers current" aria-current="page">1</span>

Bu argüman, bu span elemanına atanan aria-current adındaki HTML özelliğine verilen değeri yönetir. Varsayılan değeri ‘page‘ olarak ayarlanmıştır. Bir kısıtlama olmamakla birlikte, bu argüman için ‘step‘, ‘location‘, ‘date‘, ‘time‘, ‘true‘, ‘false‘ gibi değerler tercih edilmektedir.

next_or_number

Bu argüman, ‘number‘ ve ‘text‘ olarak iki değer almaktadır. Argümana ‘number‘ değeri verirseniz, sayfalama numaralar ile yapılır, ‘text‘ değeri verirseniz ise, “Önceki sayfa” ve “Sonraki sayfa” şeklinde metinlerden oluşan linkler ile yapılır. Bu metinler; birazdan göreceğimiz ‘nextpagelink‘ ve ‘previouspagelink‘ argümanlarından gelmektedir.

‘separator’

Sayfa numaraları arasına konacak text veya işarettir. Bu argümanın değeri, sayfa numaralarını oluşturan a ve sapan elemanları arasına yerleştirilir. Varsayılan değeri boşluktur : ‘ ‘

‘nextpagelink’

Gerektiğinde kullanılmak üzere, sonraki sayfa için bir link metni oluşturur. Varsayılan değeri ‘Next Page‘ olarak ayarlanmıştır.

‘previouspagelink’

Gerektiğinde kullanılmak üzere, önceki sayfa için bir link metni oluşturur. Varsayılan değeri ‘Previous Page‘ olarak ayarlanmıştır.

‘pagelink’

Varsayılan değeri ‘%’ olarak ayarlanmıştır. ‘%’ değeri, sayfa numaraları için yer tutucudur. Mesela, bu argümanın değerini ‘Sayfa %‘ olarak ayarlarsak, sayfa numaraları ‘Sayfa 1‘, ‘Sayfa 2‘… şeklinde oluşacaktır.

‘echo’

true/false veya 1/0 değerini alır. Fonksiyonun sayfalama için ürettiği HTML yapısının ekrana basılacağını ya da döndürüleceğini belirler. Varsayılan değeri true olarak ayarlanmıştır, yani ekrana bastırır.

Örnek kullanım-1

wp_link_pages() fonksiyonunu için yukarıda bahsettiğimiz argümanları, dizi olarak değil bir string olarak da kullanabiliriz. Bunun örneği aşağıda verilmiştir:

<?php
wp_link_pages( 'before=<ul class="page-links">&after=</ul>&link_before=<li class="page-link">&link_after=</li>' );
?>

Bu örnekteki argümanları, dizi olarak kullanmak isteseydik şöyle yapardık:

<?php
wp_link_pages(
   array(
      'before' => '<ul class="page-links">',
      'after'  => '</ul>',
      'link_before' => '<li class="page-link">',
      'link_after' => '</li>'
  ));
?>

3- Önceki ve Sonraki Yazılara Bağlantılar Verme

Tam olarak sayfalama sayılmasa da, WordPress, tek bir yazının görüntülendiği sayfada iken, bir sonraki ya da bir önceki yazılara da bağlantı vermenize olanak tanır.

Önceki ve Sonraki Yazılara Bağlantı Vermek İçin Kullanılan Fonksiyonlar

Tek yazı sayfasında iken, bu yazıdan bir önce ve bir sonraki sırada yer alan diğer yazıları görüntülemek için kullanabileceğimiz fonksiyonları, tek yazılar için hazırladığımız şablon dosyalarında ve WordPress döngüsü içinde kullanılmalıdır. Aşağıda, bu fonksiyonlar için, WordPress döngüsü içerisinde, uygun olan yer gösterilmiştir:

<?php if ( have_posts() ) : ?>
   
    <!-- WordPress döngüsü başlar -->
    <?php while ( have_posts() ) : the_post(); ?>
      
        <?php the_content(); ?>
        
        <!-- Tek yazı sayfasında iken, bu yazıdan bir önce ve bir sonraki sırada yer alan diğer yazıları görüntülemek için kullanabileceğimiz fonksiyonlar burada kullanılır -->
       
    <?php endwhile; ?>
  
<?php endif; ?>

Tek yazı sayfasında iken, bu yazıdan bir önce ve bir sonraki sırada yer alan diğer yazıları görüntülemek için kullanabileceğimiz üç adet fonksiyon vardır. Bu fonksiyonlar şunlardır:

  • previous_post_link()
  • next_post_link()
  • the_post_navigation()

Bu fonksiyonları kullanmak için, önce, tek yazılarınıza ait şablon dosyasını açmalısınız ve bu dosyadaki döngünün, uygun yerine fonksiyonu kodlamalısınız.

Aşağıda, WordPress döngüsünün, önceki ve sonraki yazılara bağlantı veren fonksiyonları kodlamak için uygun olan yeri verilmiştir.

<?php if ( have_posts() ) : ?>
   
    <!-- WordPress döngüsü başlar -->
    <?php while ( have_posts() ) : the_post(); ?>
      
        <?php the_content(); ?>
        
        <!-- Önceki ve sonraki yazılara bağlantı veren fonksiyonlar için uygun yer burasıdır -->  
        <?php previous_post_link(); ?>
        <?php next_post_link(); ?>
        <!-- veya -->
        <?php the_post_navigation(); ?>
       
    <?php endwhile; ?>
  
<?php endif; ?>

Gelin bu fonksiyonları yakından tanıyalım.

I- Previous_post_link() Fonksiyonu

Bu fonksiyon, tek yazı sayfasında iken, bir önceki yazıya götüren bir link oluşturur.

Varsayılan haliyle kullanıldığında:

<?php previous_post_link(); ?>

temamızda, aşağıdaki gibi bir çıktı oluşturacaktır.

WordPress ile Sayfalama – previous_post_link Fonksiyonu

Fonksiyon, her biri isteğe bağlı, beş adet parametre almaktadır. Parametreleri ile birlikte fonksiyon şöyledir:

previous_post_link( $link_bicimi, $link_metni, $ayni_kategori_mi_olsun, $su_siniflari_haric_tut, $siniflandirma_yontemi )

Bu parametreleri daha yakından inceleyelim:

$link_bicimi

Bu parametrenin varsayılan değerinde bulunan, ‘%link‘ ifadesi, aslında bir yer tutucudur ve birazdan göreceğimiz, “$link_metni” parametresinin değeri ile yer değiştirir. Parametrenin varsayılan değeri, ‘« %link ‘ şeklindedir. Bu değer aşağıdaki çıktıyı üretir:

WordPress ile Sayfalama – previous_post_link Fonksiyonu

$link_metni

Bu parametrenin varsayılan değeri olan, ‘%title‘ ifadesi, aslında bir yer tutucudur ve bir önceki yazının başlığını temsil eder. Parametrenin varsayılan değeri, ‘%title‘ şeklindedir. Bu varsayılan değer, gidilecek yazının başlığıdır. Dilerseniz, bu argümana, ‘Önceki yazıya götür‘ şeklinde, sabit bir link metni de girebilirsiniz.

$ayni_kategori_mi_olsun

Bu argüman true/false değerlerini alır. true değerini verdiğimizde, fonksiyonun ürettiği link bizi, aynı kategoride olan bir önceki yazıya götürür. false değerini verdiğimizde ise, kategori ayrımı yapmaz. Bu durum, sadece kategoriler için değil, diğer sınıflar için de uygulanır.

$su_siniflari_haric_tut

Hariç tutmak istediğiniz kategori ya da sınıfın id numarasını bu argümanda belirtebilirsiniz. Eğer birden çok, kategori ya da sınıfı hariç tutmak istiyorsanız, bunların id numaralarını bir dizi olarak belirtebilirsiniz.

Aşağıdaki bu durumlar için örnekler verilmiştir:

previous_post_link( '', '', '', '5' ); // ID değeri 5 olan kategoride görünmez
previous_post_link( '', '', '', '5,1' ); // ID değeri 5 ve 1 olan kategoride görünmez
previous_post_link( '', '', '', array(5, 1) ); // ID değeri 5 ve 1 olan kategoride görünmez

$siniflandirma_yontemi

Bu argümanın değeri, bir sınıflandırma yönteminin link adıdır. Varsayılan değeri ‘category‘ olarak ayarlanmıştır. $ayni_kategori_mi_olsun argümanına true değeri verdiyseniz, önceki yazıya giderken, aynı kategori içinde kalınır.

Örnek kullanım-1

<?php
   previous_post_link( '<< %link', 'Aynı kategoride önceki yazı', true, '13' );
?>

Yukarıdaki kod, önceki yazılar için, ‘<< Aynı kategoride önceki yazı‘ adında bir link oluşturur. Fakat, bu link id değeri 13 olan kategorideki yazılarda, ortadan kaybolur. Bu kodun oluşturduğu çıktı şöyle olacaktır:

WordPress ile Sayfalama – previous_post_link Fonksiyonu

Aynı kodu, tercümeye hazır şekilde istiyorsanız, aşağıdaki şekilde kullanabilirsiniz.

<?php
   previous_post_link( '<< %link', __( 'Aynı kategoride önceki yazı', 'textdomain' ), true, '13' );
?>

II- Next_post_link() Fonksiyonu

next_post_link() fonksiyonu da previous_post_link() fonksiyonu gibidir çalışır. Tek farkı, bir sonraki yazıya götürmesidir.

next_post_link() fonksiyonu da previous_post_link() fonksiyonu ile aynı parametreleri alır ve bu parametreler, her iki fonksiyonda da aynı işlevi görür.

next_post_link( $link_bicimi, $link_metni, $ayni_kategori_mi_olsun, $su_siniflari_haric_tut, $siniflandirma_yontemi )

next_post_link() fonksiyonunun parametreleri previous_post_link() fonksiyonu anlatılırken, detaylı olarak verildiği için burada tekrar açıklanmayacaktır.

III- The_post_navigation() Fonksiyonu

Bu fonksiyon, tek yazı sayfasında iken, bir önceki ve bir sonraki yazıya götüren iki adet link oluşturur.

Varsayılan haliyle kullanıldığında:

<?php the_post_navigation(); ?>

temanızın tek yazı sayfasında, aşağıdakine benzer bir çıktı oluşturacaktır:

WordPress ile Sayfalama – the_post_navigation Fonksiyonu

Resimde gördüğünüz linkler, ekrandaki yazıdan bir önceki (soldaki link) ve bir sonraki (sağdaki link) yazılara götüren linklerdir. Linklerin metinleri, götürdükleri yazıların başlıklarıdır.

the_post_navigation() fonksiyonu, bu çıktıyı oluşturabilmek için, şu HTML yapısını oluşturur:

<nav class="navigation post-navigation" role="navigation">
	<h2 class="screen-reader-text">Yazı dolaşımı</h2>
	<div class="nav-links">
		<div class="nav-previous">
			<a href="https://sitecenneti.com/2019/04/09/wordpress-temalari/" rel="prev">WordPress Temaları</a>
		</div>
		<div class="nav-next">
			<a href="https://sitecenneti.com/2019/05/22/wordpress-nedir/" rel="next">WordPress Nedir?</a>
		</div>
	</div>
</nav>

the_post_navigation() fonksiyonu, dizi şeklinde ve tek bir parametre alır. Bu parametre ise 6 adet argümana sahiptir. Bu argümanlar, varsayılan değerleri ile birlikte şöyledir:

$argumanlar = array(
            'prev_text'          => '%title',
            'next_text'          => '%title',
            'in_same_term'       => false,
            'excluded_terms'     => '',
            'taxonomy'           => 'category',
            'screen_reader_text' => __( 'Post navigation', 'textdomain' ),
        )

Argümanları daha yakından tanıyalım:

‘prev_text’

Bir önceki yazıya götüren linkin metnini oluşturur.

Bu parametrenin varsayılan değeri olan, ‘%title‘ ifadesi, aslında bir yer tutucudur ve bir önceki yazının başlığını temsil eder. Parametrenin varsayılan değeri, ‘%title‘ şeklindedir. Bu varsayılan değer, gidilecek yazının başlığıdır. Dilerseniz, bu argümana, ‘Önceki yazıya götür‘ şeklinde, sabit bir link metni de girebilirsiniz. Dilerseniz de, aşağıdaki gibi bir HTML yapısı oluşturabilirsiniz:

'prev_text' => '<span class="meta-nav" aria-hidden="true">' . __( 'Önceki yazı', 'textdomain' ) . '</span> ' . '<span class="screen-reader-text">' . __( 'Önceki yazı:', 'textdomain' ) . '</span> <br/>' .'<span class="post-title">%title</span>',

‘next_text’

Bir sonraki yazıya götüren linkin metnini oluşturur.

Bu parametrenin varsayılan değeri olan, ‘%title‘ ifadesi, aslında bir yer tutucudur ve bir önceki yazının başlığını temsil eder. Parametrenin varsayılan değeri, ‘%title‘ şeklindedir. Bu varsayılan değer, gidilecek yazının başlığıdır. Dilerseniz, bu argümana, ‘Önceki yazıya götür‘ şeklinde, sabit bir link metni de girebilirsiniz. Dilerseniz de, aşağıdaki gibi bir HTML yapısı oluşturabilirsiniz:

'next_text' => '<span class="meta-nav" aria-hidden="true">' . __( 'Sonraki yazı', 'textdomain' ) . '</span> ' . '<span class="screen-reader-text">' . __( 'Sonraki yazı:', 'textdomain' ) . '</span> <br/>' .'<span class="post-title">%title</span>',

‘in_same_term’

Bu argüman true/false değerlerini alır. true değerini verdiğimizde, fonksiyonun ürettiği link bizi, aynı kategoride olan yazılara götürür. false değerini verdiğimizde ise, kategori ayrımı yapmaz. Bu durum, sadece kategoriler için değil, diğer sınıflar için de uygulanır.

‘excluded_terms’

Hariç tutmak istediğiniz kategori ya da sınıfın id numarasını bu argümanda belirtebilirsiniz. Eğer birden çok, kategori ya da sınıfı hariç tutmak istiyorsanız, bunların id numaralarını bir dizi olarak belirtebilirsiniz.

Aşağıdaki bu durumlar için örnekler verilmiştir:

the_post_navigation( '', '', '', '5' ); // ID değeri 5 olan kategoride görünmez
the_post_navigation( '', '', '', '5,1' ); // ID değeri 5 ve 1 olan kategoride görünmez
the_post_navigation( '', '', '', array(5, 1) ); // ID değeri 5 ve 1 olan kategoride görünmez

‘taxonomy’

Bu argümanın değeri, bir sınıflandırma yönteminin link adıdır. Varsayılan değeri ‘category‘ olarak ayarlanmıştır. 'in_same_term' argümanına true değeri verdiyseniz, önceki yazıya giderken, aynı kategori içinde kalınır.

‘screen_reader_tex’

Ekran okuyucular için, fonksiyonun ürettiği HTML elemanına bir metin oluşturur. Varsayılan değeri, ” olarak ayarlanmıştır. Aşağıda, bu argümandan metnini alan HTML elemanı verilmiştir:

<h2 class="screen-reader-text">Yazı dolaşımı</h2>

DERSİN SONU

Kimya Özel Dersi Al

Yorum yaparak bize destek olabilirsiniz.

3 yorum “4.11 Sayfalama (Pagination)”

    • Muzaffer KAYA says:

      Merhaba Serhat Bey. Kodunuzu paylaşırsanız daha etkili bir yardımda bulunabilirim. Şu anda tahmin yürüterek söylüyorum: Eğer temanızda sayfalama kodunuz var fakat sayfalama görünmüyorsa, içerik sayınız sayfalara bölünecek kadar çok olmayabilir. Mesela, blog ya da arşiv yazıları için, sayfalama, standart olarak 10 içerikten sonra başlar. Eğer içerik sayınız (yazılarınız) daha azsa, kodu ekleseniz dahi sayfalama olmaz. Tabi bu benim tahmin ettiğim sebep.

Bir cevap yazın

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

Şu kadar HTML serbest:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>