Paginacja numeryczna w WordPressie

Strony internetowe oparte o system CMS WordPressa mają przeważnie zaimplementowaną mało efektowną paginację składającą się z linków poprzedniej i następnej strony (np. ze strony 1 przejdziemy tylko do 2 a z 2 do 1 lub 3).

Dlaczego zwykła paginacja jest problematyczna

Rozwiązanie to jest bardzo proste ma jednak bardzo dużo wad:

• użytkownik witryny nie wie ile jest podstron,
• przejście do starszych artykułów (umieszczonych na dalszych kartach) jest utrudnione,
• nie można wejść od tak na dowolną podstronę.

Rozwiązaniem tego problemu jest zastąpienie tego typu paginacji (stronicowania) numerowaniem stron co ułatwi poruszanie się po stronie. Rozwiązanie tego typu można samodzielnie zaimplementować w szablonie WordPress, przy niewielkim wysiłku.

Wykonanie numerycznej paginacji

Na oficjalnej stronie WordPress można znaleźć rozwiązanie problemu w języku angielskim.

Nie jest to jedyna metoda jakiej można w tym wypadku użyć. Standardową funkcję paginate_links() można przedstawić nieco inaczej. Z pomocą samej funkcji paginate_links() możemy jedynie uzyskać listę stron. Dlatego by spełniał nasze wymagania trzeba go zmodyfikować.

Przykład:

function pagination() {
    
    global $wp_query;
    
    if ($wp_query->max_num_pages > 1) { echo '<p class="pages" role="navigation">' . paginate_links( array(
        'base' => @add_query_arg('paged','%#%'),
        'format' => '?paged=%#%',
        'current' => max( 1, get_query_var('paged') ),
        'total' => $wp_query->max_num_pages,
        'prev_text' => __('« '),
        'next_text'    => __(' »'),
    ) ) . '</p>'; }
}

Powyższy kod należy dodać do pliku function.php szablonu, w którym chcemy wprowadzić modyfikację.

Teraz musimy jedynie wywołać kod naszej funkcji po jej nazwie:

<?php pagination(); /*wyświetlamy paginację*/ ?>

Umieszczamy go oczywiście w miejscu gdzie ma znajdować się paginacja naszej witryny.

Paginacja obecnie będzie wyglądała np. tak:

« 1 2 3 4 »

Zmiana wyglądu

Jeżeli nie chcemy mieć tak prostej numeracji stron możemy zmodyfikować ją z pomocą CSS np.:

W celu uzyskania takiego efektu umieściłam paginację strony w elemencie blokwym DIV z odpowiednią klasą.

<div class="numerstrony"><?php pagination(); /*wyświetlamy paginację*/ ?></div>

Następnie przygotowałam skrypt CSS:

.numerstrony {
    text-align: center;
}

.numerstrony .page-numbers {
    border: 1px solid #ccc;
    padding: 5px;
}
.numerstrony a.page-numbers{
    outline: none;
    color: #FF9700;
}

.numerstrony .page-numbers.dots, 
.numerstrony .page-numbers.next, 
.numerstrony .page-numbers.prev {
    border: none;
}

Jak widać zamiana ta jest bardzo prosta i nie wymaga dużej specjalistycznej wiedzy.

Źródło:http://strefakodera.pl/poradniki/wordpress/paginacja-numeryczna-w-wordpressie