WordPress: Pagination erstellen (ohne Plugin)

In meinem ehemaligen WordPress-Blog hatte ich damals eine eigene Pagination erstellt. In diesem Beitrag erkäre ich euch wie ihr selbst in eurem Blog bzw. in eurem WordPress-Theme eine Pagination ohne Installation eines zusätzlichen Plugins einbinden könnt.

Da WordPress von Haus aus nur zwei Links zum Seitenumblättern anbietet, ist es ratsam eine Pagination-Funktion in eurem Theme zu integrieren, da es gewisse Vorteile mit sich bringt. Beispielsweise kann durch Einsatz einer Pagination eine bessere Benutzerfreundlichkeit für eure Leser und eine verbesserte interne Verlinkung erreicht werden.

Was ist eine Pagination?

Bei einer Pagination handelt sich einfach gesagt, um die Möglichkeit zwischen verschiedenen Seiten hin- und herzublättern. Wie ihr z.B. auf der Startseite dieses Blog sehen könnt, befindet sich unter der Auflistung der 5 neuesten Blog-Beiträge eine Liste mit nummerierten Seitenzahlen, die es euch als Leser ermöglichen, direkt auf eine andere Seite zu "springen".

Code zum Erstellen der Pagination

Den folgenden Code für die Pagination könnt ihr in eure functions.php einfügen:

function pagination($range = 3, $show_one_pager = true, $show_page_hint = false)
{
    global $wp_query;
    $num_of_pages = (int)$wp_query->max_num_pages;

    if(!is_single() && $num_of_pages > 1)
    {
        $current_page = get_query_var('paged') === 0 ? 1 : get_query_var('paged');
        $num_of_display_pages = ($range * 2) + 1;

        $output = '<div id="pagination">';

        if($show_page_hint)
        {
            $output .= '<span>Seite ' . $current_page . ' von ' . $num_of_pages . '</span>';
        }

        if($current_page > 2 && $current_page > $range + 1 && $num_of_display_pages < $num_of_pages)
        {
            $output .= '<a href="' . get_pagenum_link(1) . '" title="Seite 1 - Neueste Artikel">«</a>';
        }

        if($show_one_pager && $current_page > 1)
        {
            $output .= '<a href="' . get_pagenum_link($current_page - 1) . '" title="Seite ' . ($current_page - 1) . ' - Neuere Artikel">‹</a>';
        }

        for($i = 1; $i <= $num_of_pages; $i++)
        {
            if($i < $current_page + $range + 1 && $i > $current_page - $range - 1)
            {
                if($current_page === $i)
                {
                    $output .= '<span class="current">' . $i . '</span>';
                }
                else
                {
                    $output .= '<a href="' . get_pagenum_link($i) . '" title="Seite ' . $i . '" >' . $i . '</a>';
                }
            }
        }

        if($show_one_pager && $current_page < $num_of_pages)
        {
            $output .= '<a href="' . get_pagenum_link($current_page + 1) . '" title="Seite ' . ($current_page + 1) . ' - Ältere Artikel">›</a>';
        }

        if($current_page < $num_of_pages - 1 && $current_page + $range < $num_of_pages && $num_of_display_pages < $num_of_pages)
        {
            $output .= '<a href="' . get_pagenum_link($num_of_pages) . '" title="Seite ' . $num_of_pages . ' - Älteste Artikel">»</a>';
        }

        $output .= '</div>';

        return $output;
    }
}

Den dazugehörigen CSS-Code zum Anpassen des Designs der Pagination lasse ich hier weg, da je nach Theme ihr die Pagination sowieso individuell designen könnt.

Erklärung des Codes im Detail

Im Folgenden eine kurze Erklärung zu den jeweiligen Codezeilen:

Zeile 4:
Wir weisen $num_of_pages die Anzahl der Seiten zu.
Zeile 6:
Die Pagination nur anzeigen, wenn die aktuelle Seite keine "Single-Page" ist und mehr als eine Seite vorhanden ist.
Zeile 8:
Der Variable $current_page wird die aktuelle Seite zugewiesen. Dabei ist zu beachten, dass wenn die aktuelle Seite die Seite 1 ist, die Funktion get_query_var('paged') 0 zurückliefert.
Zeile 9:
$num_of_display_pages wird die Anzahl der anzuzeigenden Seitenlinks zugewiesen. Dabei gibt $range an, wie viele Seitenlinks links bzw. rechts nebst dem Seitenlink der aktuellen Seite (maximal) angezeigt werden.
Zeile 13 - 16:
Wenn die Variable $show_page_hint wahr ist (true), dann geben wir den Hinweis aus, dass der Leser sich gerade auf "Seite X von Y" befindet. X ist dabei die aktuelle Seite und Y die Anzahl aller Seiten.
Zeile 18 - 21:
Es wird ein Seitenlink auf der erste Seite (auf der die neuesten Artikel eures Blogs gelistet sind) angezeigt, wenn folgende Bedingungen erfüllt sind:
- die aktuelle Seite entspricht weder Seite 1 noch Seite 2
- die aktuelle Seite ist größer als $range + 1
- die Anzahl der anzuzeigenden Seitenlinks ist kleiner als die Gesamt-Seitenanzahl
Zeile 23 - 26:
Es wird ein Seitenlink auf die vorherige Seite der aktuellen Seite angezeigt, wenn folgende Bedingungen erfüllt sind:
- $show_one_pager ist true
- die aktuelle Seite ist nicht die erste Seite (Seite 1)
Zeile 28 - 41:
In einer for-Schleife durchlaufen wir alle Seiten. In Zeile 30 überprüfen wir dann, ob für die jeweilige Seite ($i) ein Seitenlink angezeigt wird. Dabei gilt die Bedingung, dass die Seite sich innerhalb der anzuzeigenden "Seitenrange" ($range) befinden muss. Wenn das der Fall ist, dann geenrieren wir den dazugehörigen Seitenlink, außer wenn es sich um die aktuelle Seite handelt, da wir dann einfach nur ein <span>-Element ausgeben.
Zeile 43 - 51:
Verhält sich analog zu dem Code aus Zeile 18 - 26:
Zeile 55:
Die generierte Ausgabe ($output) wird zurückgegeben.

Anzeigen der Pagination

Um die Pagination nun in eurem WordPress-Blog anzuzeigen, müsst ihr am Ende eurer sogenannten "WordPress-Loop", die sich bei vielen Themes in der loop.php befindet (je nach Theme kann das aber abweichen), Folgendes einfügen:

echo pagination();

Über die Parameter $range, $show_one_pager und $show_page_hint könnt ihr die Anzeige der Pagination anpassen.

Beispiele:

Pagination mit $range = 2:

echo pagination(2);

Pagination mit $range = 2 und $show_one_pager = false:

echo pagination(2, false);

Pagination mit $range = 2, $show_one_pager = true und $show_page_hint = true:

    echo pagination(2, true, true);

Fazit

Wir ihr sehen könnt, lässt sich in WordPress eine Pagination-Funktionalität sehr einfach erstellen und ins Theme integrieren, ohne extra ein zusätzliches Plugin verwenden zu müssen.