WP-PageNavi постраничная навигация для блога на WordPress  установка, настройка и изменение внешнего вида пагинации

WP-PageNavi постраничная навигация WordPress

Всем привет! Если читатель вашего блога может переходить по страницам только следующим путем: Назад – Вперед или по таким ссылкам Предыдущее – Новые сообщения , тогда у вас стоит стандартная, не удобная навигация. Если у вас сообщений за сотню или больше , то это представляет для посетителя большие неудобства. Вам её надо поменять на более удобную постраничную навигацию, чтобы пользователю было удобно двигаться произвольно, то есть, он смог попасть даже на последние страницы вашего сайта.

Современная, красивая постраничная навигация для блога WordPress организуется с помощью популярного плагина WP-PageNavi. На официальном сайте wordpress.org данный модуль занимает четвертое место по скачиванию. На момент написания этого поста, его скачали уже 4065194 раз. Как устроена удобная навигация по страницам Вы можете посмотреть у меня на блоге. Если готовы к переменам на своем веб-ресурсе, тогда приступим.

Постраничная навигация WordPress с помощью плагина WP-PageNavi

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

Как установить и настроить плагин WP-PageNavi

Установить данный модуль можно стандартным путём, через раздел “Плагины” – “Добавить новый”, в поле для поиска плагинов вводим его название и нажимаем кнопку искать. Затем, после успешной установки незабываем активировать плагин. В разделе “Параметры” у вас появится пункт Список страниц вот и по ней кликаем. Откроется страница “Настройки плагина”, где вам надо всего лишь внести кое какие изменения – ваш текст написания и так далее. Плагин поддерживает русский язык, поэтому в настройках сложностей нет (есть подсказки):

Настройки плагина WP-PageNavi

Настройки плагина WP-PageNavi

Как видно из скриншота, Вы можете заменить текст на свой или оставить всё как есть. Отметьте -Использовать стиль pagenavi-css.css или нет. Если вам нужно настроить CSS стиль WP-PageNavi сделать это можно в файле плагина. Надо для этого перейдите в раздел “Плагины” – “Редактор”, выберете в качестве плагина для изменения WP-PageNavi и найдите в открывшемся списке файл wp-pagenavi/pagenavi-css.css. По настройкам все понятно. Следующий шаг такой.

В вашей теме в файлах index.php, archive.php и search.php , необходимо найти призывы к next_posts_link () и previous_posts_link () и заменить их. В теме TwentyTen, это выглядит так:

Может в других темах выглядеть и так:

Ищите, что то похожее и вам надо заменить эти строчки этим:

Все. Готово. Теперь будет плагин работать. Если вам стиль навигации не подходит под дизайн вашего блога и Вы хотите придать особенный вид для неё, тогда вам надо читать статью далее.

Плагин WP PageNavi Style добавляет больше цветовых вариантов для Wp-PageNavi

Плагин WP PageNavi Style

Да, Вы не ошиблись, для того, чтобы можно было воспользоваться готовыми стилями для постраничной навигации WP-PageNavi, надо установить дополнительный плагин WP PageNavi Style от этого же разработчика. Установите таким же образом этот модуль, активируйте его и у вас появится пункт WP PageNavi Style в боковой колонке админки. Нажмите её для настроек и выбора стиля для вашей новой навигации:

Настройка плагина WP PageNavi Style

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

Набор стилей плагина Плагин WP PageNavi Style

Какой большой выбор. Если не хотите использовать готовые стили, установите – Custom и настройте стиль по своему:

Custom и настройте стиль по своему

Все. Еще один момент. Если Вы готовы установить постраничную навигацию в ручную, то есть без плагина, тогда читаем далее.

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

Этот код настолько распространен, что на какой блог ставить ссылку не известно. Поэтому обойдемся без неё.

