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

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

Приветствую все посетителей блога WebMasterMaksim.ru, сегодня продолжаю серию статей «без плагинов» и расскажу я про постраничную навигацию WordPress.

Как я рассказывал в предыдущих статьях, плагины могут создавать много лишних запросов к базе данных, в следствии чего падает скорость загрузки сайта.

И вот на одном из моих сайтов я работаю вообще без лишних плагинов, использую легкий шаблон и многие другие штуки по оптимизации WordPress, в результате чего сайт просто летает, этот блог пока еще к сожалению не доделан, так что все впереди.

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

Вот все статьи серии «Без плагинов»:

Итак, постраничная навигация в WordPress вы можете наблюдать, на главной странице, на страницах разделав, поиска, это все улучшает юзабили, в результате чего посетителю становится проще передвигаться по вашему проекту, и статистика поведенческих факторов будет улучшаться, а самое главное показатель отказов тоже может чуть-чуть снизится.

Постраничная навигация WordPress

Начинающему вебмастеру может быть трудновато реализовать постраничную навигацию WordPress без плагинов, поэтому вот плагин который поможет вам это сделать WP-PageNavi, а потом уже когда наберетесь опыта, сделать все это без плагинов.

Вот смотрите видео Евгения Попова про работу с этим плагином:


Еще хочу сказать перед тем, как начать делать постраничную навигацию WordPress без плагинов, сделайте резервные копии вашего сайта, это нужно делать всегда перед изменениями на ваших блогах, потом просто будет удобно все восстановить, если у вас что-то не получилось или не понравилось как это выглядит.
Так-же если вы делаете изменения в дизайне вашего проекта который уже имеет посещаемость, используйте кэширование плагином Hyper Cache, благодаря этому все изменения будут видны только вам, а остальным посетителям будет показываться старая кэшированные версии страниц, это очень удобно при изменении дизайна блога.

Все создаем постраничную навигацию в WordPress без плагинов, для этого создаем в блокноте файл и называем его pagenavi.php и вставляем в него следующий код:

[php]
<!—?php global $wp_query; $max_page = $wp_query—>max_num_pages;
$nump=6; /*Количество отображаемых подряд номеров страниц*/

if($max_page>1){
$paged = intval(get_query_var(‘paged’));
if(empty($paged) || $paged == 0) $paged = Первая;

echo ‘</pre>
<div class="wp-pagenavi">’;
/* echo ‘Страница ‘.$paged.’ из ‘.$max_page.’      ‘;*/
if($paged!=1) echo ‘<a href="’.get_pagenum_link(1).’">« Первая</a> ‘;
else echo ‘<span style="text-decoration: underline;">1</span>’;

if($paged-$nump>1) $start=$paged-$nump; else $start=2;
if($paged+$nump<$max_page) $end=$paged+$nump; else $end=$max_page-1; if($start>2) echo "<b>…</b>";

for ($i=$start;$i<=$end;$i++)
{
if($paged!=$i) echo ‘<a href="’.get_pagenum_link($i).’">’.$i.'</a> ‘;
else echo ‘<span style="text-decoration: underline;">’.$i.'</span>’;
}

if($end<$max_page-1) echo "<b>…</b>";

if($paged!=$max_page) echo ‘<a href="’.get_pagenum_link($max_page).’"> Последняя »</a>’;
else echo ‘<b> Последняя</b> ‘;
echo ‘</div>
<pre>
‘ ;
}
?>
[/php]

Теперь сохраняем этот файл и заливаем его в вашу тему, идите к себе на хостинг, wp-content > themes > название вашей темы, и уже сюда закачиваем наш только что созданный файл pagenavi.php.

Далее вы этот файл можете даже редактировать через админку WordPress где находятся основные файлы вашей темы, футер-подвал, хедер -шапка и так далее.

Теперь нам нужно вывести постраничную навигацию на главной странице, в разделах, страницах поиска.

Для этого нам нужно вставить через админку WordPress, код-функцию вызова постраничной навигации, в файлы index.php, search.php и archive.php, конкретное место я вам указать не могу у каждого свои темы, ну я думаю вы с этим справитесь!

Вот этот код вызова постраничной навигации:

[php]</pre>
<div class="pagenavi"></div>
<pre>
[/php]

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

Посмотрите на код файла pagenavi.php, в него я включил контейнер div class=»pagenavi», а это значит что мы уже можем в файл стилей вашей темы добавлять правила для вашей навигации.

