Как сделать постраничную навигацию без плагинов

Автор tiaurus Опубликовано 26.10.2010 Обновлено 18.01.2023

👍 Научим бесплатно правильно создавать сайты на WordPress. Подробнее →

Если вы посмотрите в этом блоге на главной странице вниз, то увидите там постраничную навигацию – любимый навигационный элемент многих блоггеров.

Постраничная навигация удобна тем, что дает примерное представление об общем объеме блога, и позволяет быстро перемещаться по страницам, снабжая такое перемещение удобной индикацией. Есть множество плагинов, которые создают постраничную навигацию: Pagebar, jQuery Paginator, WP Page Number, WP-PageNavi и другие. Если вы решили все же уменьшить количество плагинов, то для организации постраничной навигации можно и вовсе обойтись без них. Давайте создадим постраничную навигацию своими руками.

Как и в случае создания “хлебных крошек” без плагинов, будем работать с отдельным файлом. Создайте пустой текстовый файл, и назовите его pagenavi.php. Вставьте в него такой код:

max_num_pages;
$nump=2; /*Количество отображаемых подряд номеров страниц*/
if($max_page>1){
$paged = intval(get_query_var('paged'));
if(empty($paged) || $paged == 0) $paged = 1;

echo '

‘; /* echo ‘Страница ‘.$paged.’ из ‘.$max_page.’ ‘;*/ if($paged!=1) echo ‘1 ‘; else echo ‘1‘; if($paged-$nump>1) $start=$paged-$nump; else $start=2; if($paged+$nump2) echo “…“; for ($i=$start;$i<=$end;$i++) { if($paged!=$i) echo ”.$i.’ ‘; else echo ‘‘.$i.’‘; } if($end<$max_page-1) echo “…“; if($paged!=$max_page) echo ‘ Последняя »’; else echo ‘ Последняя ‘; echo ‘

‘ ; } ?>

Теперь внедрим этот файл в тему. Перепишите этот файл в папку с вашей темой. Постраничная навигация нужна там, где выводится множество постов – на главной странице, а результатах поиска и в архивах. Значит нам нужно вставить ее в index.php, search.php и archive.php. Откройте файл index.php и найдите вывод навигации по страницам. Обычно он выглядит примерно так:

Можете оставить ее, но лучше ее удалить, так как такая навигация больше не понадобится, и вместо нее вставить код, приведенный выше.

В остальные страницы код вставляется по аналогии. Постраничная навигация имеет свое оформление, которое нужно добавить в файл style.css:

.navigation {clear:both; width:500px; height:auto;text-align:center;margin:30px 0 30px 50px;padding-top:15px;}
.navigation .right, .navigation .left {width:230px; font-size:18px;text-align:right;margin:0;}
.navigation .left {text-align:left;}
.navigation a, .navigation a:visited {text-decoration:none;color:#939186;}
.navigation a:hover {color:#5D5643;text-decoration:none;}
.pagenavi {clear:both;display:block;font-size:14px;margin:0;padding:7px 0 7px 0;}
.pagenavi a {clear: both;width:auto;font-size:14px;padding:3px 7px 3px 7px;background-color:#F3EFE6;}
.pagenavi b {clear:both;width:auto;margin:0 6px 0 5px;text-decoration:none;}

Все, постраничная навигация без плагинов готова – можете пользоваться!

tiaurus

Автор n-wp.ru — блога о WordPress для новичков.

Оцените автора

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

Toshiya 26.10.2010 в 13:49

О! Спасибо, очень полезно.

Ответить
romtya 04.11.2010 в 18:39

у меня тема oneroom, все делал по инструкции. В итоге кнопки навигации возникают в левом сайдбаре. Может что-то посоветуете?
http://amatik.ru/

Ответить
1. 05.11.2010 в 00:29
  
  А куда вы вставляете код?
  
  Ответить
romtya 05.11.2010 в 01:51

Все по инструкции: в index.php, search.php и archive.php + правлю style.css + файл pagenavi.php

Ответить
1. 05.11.2010 в 10:33
  
  А previous_posts_link и next_posts_link заключены в какой-то контейнер?
  
  Ответить
romtya 05.11.2010 в 11:07

Потом удалите… а что-то много получилось :)

Ответить
Naiko Michail 11.12.2010 в 18:23

a как сделать, чтобы была не "последняя страница" а её номер?

Ответить
1. 12.12.2010 в 15:43
  Заменить
```
	if($paged!=$max_page) echo ' Последняя »';
		else echo '<b> Последняя</b> ';
```
  на
```
	if($paged!=$max_page) echo ''.$max_page.' ';
		else echo '<b>'.$max_page.'</b> ';
```
  Ответить
FHD 25.01.2011 в 00:23

Если можно, покажите скрипт и стили этого сайта.

Ответить
1. 25.01.2011 в 09:26
  
  Примерно так, как написано в статье, и сделано.
  
  Ответить
  1. FHD 25.01.2011 в 13:27
    
    Намек понял. Тогда кусочек кода для стрелок право и влево. Они даже в статье в стилях описаны, а в коде их нет.
    
    Ответить
    1. FHD 25.01.2011 в 16:07
      
      Уже не надо отвечать, сам уже разобрался и модифицировал ваш пример. Интересная средняя головоломка получилась. Спасибо за статью.
      
      Для вашего варианта в статье:
      1) В стилях можно убрать строки .navigation .right… .navigation .left… и .pagenavi b… Они там ни к чему.
      2) В последнем вашем комменте rel=”nofollow”>’.$i.’ ‘; и else echo ‘‘.$i.’ ‘; Нужно заменить $i на $max_page.
      
      Ответить
FHD 25.01.2011 в 02:03

Имеется ввиду постраничную навигацию.

Ответить
Access 01.03.2011 в 00:05
Я не особо разбираюсь в php =) я тупо скопировал код и вставил на сервер. под именем page.php.
Таким же макаром скопировал код
```
<div class="navigation">
    <?php include("/page.php"); ?>
</div>
```
И вставил в news.php. такс у меня 7 новостей ) а деления нет ) .. я просто не понимаю по коду через какое количество новостей он заработает. ) и заработает ли вообще ) не в курю сделал ли я правильно. Если сможешь помочь помоги =)
Ответить
02.03.2011 в 02:19

А почему в news.php? У вас есть index.php? Попробуйте вставить в него, а так же в archive.php и search.php.

Ответить
Access 02.03.2011 в 11:22

Мой сайт это аля курсы попова =) хотелось бы чтобы только некоторые из страниц моего сайта делились. Сайт прописан вручную. Возможно ваш вариант для готовых контентов?

Ответить
Asaba 06.03.2011 в 11:15

Постраничную навигацию сделал, но никакого оформления стилей нет, просто цифры 123 и все, хотя в файл style.css код оформления добавил. Смотрится как – то убого…
Можете подсказать, как это исправить ?

Ответить