Постраничная навигация WordPress без плагина

Постраничная навигация нужна для разбивки страниц и удобства перемещения по ним.
Можно воспользоваться плагином «WP-PageNavi», но зачем,  если есть более быстрый способ.

Итак, самый быстрый и простой способ создать постраничную навигацию для WordPress без плагина – это установить в файл «index.php» вашей темы вот такую функцию:

<?php echo paginate_links( $args ); ?>

В результате у вас сразу появится постраничная навигация по сайту, вот что-то подобное, как на одном из моих сайтов:

Встречал в интернете и другой способ.
Добавьте в файл «functions.php» вашей темы перед тегом «?>» или после «<?» вот такой код:

function wp_corenavi() {
global $wp_query, $wp_rewrite;
$pages = '';
$max = $wp_query->max_num_pages;
if (!$current = get_query_var('paged')) $current = 1;
$a['base'] = str_replace(999999999, '%#%', get_pagenum_link(999999999));
$a['total'] = $max;
$a['current'] = $current;

$total = 0; //1 - выводить текст "Страница N из N", 0 - не выводить
$a['mid_size'] = 3; //сколько ссылок показывать слева и справа от текущей
$a['end_size'] = 1; //сколько ссылок показывать в начале и в конце
$a['prev_text'] = '«'; //текст ссылки "Предыдущая страница"
$a['next_text'] = '»'; //текст ссылки "Следующая страница"

if ($max > 1) echo '<div class="navigation">';
if ($total == 1 && $max > 1) $pages = '<span class="pages">Страница ' . $current . ' из ' . $max . '</span>'."\r\n";
echo $pages . paginate_links($a);
if ($max > 1) echo '</div>';
}

Чтобы вывести функцию пагинации (постраничная навигация), добавьте вот этот код на страницу «index.php»:

<?php if (function_exists('wp_corenavi')) wp_corenavi(); ?>

Вот что-то подобное будет у вас:

Исходный код:

<div class="navigation">
<a class="prev page-numbers" href="https://bloggood.ru/glavnaya/page/1/">«</a>
<a class="page-numbers" href="https://bloggood.ru/glavnaya/page/1/">1</a>
<span class="page-numbers current">2</span>
<a class="page-numbers" href="https://bloggood.ru/glavnaya/page/3/">3</a>
<a class="page-numbers" href="https://bloggood.ru/glavnaya/page/4/">4</a>
<a class="page-numbers" href="https://bloggood.ru/glavnaya/page/5/">5</a>
<span class="page-numbers dots">…</span>
<a class="page-numbers" href="https://bloggood.ru/glavnaya/page/10/">10</a>
<a class="next page-numbers" href="https://bloggood.ru/glavnaya/page/3/">»</a>
</div>

Обратите внимание, что все необходимые стили для оформления есть. Открываем CSS файл и творим вид постраничной навигации по своему вкусу.
Всем пока!

Понравился пост? Помоги другим узнать об этой статье, кликни на кнопку социальных сетей ↓↓↓

6 Ответов на комментарий - Постраничная навигация WordPress без плагина

1. Сергей

   29.09.2016 в 11:18

   Получились только мелкие цифры 1 2 3 … 7 Далее → и
   1 2 3 4 … 7 » может еще что-то нужно добавить в стили. Подскажите пожалуйста, буду очень благодарен вам за помощь.
2. Степан => автор блога

   29.09.2016 в 11:52

   .navigation {
       font-size: 36px;
   }
   

   Меняете только значение “36”
3. Сергей

   29.09.2016 в 16:18

   Изменилось только размер цифр 1 2 3 4 … 7 » второго варианта, а ваш вариант так и остались маленькие цифры. Прямоугольной или квадратной аконтовки цифр так и нет нигде
4. Степан => автор блога

   06.10.2016 в 07:49

   a.page-numbers {
       border: 1px solid;
       padding: 10px;
       margin: 3px;
       font-size: 15px;
       background-color: #ccc;
   }
   
5. Сергей

   07.10.2016 в 19:35

   Огромное спасибо, сейчас все получилось!
6. Степан => автор блога

   11.10.2016 в 11:30

   Пожалуйста, Сергей!

Добавить комментарий

Нажмите, чтобы отменить ответ.

Имя (required)

Mail (will not be published) (required)

Сайт

Чтобы добавить в комментарий код HTML, PHP, CSS, JavaScript, нужно сделать так: [code] ваш код [/code]

Метки: wordpress, без плагинов