Откройте файл “Функции темы” (functions.php), прокрутите страницу вниз и перед закрывающим тегом ?> вставьте такой код (не забудьте на всякий случай сделать резервную копию, если пойдет, что не так:

Затем, меняем стандартный код вывода во всех файлах, где есть навигация – index.php, category.php, archive.php и так далее. Меняем вместо:

Далее, надо добавить стиль css. Откройте файл вашего шаблона “Таблица стилей” (style.css) и в самый низ вставьте етот код:

Готово. Если вам не очень понятно, как сделать навигацию в ручную, лучше воспользуйтесь плагином. А у меня на этом все. До встречи.

WP-PageNavi

WP-PageNavi это один из самых известных и популярных плагинов для WordPress. Он позволяет легко и просто вывести на сайте постраничную навигацию. Необходимость постраничной навигации не вызывает сомнений – во-первых, пользователям с ней намного удобнее, чем с непонятными ссылками “Раньше” и “Позже”, а во-вторых, постраничная навигация помогает в плане SEO – поисковики куда лучше индексируют страницы, если ссылки на них есть на главной странице сайта. Есть несколько подобных плагинов, но WP-PageNavi считается лучшим из них. Собственно, постраничная навигация в WordPress и плагин PageNavi это сейчас практически неразделимые понятия.

Скачиваем плагин по ссылке в конце страницы и устанавливаем его:

1 Распаковываем архив.

2 Копируем папку wp-pagenavi в /wp-content/plugins/.

3 Заходим в админку блога на вкладку “Плагины” и активируем плагин.

Плагин полностью переведен на русский язык. Причем переводчик перестарался, переведя даже название плагина (это противоречит здравому смыслу – кто переводит имена собственные?). Поэтому при активации плагина ищите среди загруженных плагинов не WP-PageNavi, а Список страниц. С настройками та же история – их вы найдете в “НастройкахСписок страниц“.

Первая часть настроек плагина касается самой панельки и ее значений:

Это значения по умолчанию. Они дают примерно такой вид панели:

Если не заполнить какое-либо поле, то в панели оно выведено не будет. Поэтому можно сократить панель до более компактного варианта вроде:

Вторая часть настроек касается самого плагина:

Здесь я должен сделать несколько пояснений. Опция “Использовать стиль pagenavi-css.css” заставляет плагин применять для панели css-стили из файла pagenavi-css.css, который лежит в папке плагина. Если в вашем шаблоне уже прописаны стили для плагина (а это бывает часто, так как WP-PageNavi очень популярен), то вам необходимо снять галку с этой опции. Ведь, как правило, прописанные в теме стили куда лучше стилей плагина по умолчанию.

Диапазоны советую отключить (по умолчанию они включены), поставив везде значение “0”. Потому что лично мне такая навигация не нравится:

Но решать, конечно, вам.

С настройками закончили – как вывести панель плагина в шаблоне? Вам необходимо найти в файлах шаблона код, похожий на:

И заменить его на код:

Именно на этом этапе у многих пользователей возникают проблемы. Потому что в каждом шаблоне этот код может быть разным. Даже файлы, в которых надо искать этот код от шаблона к шаблону очень сильно отличаются. Поэтому, советую скачать редактор Notepad++ (он вам нужен в любом случае, так как файлы необходимо сохранять строго в кодировке UTF8 без БОМ) и выполнить в нем поиск по файлах функций next_posts_link и previous_posts_link.

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

Теперь поговорим о стилях оформления панели. Не нравится вид панели по умолчанию? Хотите такую панельку, как на скриншоте в начале этой статьи? Тогда откройте этот файл pagenavi-css.css и скопируйте его содержимое в файл pagenavi-css.css, который лежит в папке вашего плагина.

Есть еще более простой способ стилизовать вашу панельку. Для это вам необходимо установить плагин WP PageNavi Style, в котором вы можете выбрать встроенные стили вроде таких:

Не хотите устанавливать дополнительный плагин? Хорошо, в таком случае вы можете воспользоваться моими подборками стилей для WP-PageNavi:

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

WP-PageNavi
Автор плагина: Lester ‘GaMerZ’ Chan
Рассматриваемая версия: 2.86 от 05.09.2014
Текущая версия: 2.93.1 от 23.10.2019
Совместимость с версией WordPress: 3.2 и выше
Активных установок плагина: 800 000+
Скачать плагин версии 2.93.1 (всего скачено 9 777 515 раз)

Как настроить пагинацию в WordPress: с плагином и без плагина?

В статье рассмотрим, как добавляется и настраивается пагинация WordPress для удобного поиска информации посетителями.

Постраничная навигация: что это, зачем нужна

Нужна для того, чтобы группировать и сортировать большие объемы данных.

Бывает двух видов: алфавитная и числовая. Первая – для удобного представления словаря или раздела F.A.Q. Числовая помогает пользователю ориентироваться и находить нужный контент.

Навигация может поддерживать AJAX – технологию, которая подгружает посты без перезагрузки страницы.

Делаем алфавитную пагинацию

Вывести информацию по буквам алфавита просто: с помощью Alphabetic Pagination .

1. Перейдите Плагины -> Добавить новый, введите “Alphabetic Pagination” в форму поиска и нажмите клавишу [Enter].
2. Установите и активируйте.
3. Перейдите Настройки – Alphabetic Pagination.

Основные настройки

Implementation – автоматический или ручной вывод алфавита. Если выбрано первое, то разбивка встроится автоматически. Она будет показана под основным меню. Для ручного режима выведется шорткод.

Display on all lists? – выбор мест и разделов вывода алфавитной пагинации.

Hide/Show pagination if only one post available? – показать/скрыть разбивку, если на сайте один пост.

DOM Position? – место вывода. Оставьте по умолчанию.

Language selection? – язык. Выберите “русский”.

Styles – стиль алфавитного блока (горизонтальный, вертикальный, строчные или прописные буквы).

Disable Empty Alphabets? – показать/скрыть разбивку, если нет постов.

4. Установите нужные опции и нажмите кнопку Save Changes.

Если выбрана автоматическая вставка, то главная будет иметь вид:

В другом случае – вывод набора шорткодов для вставки.

5. Добавьте шорткоды в файлы шаблонов.

Вывод числовой пагинации WordPress

Постраничная разбивка есть почти во всех темах WP. Одни используют стандартную, а другие – с технологией AJAX.

Но иногда нужно изменить или создать свой функционал навигации. Есть 2 способа: плагин, кастомная функция.

Есть несколько хороших дополнений для решения задачи. Рассмотрим на примере бесплатного WP-PageNavi .

1. Установите и активируйте.
2. В админке перейдите в раздел Настройки -> WP-PageNavi.
3. Сделайте основные настройки (шаблон, количество и диапазон страниц для показа) и нажмите кнопку Сохранить изменения.
4. В шаблонах темы добавьте код:

Если нужно заменить/добавить постраничную навигацию для блога, используйте шаблоны index.php, archive.php, search.php.

Кастомная функция

Если установка/работа плагина не устраивает, можно создать свою функцию.

Откройте файл functions.php активной темы и вставьте код:

Измените код под свои нужды (отмечено в комментариях).

Чтобы разбивка отображалась, пропишите PHP-строку в шаблон темы:

Отдельно о пагинации постов

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

Для нового редактора Gutenberg есть блок Разрыв страницы.

С точки зрения SEO, к подстраницам нужно добавлять атрибут каноникал. Тут приходит на помощь All in One SEO Pack . Просто перейдите All in One SEO -> Общие настройки и включите опцию Использовать nofollow для страниц/записей с пагинацией.

Если не работает переход

Обычно в итоге выводится ошибка 404.

Ошибка 404

Это значит, что запрошенная страница сайта не существует. Способы решения:

  • перейдите в админке в раздел Настройки -> Постоянные ссылки и нажмите кнопку Сохранить изменения;
  • очистите кэш на сайте и в браузере;
  • проверьте корректность работы всех активных плагинов;
  • пересмотрите добавленный вручную код на предмет ошибок.

Альтернатива плагину WP-pagenavi (пагинация для WordPress)

C версии 4.1 в WordPress появилась родная аналогичная функция: the_posts_pagination()

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

Если другие плагины сложно представить без возможности их настройки в админ-панели, то wp-pagenavi мне представляется легко. Достаточно один раз настроить навигацию и забыть про нее. И наверное есть те, кто думает так же? Поэтому я решил отказаться от wp-pagenavi и заменить его на свою функцию. Функцию я написал, предварительно изучив код wp-pagenavi, частично код был взят от туда. Все CSS классы wp-pagenavi сохранены и, как следствие, заменить wp-pagenavi на мой вариант совсем не составит труда.

Для замены нужно скопировать нижеследующую функцию в файл шаблона functions.php. Также, нужно скопировать CSS стили wp-pagenavi в ваш файл стилей (обычно это style.css). Перенос стилей носит и полезный характер, потому что больше не будет необходимости подключать файл стилей, а это минус один http запрос.

Настройки описаны прямо в коде и они идентичны настройкам wp-pagenavi, с той лишь разницей, что вместо текста “к последней странице” можно вывести номер последней страницы.

После того, как функция установлена и css стили перенесены, меняем в шаблоне код wp_pagenavi на этот:

Если у вас в коде что-то вроде этого, то нужно поменять все wp_pagenavi на kama_pagenavi :

CSS стили для кода

Выше я уже сказал. что классы CSS совпадают с wp-pagenavi. Для удобства выкладываю тут все CSS правила:

В моем коде присутствуют 4 новых класса: first (в начало), last (в конец), prev (назад), next (вперед).

Неплохую подборку стилей можно взять здесь.

Если навигация выводится 2 раза

Так же, хочу обратить внимание тех, у кого навигация выводится 2 раза на странице (сверху и снизу цикла). Чтобы 2 раза не выполнять одни и те же операции по составлению навигации, логичнее сделать так: один раз собрать навигацию (использовать функцию), затем записать результат в переменную и второй раз просто вывести эту переменную. Выглядит это так:

Обновления

17 декабря 2013
Версия 2.0. Подправил код, убрал лишние, ненужные вызовы функции get_pagenum_link(), за счет чего код стал работать гораздо быстрее, без потери качества.

11 мая 2010
Перенес ссылки назад/вперед, теперь так:
«назад « ** к началу . 11 12 13 14 15 16 17 18 . в конец ** » вперед»

Последний вариант функции наверху.

2 мая 2010

Добавлены ссылки назад/вперед, пример:
« ** к началу «назад . 11 12 13 14 15 16 17 18 . вперед» в конец ** »
Их можно отключить (см. настройки).

  • Убран баг такого типа:
    1 . 2 3 4 5 6 7 8 . 50 или 1 . 21 22 23 24 25 26 27 28 . 29
    То есть, где не нужно убраны тексты “до” и “после” навигации (в данном примере это троеточие).
  • Реверсивная пагинация для WordPress

    Идея реверсивной (обратной) пагинации принадлежит sholo, который высказал её на известном нам форуме – mywordpress.ru. Мне стало интересно посмотреть, как это будет выглядеть и я немного переделал код.

    Этот код основан на старой версии основного кода.

    Блог Виталия Кириллова | Все о создании,
    продвижении сайтов и заработке в интернете

    Создание и продвижение сайтов, заработок в интернете

    Постраничная навигация в WordPress с помощью плагина WP-PageNavi

    Всем привет! Вы наверное заметили, что до этого дня на блоге SEO-Mayak.com еще не была установлена постраничная навигация. Я намеренно не спешил с установкой этой функции в силу малого количества опубликованных статей.

    Недавно блогу исполнился месяц и данная статья будет двадцатой по-счету. И наверно для удобства моих уважаемых читателей пора бы уже избавиться от ужасно неудобных , а порой даже раздражающих, пресловутых — «Предыдущие записи» и «Следующие записи».

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

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

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

    Плагин WP-PageNavi. Установка постраничной навигации на WordPress

    Скачать плагин можно с официального сайта по этой ссылке — скачать плагин WP-PageNavi .

    Распаковываем архив и с помощью FTP клиента закидываем папку с плагином в директорию — wp-content/plugins. Затем заходим в админку блога во вкладку — «Плагины» и активируем плагин WP-PageNavi.

    К настройкам плагина мы перейдем чуть позже, а сперва надо заменить встроенную навигацию — «Предыдущие записи» и «Следующие записи» на постраничную навигацию. Открываем для редактирования файлы в которых прописана функция навигации. В основном это 3 файла — index.php, search.php и archive.php. которые находятся в папке с Вашей темой — wp-content -> themes -> Ваша тема

    Ищем в них строчки похожие на эти:

    У Вас эти строчки могут маленько отличатся, но найти их особого труда не составит. Заменяем найденные строчки на следующий код:

    Повторяю, что замену кодов надо произвести во всех трех файлах!

    Настройка плагина WP-PageNavi

    Для того, чтобы произвести нужные нам настройки плагина, идем — админка блога -> Параметры -> Список страниц:

    Откроется страница настроек плагина, на которой по желанию можно изменить следующее:

    В строчке — «Шаблон общего списка страниц» можно убрать общее количество страниц или сократить слово -«Страница», Например мы можем прописать так:

    После проведенных изменений получится вот такая форма:

    Вторая и третья строчка выводят непосредственно номера страниц и их лучше не трогать.

    В четвертой и пятой строчке, опять же по желанию, можно поменять слова «Первая» и «Последняя» например на «В конец» и «В начало» и добавить номер страницы.

    Получается такая картинка:

    А если нажать на номер страницы в конце формы, то увидим следующее:

    Точно также можно заменять символы в оставшихся четырех строчках. Надеюсь разберетесь, а если нет, то задавайте вопросы в комментариях.

    Строчка — «Использовать стиль pagenavi-css.css» позволяет выключать или отключать встроенные в плагин стили (внешний вид формы постраничной навигации). Если Вы совсем не разбираетесь в языке CSS, то лучше галочку оставить.

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

    В строчке — «Стиль списка страниц» лучше оставить — «Обычный«, так как если выбрать — «Выпадающий список», то навигация будет выглядеть так:

    В строчке — «Всегда показывать список страниц» галочку не ставим.

    Далее. В строчке — «Количество страниц для показа» надо указать количество страниц, которое будет включать в себя навигация. Например если указать цифру 3, то мы получим форму всего из трех страниц:

    В строчке — «Диапазон страниц для показа» обычно меняют значение если на блоге большое количество статей. Например если указать диапазон 5 то в конце формы будет отображаться нумерация 15, 20, 25 и т.д. Если же указать цифру 10, то диапазон изменится на 20, 30, 40 и т.д.

    Если в строчке — «Коэффициент для диапазонов страниц» к примеру указать цифру 2, то получим следующую картину:

    Видно, что появились цифры в диапазоне 2. Пользоваться этой функцией начинают, когда на блоге больше 100 публикаций, а то и больше.

    После того, как мы изменили настройки «под себя», не забываем сохранить изменения.

    Я думаю сложного тут нечего нет и даже самый «зеленый» блогер легко справиться с установкой постраничной навигацией на WordPress вместо неудобной, встроенной функции.

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

    С уважением, Виталий Кириллов

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

    Привет, ребята. Сегодняшний пост родился, можно сказать, не случайно. Не подумайте, что я вдруг решил написать баян, который и так все знают и, что не раз уже писалось на различных блогах. Вовсе нет, и приставка «Правильная» в названии поста кое-что обозначает.

    Все началось с того, что некоторые системы анализа сайтов мне показывали полные дубли некоторых страниц блога (например, https://alaev.info/blog и https://alaev.info/blog/ , https://alaev.info/blog/category/seo и https://alaev.info/blog/category/seo/ и др.), притом, что этих страниц я не мог найти в упор, да и сами дублирующие адреса автоматически редиректились на правильные (правильные у меня это без слеша на конце). Я не мог понять откуда это берется и где робот-анализатор мог их находить. Ночами перестал спокойно спать из-за этого…

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

    Первая мысль – кривой плагин WP-Pagenavi, не иначе. Пошел делать «распил» файлов плагина, там оказалось все не просто и очень запутано, но я разобрался с проблемой за полчаса. Но это не главное.

    Я вспомнил, что когда-то слышал, что можно сделать постраничную навигацию для WordPress и без всяких плагинов – пошел искать и тут же нашел множество вариантов. У меня была надежда, что если делать все самому и вручную без плагинов, то таких косяков быть не должно. Оказалось иначе – некоторые «самопалы» на деле оказались еще хуже, и вместо того чтобы показывать ссылку на основную страницу и без слеша, как мне надо, они показывали /page/1, что является полным дублем основной страницы, при этом реально существующим.

    Чтож, опять придется «пилить» — мне не в первой. Для этого я выбрал самое адекватное из найденных решений (вот оно) за что большое спасибо блогу wp-kama.ru. Кстати, проблема постраничной навигации в этом варианте такая же как и в плагине WP-Pagenavi – лишний слеш для первой страницы. Но есть несомненный плюс – мы избавимся от плагина!

    Итак, несколько причин, по которым стоит отказаться от плагина WP-Pagenavi в пользу альтернативы, предложенной в этом посте:

    1. За удобство настроек в админ панели приходится платить ценой лишних запросов, так как эти настройки сохраняются в БД, а затем от туда и берутся, хотя это в теории, а на практике они берутся из кэша опций WordPress, но тем не менее…
    2. В продолжение первого пункта – удобство в данном случае дело сомнительное – постраничная навигация, это такое дело, что настроил однажды и забыл. А заменить несколько значений в коде (в котором, кстати, есть все пояснения) не составит труда даже новичку.
    3. Если вы продвинутый пользователь и не впервые слышите слово «php», то при желании что-то изменить (будь то внешний вид или что-то еще) это ни составит никакого труда – код простой, понятный и лаконичный.
    4. При написании кода, его автор kama использовал те же css стили, что и использует плагин Pagenavi, так что вам даже не придется заново все оформлять.
    5. Ну и последний пункт, самый важный, ради которого все и затевалось – будут нормальные ссылки на первую страницу, не возникнет никаких дублей и лишних редиректов.

    Меньше слов, больше дела – рассмотрим код и что с ним делать.

    Открываем в админке «Внешний вид -> Редактор» и выбираем Функции темы (functions.php). В самое начало этого файла вставляем следующий код:

    /*** Альтернатива wp_pagenavi (без лишних обращений к данным) ***/function kama_pagenavi($before=”, $after=”, $echo=true) заменится текущей, а последней. Пример: ‘Страница из ‘ = Страница 4 из 60 $num_pages = 10; // сколько ссылок показывать $stepLink = 10; // после навигации ссылки с определенным шагом (значение = число (какой шаг) или ”, если не нужно показывать). Пример: 1,2,3. 10,20,30 $dotright_text = ‘…’; // промежуточный текст “до”. $dotright_text2 = ‘…’; // промежуточный текст “после”. $backtext = ‘«’; // текст “перейти на предыдущую страницу”. Ставим ”, если эта ссылка не нужна. $nexttext = ‘»’; // текст “перейти на следующую страницу”. Ставим ”, если эта ссылка не нужна. $first_page_text = ”; // текст “к первой странице” или ставим ”, если вместо текста нужно показать номер страницы. $last_page_text = ”; // текст “к последней странице” или пишем ”, если вместо текста нужно показать номер страницы. /* ================ Конец Настроек ================ */global $wp_query; $posts_per_page = (int) $wp_query->query_vars[posts_per_page]; $paged = (int) $wp_query->query_vars[paged]; $max_page = $wp_query->max_num_pages;if($max_page $max_page) < $start_page = $max_page - $pages_to_show_minus_1; $end_page = (int) $max_page; >if($start_page $text_num_page “,$paged,$max_page); >if ($start_page >= 2 && $pages_to_show ‘.$dotright_text.’ ‘; >if ($backtext && $paged!=1) $out.= ”.$backtext.”;for($i = $start_page; $i ‘.$i.’ ‘; > else < $out.= ''.$i.''; > >if ($nexttext && $paged!=$end_page) $out.= ”.$nexttext.”;//ссылки с шагом if ($stepLink && $end_page ‘.$dotright_text2.’ ‘; $out.= ”.$i.”; > > >if ($end_page ‘.$dotright_text2.’ ‘; $out.= ”. ($last_page_text?$last_page_text:$max_page) .”; >$out.= “

    Далее во всех файлах шаблона, в которых требуется добавить навигацию, необходимо в удобное место вставить:

    Если вы затрудняетесь с тем куда это надо вставлять, просто ищите что-то подобное:

    И заменяйте на указанную выше строку.

    Вот и все готово, друзья!

    Теперь остается открыть файл /wp-content/plugins/wp-pagenavi/pagenavi-css.css скопировать оттуда весь код и вставить его в свой css файл (обычно это style.css и лежит в папке с вашей темой оформления).

    Ну и последний шаг – деактивируем плагин WP-Pagenavi в админке и удаляем полностью его папку с сервера 😉

    PS Ради интереса проверил первые пришедшие в голову блоги – на всех имеется такая проблема, решение которой я описал 🙂

    Удачи вам, друзья, и помните – в SEO не бывает мелочей!

    Задавайте вопросы, комментируйте. До связи.

    Постраничная навигация в WordPress с плагином WP-PageNavi

    Испробовав несколько способов установки постраничной навигации на сайт WordPress, я сделал выбор в пользу плагина WP-PageNavi .

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

    Эта другая система может быть установлена с применением нескольких вариантов. Одним из них является использование плагинов. В этой статье рассмотрим плагин WP-PageNavi .

    Установка плагина

    Установить плагин можно как из админ-панели, так и загрузив с официального сайта WordPress. Процедура установки обычная.

    После установки активируйте плагин. Но, это ещё не всё. Просто так плагин работать не будет. Нужно сделать некоторые изменения и дополнения.

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

    Элементы постраничной навигации обычно выводятся на страницах с рубриками , метками и архивами . Поэтому, в зависимости от используемой темы, это могут быть файлы:

    Примечание : в некоторых темах могут наблюдаться небольшие отличия в плане присутствия именно этих перечисленных мною файлов. Например, в темах, которые я тестировал (Cardio и Inventor), есть файл category.php, а в остальных — нет. В итоге, вам нужно выбрать файлы, отвечающие за вывод категорий , меток , архивов и страниц поиска .

    Помимо этих файлов, может быть задействован так же файл style.css , если Вы планируете прописывать собственные стили.

    Все вышеперечисленные файлы находятся в папке вашей темы по адресу:
    ваш сайт/wp-content/themes/название активной темы/

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

    Главная задача и определенная сложность её выполнения заключается в поиске кода, который нужно заменить. Нам нужно найти вызов

    в большинстве современных тем или

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

    Откройте эти файлы в Notepad++ и найдите строки с кодом прежней навигации, визуально или используя поиск.

    Штатный код вывода навигации может иметь примерно такой вид:

    А в большинстве тем WordPress бывает такой:

    В более ранних темах коды могут выглядеть так:

    Далее нужно заменить прежний код на следующий:

    Замену кода нужно сделать во всех файлах. После загрузки (замены) файлов, при открытии страниц с рубриками, метками или архивами, в результате Вы получите примерно такую картину:

    В общем неплохо. Если такой вариант Вас устраивает, можно его оставить и использовать.

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

    Если Вы решили применить эти стили, то в настройках плагина отключите штатные стили:

    После внесения корректив картинка изменится:

    Мне, к примеру, такой вариант нравится больше.

    Можно пойти дальше и вставить изображения стрелочек вместо кавычек ( « » ). Изображения стрелочек можно скачать любые, по поисковому запросу, загрузить их в корневую папку images и в настройках плагина вставить код вывода изображений этих стрелок в поля Предыдущая страница и Следующая страница :

    Код вставки изображения обычный:

    После этого навигация примет следующий окончательный внешний вид:

    Настройки плагина WP-PageNavi

    Перейдите в Панель администратора → Настройки → WP-PageNavi .

    1. В первой строке Шаблон общего списка страниц формируется начальная часть конструкции, а именно запись, например, « Страница 3 из 5»:

    Здесь можно сократить слово « Страница» до « Стр» ., заменить на другое слово или вовсе удалить. Если, к примеру, удалить участок « из %TOTAL_PAGES%» (общее количество страниц), то запись будет иметь вид — « Страница 3» . Но, мне кажется, что самый оптимальный вариант — оставить здесь все по умолчанию.

    2. Вторая и третья строки формируют номера страниц. Здесь ничего не нужно менять:

    3. Две последующие строки:

    выводят надписи ( Начало и Последняя ) в навигационной конструкции, но только в случае, когда количество страниц для показа будет превышать заданное в настройках:

    В данном случае я выставил в строке Количество страниц для показа значение 3:

    4. В строках Элемент Предыдущая страница и Следующая страница нужно вставить изображение, указывающее направление перехода. По умолчанию — это кавычки. В моем варианте — коды вставки изображений стрелочек:

    5. В строках Элемент «Предыдущие» и «Следующие»

    проставьте соответствующие символы в зависимости от широты вашей фантазии.

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

    Единственное, хочется сказать, что в строке Всегда показывать список страниц лучше выбрать вариант Нет . Согласитесь, в случае малого количества страниц, такая конструкция выглядит «не айс»:

    После окончания процедуры настроек не забудьте сохранить изменения.

    PS. Под занавес хочется задать следующий вопрос:
    — А как же быть с отдельными записями? Распространяется ли на них влияние плагина?
    — Нет, не распространяется!
    Файл типа single.php остается без изменений, хотя в нем тоже есть идентичный код. В конце каждой записи (в зависимости от используемой темы) выводится своеобразная, неплохая навигация, например, такая:

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

    WordPress.org

    WP-PageNavi

    Want to replace the old ← Older posts | Newer posts → links with some page links?

    This plugin provides the wp_pagenavi() template tag which generates fancy pagination links.

    Применение

    In your theme, you need to find calls to next_posts_link() and previous_posts_link() and replace them.

    In the Twentyten theme, it looks like this:

    You would replace those two lines with this:

    For multipart pages, you would look for code like this:

    and replace it with this:

    Go to WP-Admin -> Settings -> PageNavi for configuration.

    Changing the CSS

    If you need to configure the CSS style of WP-PageNavi, you can copy the pagenavi-css.css file from the plugin directory to your theme’s directory and make your modifications there. This way, you won’t lose your changes when you update the plugin.

    Alternatively, you can uncheck the «Use pagenavi.css?» option from the settings page and add the styles to your theme’s style.css file directly.

    Changing Class Names

    There are filters that can be used to change the default class names that are assigned to page navigation elements.

    • wp_pagenavi_class_pages
    • wp_pagenavi_class_first
    • wp_pagenavi_class_previouspostslink
    • wp_pagenavi_class_extend
    • wp_pagenavi_class_smaller
    • wp_pagenavi_class_page
    • wp_pagenavi_class_current
    • wp_pagenavi_class_larger
    • wp_pagenavi_class_nextpostslink
    • wp_pagenavi_class_last

    Пример использования фильтров

    Статус создания

    Разработка

    Благодарности

    • Plugin icon by SimpleIcon from Flaticon

    I spent most of my free time creating, updating, maintaining and supporting these plugins, if you really love my plugins and could spare me a couple of bucks, I will really appreciate it. If not feel free to use it without any obligations.

    • With Custom Styling
    • Admin – Options Page

    Часто задаваемые вопросы

    Make sure your host is running PHP 5. The only foolproof way to do this is to add this line to wp-config.php (after the opening tag):

    When I go to page 2, I see the same posts as on page 1!

    Does PageNavi work with secondary WP_Query instances?

    How do I ignore the options page?

    If you are running a multi-language plugin, you will probably want to ignore the strings in the options page.

    Урок 26 Плагин WP-PageNavi, постраничная навигация, установка и настройка WP-PageNavi

    Всем привет на Prosmo3.ru . Отличное настроение, на улице просто чудесно, я готов зарабатывать миллионы, а вы? Я больше чем уверен, что этот вид заработка создан для меня, я уже чувствую запах денег, и запах этот становится все ближе и ближе. Сейчас вот подумал, когда я буду делать по 500к в месяц, интересно будет почитать эти посты самому, за рюмочкой коньяка, ну а пока надо постоянно работать, постоянно работать над своими сайтами и над собой, не расслабляться ни на минуту, как говорится, расслабляться будем потом!

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

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

    Вообще не понимаю почему некоторые вебмастера оставляют такую вот постраничную навигацию, которая ну никак не вписывается в нормальное понятие юзабилити.

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

    Используя плагин WP-PageNavi мы не только улучшим юзабилити и установим постраничную навигацию, в дальнейшем мы от этого только выиграем, а когда мы выигрываем мы зарабатываем!

    Как видите моя постраничная навигация осуществлена с помощью php кода в самом шаблоне, и выглядит без плагина WP-PageNavi вот так:

    Я сам по себе не программист, и в принципе далек от этого, понимаю все поверхностно, поэтому код постраничной навигации php мне не сделать самостоятельно, но если бы у меня не было постраничной навигации, то я бы конечно воспользовался плагином WP-PageNavi, и если у вас шаблон самый простой то и вы пользуйтесь планом WP-PageNavi и все у вас, и посетителей, будет хорошо.

    Установка и настройка плагина постраничной навигации WP-PageNavi

    Чтобы скачать плагин WP-PageNavi, воспользуемся ссылкой установить WP-PageNavi. Как вы помните установка плагина не носит в себе ничего сверхъестественного, если вы забыли то прошу сюда : плагины на WordPress, установка и настройка.

    Отлично, как здорово, что мы работаем с хостингом Beget и там встроенный ftp, нам вообще не надо заморачиваться с установкой различных плагинов, да с самой панели WordPress мы можем легко установить такие плагины, как WP-PageNavi.

    После установки плагина, которая занимает какие то секунды, мы его активируем, для того чтобы он появился в меню параметры, админ панели Вордпресс. Что ж приступим к настройке. Кстати на моем шаблоне нельзя установить плагин постраничной навигации WP-PageNavi, почему то внутренний код его блокирует, наверное сделано чтобы новички не косячили визуальное отображение блога).

    Заходим в админку и выбираем в меню Параметры –> Список страниц, В шаблоне общего списка страниц мы видим как задается изображение странички и общих страниц постраничной навигации плагина WP-PageNavi. По своему усмотрению можете что то добавить, допустим какие то надписи перед кодами выделенными так: % код %. Как вариант:

    Элемент “текущая страница” и “страница” плагина WP-PageNavi, оставляйте как есть, там вроде нечего придумывать. В полях “элемент первая страница” и “элемент последняя страница” задается название кнопок, при нажатии которых, вы будете перенесены в начало или конец всех записей.

    В “последнюю страницу” вы можете вставить код вызова всех страниц %TOTAL_PAGES%, в результате вы получите вместо надписи кнопку с общим количеством страниц. Смотрите сами если вам это удобно можете сделать так.

    Ну или можете пофантазировать с различными словами и терминами” и придумать что то нестандартное в постраничной навигации, средствами плагина WP-PageNavi. (Офтоп: не успеваете вовремя, читайте эту статью.)

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

    Переходим к настройке списка страниц плагина WP-PageNavi, галочка использовать стиль pagenavi-css.css , позволит вам задать внешность кнопок, предусмотренную разработчиками плагина.

    Если у вас есть желание изменить оформление на свой вкус, то достаточно зайти в файловый менеджер хостинга Beget и найти файл pagenavi-css.css, в папке с вашей темой, (можете воспользоваться поиском и найти папку WP-PageNavi) и дальше просто поменяйте его на свой вкус, все просто и понятно.

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

    Если поставить галочку в поле Всегда показывать список страниц, то даже если у вас будет недостаточно постов на сайте, плагин покажет ваше местонахождение в виде цифры 1 на кнопке постраничной навигации.

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

    Команда вывода постраничной навигации плагина WP-PageNavi

    Для того чтобы плагин WP-PageNavi начал правильно работать, вам необходимо вставить код для вывода постраничной навигации. Вставить его надо будет в index.php, а также в Arhive.php и Search.php, для этого в этих файлах вы должны найти код отвечающий за вывод постраничной навигации. Приблизительно он будет находится между таких комментариев:

    Вам необходимо будет скопировать ниже приведенный код и заменить код находящийся в комментариях

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

    , но при удалении плагина WP-PageNavi вам придется или копировать старый код и вставлять вместо этого кода, или обходиться без постраничной навигации совсем. Надеюсь я достаточно подробно рассказал про постраничную навигацию посредством плагина WP-PageNavi. Хорошего дня и отличного настроения!

    Сайт с нуля

    Создание сайта. Продвижение сайта. Заработок на сайте.

    Настройка WP Pagenavi для новигации в WordPress

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

    Как работает плагин wp pagenavi

    Многие скажут что вордрпесс обладает стандартными инструментами организации пагинации, зачем же тогда необходимо использовать для этих целей ещё и специальный плагин, которым является wp pagenavi?

    Это конечно так, у вордпресс есть встроенные механизмы создания пагинации, однако, они весьма ограничены в плане своего внешнего вида, в то время как wp pagenavi предлагает куда более широкие возможности.

    Таким образом, если вы желаете получить более функциональную пагинацию, вам следует воспользоваться именно плагином wp pagenavi.

    Установка и активация плагина wp-pagenavi

    Чтобы воспользоваться плагином wp pagenavi вам первоначально необходимо его скачать. Сделать это всегда можно на сайте wordpress.org. Необходимо зайти на страницу плагина, которая находится по адресу wordpress.org/plugins/wp-pagenavi/, после чего кликнуть по кнопке Download. После этого нужно выбрать место для сохранения архива с плагином на вашем компьютере.

    После того как вы скачаете плагин к себе на компьютер его необходимо выгрузить их архива в раздел сайта на хостинге wp-content/plugins/. Сделать это можно получив доступ к нужному вам сайту по ФТП, для этого можно использовать какой-либо ФТП-менеджер.

    Если вы выполните всё написанное выше, то плагин окажется у вас на сайте, но чтобы он начал работать его необходимо активировать. Для активации плагина необходимо зайти в админку вашего сайта, после чего перейти в категорию Плагины. В этой категории нужно найти плагин wp pagenavi и просто активировать его.

    Настройки плагина wp-pagenavi

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

    Чтобы попасть в настройки wp pagenavi необходимо зайти в админку сайта, после чего выбрать категорию параметры, а уже в самих параметрах выбрать пункт список страниц. После выполнения этих действий перед вами должно открыться окно Шаблоны списка страниц, в котором и можно выполнить все основные настройки этого плагина.

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

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

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

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

    Что касательно четвёртой и пятой строки то здесь вы можете изменить вывод крайних кнопок. В стандартном случае на них будет написано Первая и Последняя, однако, вы всегда можете прописать там например В Начало и В Конец.

    Также можно изменить элемент Предыдущая страница и элемент Следующая страница, вместо стандартных птичек > вы всегда можете поставить то что вам больше нравится.

    Это далеко не все настройки, так как имеется ещё лист настроек Настройки списка страниц, который выглядит следующим образом:

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

    Строка стиль списка страницы отвечает за то как страницы будут отображены на сайте. В большинстве случаев лучше оставить обычный стиль, так как он самый удобный из всех.

    Строка количество страниц для показа отвечает за то количество страниц, которые будут показаны в форме навигации.

    Графа диапазон страниц для показа отлично описана в самих настройках, лучше всего им пользоваться в том случае, если на вашем сайте много страниц.

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

    Вот собственно из всё, таким вот образом при помощи плагина wp-pagenavi можно организовать удобную и красивую пагинацию на вашем сайте.

    Ссылка на основную публикацию