Теперь через админку заходим в редактор вашей темы в файл (style.css) и вставляем туда следующие стили оформления навигации по страницам в WordPress:

[php].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;}[/php]

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

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

1 Звезда ХЕРНЯ!2 Звезды ЧИТАЛ И СПАЛ3 Звезды НУ МОЖНО ПОЧИТАТЬ4 Звезды НРАВИТСЯ!5 Звезд КРУТО! (1 оценок, среднее: 5,00 из 5)
Загрузка...

52 thoughts on “Постраничная навигация WordPress без плагинов.

  1. Максим! Я установил плагин Рage Navi но постраничная навигация не открылась.С помощью Page Number тоже.Не подскажите что делать?

  2. Активируете плагин в админке. И вставляете строчку < ?php if(function_exists('wp_page_numbers')) { wp_page_numbers(); } ? > в нужный шаблон в то место, где должен отображаться пейджер навигации. Между < ? и ? > уберите пробелы

  3. search.php и archive.php — у меня вот этих 2-х нет :(

  4. search.php и archive.php — у меня вот этих 2-х нет :(
    и куда вот в стили (то что в конце) вставлять правильно? в какое место?
    Я вставила в самый конец -как есть — пошла смотреть, но ничего не изменилось — не появились циферки с номерами страниц :(
    Хоть сайт живой

  5. Здравствуйте, Максим!
    Никак не нахожу в коде файла pagenavi.php контейнера div class=”pagenavi”. Что Вы хотели этим сказать. Выделите его как-нибудь, что ли?

  6. Код вызова постраничной навигации, окружен дивом!

  7. Наталья у вас может быть эти файлы называются по другому, нужно вставить в те файлы где нужно выводить постраничную навигацию, это «Результаты поиска» — «Архивы (то есть категории-рубрики)», ну и главная.

  8. Вот такие у меня в шаблоне названия
    comments.php
    footer.php
    functions.php
    header.php
    index.php
    page.php
    pagenavi.php
    sidebar.php
    single.php
    template.php
    и что отвечает за архив и категории/рубрики мне сложно понять
    Сегодня проверила созданный файл пагенави и там вместо некоторых (кодов) слов были символы ромбик с вопросительным знаком, влезла уже с админки и заменила снова код — может еще в этом причина. но надо найти какие из выше перечисленных файлов отвечают за архив и категории.

  9. экспериментами только весь сайт себе изуродовала! Сейчас кое как нашла где чего вставляла и удалила, а одну не могу найти. Шапка сайта имеет большой отрыв от всего содержимого — уродство! Как же мне найти ошибки?!

  10. у вас файл постраничной навигации уже есть, вот он pagenavi.php

  11. Наталья, а зачем вы туда полезли, если вообще ничего не понимаете, вам проще в таких случаях установить плагин и не мучится, ну или в крайнем случае нанять фрилансера.

  12. Плагинов у меня уже ставить некуда- очень много. просто уже вторую неделю пытаюсь поставить себе постраничную навигацию. Файл есть, но вы же пишете что еще в 3-х файлах надо код дописать. В любом случае после добавления файла нового пагенави ничего не добавилось, после добавления на главную ничего кроме поднятой шапки не изменилось, потом еще в 2-х файлах вроде как за архивы и поиск отвечающие попробовала код добавить и сразу тоже ничего не изменилось, а через время на страничку свою глянула и обалдела — постраничной навигации так и не добавилось, зато в сайдбаре все поехало + шапка сильно поднялась или же вся страница вниз упала. Вот так получилось. А фрилансера я не могу нанять у меня ни копейки нет. Сейчас за интернет надо платить — снова с родителй потяну. Потому пытаюсь собственными силами делать. Коды я ж не сама придумываю — вот у вас нашла, а что не так, пока не знаю. Кстати у вас места под написания сайта нет, как вы знаете какой сайт мой?

  13. Максим, а у Вас шапка сайта тоже вроде как сильно поднята — расстояние между шапкой и всем остальным непропорционально велико — это тоже может влияние кода?

  14. Наталья у меня шапка так и стояла, в будущем может сменю ее сделаю поменьше. Попробуйте на время поставить другую тему и проделать все тоже самое, ну если не получится, пишите, будем разбираться.

  15. Пока пробую все убрать. назад вернуть. Если тему сменю ( а мне никакая другая не подходит увы) то там могут быть другие названия файлов. Нельзя ли по имеющимся подсказать какой за архив отвечает, какой за рубрики?
    comments.php
    footer.php
    functions.php
    header.php
    index.php
    page.php
    sidebar.php
    single.php
    template.php

    Вот эти вроде: главная и архивы…
    index.php
    page.php
    и есть сомнения что у вас все скобки на месте — может где то пробел в виде вставки строки например должен быть? и точное место вставки — я например в самый конец вставляла перед или после определенных тегов типа ДИВ
    ?>

  16. Я имел ввиду поставить другую тему для тренировки (на время), а старую можно просто восстановить из бекапа, секундное дело.

  17. Ну в принципе это понятно, ну будут там файлы названы правильно например — это облегчит задачу, а здесь вы не подскажете какой из файлов за то отвечает? Могу в скайпе их содержимое показать, если вы не против ;) Честно говоря бэкапом еще не пользовалось — мне просто страшно. а терять уже много чего есть.

  18. Если что резервные копии делает хостинг автоматически, вам нужно только восстановить и все, чего там страшного. Скайпа нет. comments.php
    footer.php это подвад
    functions.php это функции темы
    header.php это шапка сайта
    index.php Основной шаблон
    page.php Шаблон страницы
    sidebar.php сайтбар
    single.php это одиночная запись
    template.php

  19. Максим, большое спасибо за обозначение моих файлов! а все таки выходит что нет у меня в теме 2-х нужных файлов, отвечающих за архивы и рубрики.

  20. посмотрите файл template.php, не знаю за что он у вас отвечает, может он рубрики и выводит.

  21. О, этот файл относится непосредственно к шаблону фирмы, которая склепала шаблончик — с ним пришлось повозиться чтоб убрать все ненужные для моего уже сайта ихние ссылки ))))

  22. Спасибо вам за код, отлично работает. Добавила в закладки, использую на след сайте. Еще раз спасибо!

  23. Добрый день Максим.Подскажите пожалуйста как сделать постраничную навигацию в рубриках.Поставила плагин pagenavi 2.83 все отлично работает , но в рубриках постраничная навигация не работает(((( Стандартные настройки типа «предэдущие записи» Может быть нужно код слегка подправить?

  24. Наталья вам нужно в файл archive.php вставить код вызова плагина, который вы вставили на главную (index.php). А код выводящий “ предыдущие записи” если нужно можно удалить.

  25. Спасибо Максим!Все сделала-работает отлично!!!Код выводящий предыдущие записи удолять не стала,оставила для подстраховки на тот случай если плагин слетит

  26. Приветствую. Вопросик такой. Поставил Ваш код без плагина. Все работает. Спасибо. Но есть слово «Последняя» А нету «Первая». Как можно реализовать эту не менее важную кнопку?

  27. Привет Рич, вот пример кода if($max_page>1){
    $paged = intval(get_query_var(‘paged’));
    if(empty($paged) || $paged == 0) $paged = Первая;

    echo »;
    /* echo ‘Страница ‘.$paged.’ из ‘.$max_page.’      ‘;*/
    if($paged!=1) echo ‘« Первая ‘;
    else echo ‘1’

  28. Этот кусок кода отказывается мне подчиняться) Пытался вписать его в исходный код, все безтолку. синтаксис из комментов поправил. Команда вывода слова «первая» глушит выполнение остальных команд. И как следствие — слетает вся верстка страницы))) Вы не могли бы на примере указанного в посте кода показать готовый вариант содержимого файла pagenavi.php?

  29. Рич, я обновил код в статье! Попробуй его, обязательно напиши о работоспособности, у меня на этом блоге работает!

  30. Обновил код. Работает как часы))) Отличный код) Вот только бы еще «Первая» была бы без ссылки, когда на первой странице находишься. Но это уже мелочи) Спасибо большое)

  31. Спасибо, все получилось, все работает. Стили свои прописала, красота!

  32. К комментарию Натальи: файл template.php надо убрать вообще. Она дает информацию о версии шаблона: халява для хакеров.
    Я права, Максим?

  33. Кстати, вопрос: почему у Вас на шапке, с правой стороны список со скрепкой наезжает на поиск.? Вернее последняя ее часть где указывается количество друзей. Она у меня прямо на строке поиска. Неудобно писать.
    И еще: Ваш блог не показывает robot.txt. В теме об этом файле Вы предлагаете посмотреть как он выглядит на примерах других сайтов. Посмотрела Ваш: выдает 404 ошибку.

  34. Нет! я не знаю содержимое ее файла template, поэтому он может быть и нужный.

  35. Alisa, с какого вы браузера смотрели и какое у вас расширение экрана? У меня все в порядке, там от скрепки до поиска еще очень много места! А роботс теперь у меня защищен!

  36. Пользуюсь firefox. Нетбук 11″. Пробовала уменьшать/увеличивать: все одно — [количество друзей] на строке поиска.
    А для чего защищать то robots ? Его кто-то может изменить кроме Вас?

  37. Alisa, проверил со всех браузеров и всех расширений компьютера, вроде все нормально, про нетбук конечно не знаю, может быть, но под каждый экран очень трудно подстроится, разве только поубирать всю графику! Нет, робот защищать не нужно, это у меня система, которая защищает доступ людей к моим внутренним файлам, ну и так получается, что и к ротобу не пускает!

  38. Сегодня заглянула к Вам. Полный порядок с шапкой сайта: ничего не наезжает; все на своем месте. Даже и не знаю, что это за глюк был с нетбуком. 11 в общем-то терпимо: только тяжелую артиллерию в виде фотошопа тяжело тащит. Поэтому пользуюсь онлайновыми сервисами; ну и теми вроде Notepad. Короче. что попроще.
    А у меня к Вам вопрос: в скрипте скролинга , который скачала с интернета, есть такая строчка:
    setTimeout(«window.onresize=regenerate»,450)
    Что означает это?
    И, если есть возможность. как поставить вертикальный скроллинг для вывода рейтинга.
    И, еще, такую форму коментариев (думаю, она тоже без плагинов) не помешало бы. Просто везде предлагается формы вконтакте или фейсбука. А мне бы простую, без наворотов.
    Спасибо за ответы. Кажется я у Вас прописалась: каждый день заглядываю. За 3 года знакомства с интернетом такое постоянство первый раз. Вы лучше всех.

  39. Alisa, спасибо! всегда рад постоянным читателям! К сожалению про скролинг со стороны подсказать ничего не могу!А почему вас не устраивает стандартное комментирование?

  40. Я и хочу как у Вас, простой. У Вас и есть стандартный? А где его взять? Разве что у Вас подсмотреть. Больше возни. Если не трудно, скиньте мне на мыло. Срочно надо на сайт поставить.
    Плиз.

  41. Alisa, так у меня и так стандартная навигация! не понял, что вас интересует?

  42. В моей теме WordPres не такая форма как ваша. А как ее сделать не знаю.

  43. Здравствуйте, admin.
    У меня вопрос, вот у меня под разные категории разные шаблоны, ваш код вставляю, а он не работает, выходит «вперед,назад» но когда нажимаю на той же странице остаюсь(страниуа обновляется) ссылка тоже меняется, но контент тот же(те же записи).
    Можете помочь, буду благодарен, если надо вышли все файлы вам(на почту?).

  44. Максим, у меня эта пагинация выглядит пустыми квадратиками (ни цифр, ни слов) внизу страницы. По нажатию на них — да, переходишь на другую страницу с анонсами статей.

    Все копировала и вставляла, как сказали.
    В чем может быть причина?

  45. Анна, тут подсказать мне нечего, я со стороны не вижу!

  46. Здравствуте! поставил плагин пэйж нави, навигация появилась только на главной странице, в архивах нет. Не подскажите в чём проблема?

  47. Огромное спасибо за информацию. у меня не правильная страничная навигация. буду переделывать.

  48. В публикации Максима рассказывается о том, что для того, чтобы пагинация появилась на всех страничках необходимо подключить её соответствующим кодом на всех страничках шаблонов вывода. В вашем случае, на сколько я понимаю вы вывели пагинацию только на главной странице — по этой причине она так и не появилась на других страничках.

  49. Анна, мне кажется, что у вас просто проблема из стилями — попробуйте просто написать новые классы для этих «квадратиков» (естественно присвоить их в коде вывода) и указать им отображение в том виде, который считаете нужным, например добавить размер, цвет шрифта, отступы и так далее. Если квадратик был пустой — то возможно цвет шрифта получил свойство цвета фона (и слился с фоном).

  50. «конкретное место я вам указать не могу у каждого свои темы, ну я думаю вы с этим справитесь!» — вау, как информативненько. спасибо, можете еще удачи пожелать и помолиться за нас. вот только от этого я не найду место куда надо вставить код. хотя бы приблизительно указать, но нет. начал следовать инструкции и тут на половине такой бред. зря получается время потратил.

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

Ваш e-mail не будет опубликован. Обязательные поля помечены *