Svarognn.ru

Навигация по записям

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) и в самый низ вставьте етот код:

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

Делаем навигацию в WordPress без использования плагина

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

Корректируем стандарты

По умолчанию в WordPress на странице самой записи ( single.php ) присутствуют ссылки Следующая страница и Предыдущая страница , они ведут на записи сортированные по дате и не учитывают разбивку на рубрики и метки. В шаблоне темы они обычно выводятся в блоке следующим образом:

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

Читать еще:  Казеин: что это такое, для чего он нужен и из чего его делают

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

Пишем функцию

С навигацией на странице записи разобрались, а у нас же еще есть главная страница, страница архивов и страница категорий! Что с ними делать? На них выводится определенное количество записей (задаем в панели управления — настройки — чтение) и под ними ссылки Вперед и Назад ведущие на предыдущие или следующие записи этой рубрики. Именно с этими ссылками нам предстоит разобраться, а точнее сделать их эффективными, то есть разбить на страницы, пронумеровать их и вывести в нужном месте категории, рубрики или на главной странице ( index.php, archive.php, category.php ).

Поехали, открываем файл functions.php темы которую Вы используете и в самый конец вставляете следующую функцию (пошаговое объяснение следует далее):

Для вызова функции в шаблоне нужно пользоваться следующим кодом:

Давайте разберем что произошло. Функция kriesi_pagination() содержит два аргумента, причем каждый из них имеет значение по умолчанию:

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

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

Например, при использовании диапазона по умолчанию (2), если вы находитесь на первой странице, скрипт выводит ссылки на две страницы 2 и 3 , а если Вы перешли к примеру на 6 страничку то скрипт будет отображать две ссылки назад 4 и 5, две ссылки вперед 7 и 8, одинарные стрелочки (на предыдущую и следующую страницу) и двойные стрелки (на первую страницу и на последнюю).

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

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

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

Помимо наших логических и арифметических действий, нам также понадобилась функция WordPress get_pagenum_link() , которая возвращает URL страницы WordPress, соответствующей переданному номеру: get_pagenum_link(2) вернет ссылку на страницу 2 блога.

Далее определяем какие ссылки нужно выводить для нумерации страниц, на основе нескольких условных выражений if и циклов.

HTML & CSS

Функция формирует элементарный HTML код:

Придадим ему стилей:

Пользовательские циклы

А помните в самом начале когда мы только начали разбирать функцию планировалось рассмотреть ее применение в пользовательских циклах, возможно если Вы их используете для вывода своих записей, то Вам пригодится следующая информация: «Результат пользовательского цикла не сохраняется в глобальной переменной $wp_query , которую мы использовали для получения количества страниц»

Поэтому в таком случае нужно использовать функцию kriesi_pagination() с указанием первого аргумента.

Допустим Вы используете на своем сайте простой пользовательский цикл

и после него Вы можете тут же вызвать нашу функцию используя следующий код:

Вот и все, можете посетить сайт автора этой волшебной функции: www.kriesi.at.

Заключение

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

Желаю Вам простого внедрения Вашей новой функции и навыков!

WordPress.org

Русский

Поддержка → Проблемы и решения → как отключить навигацию по записям?

как отключить навигацию по записям?

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

где тот скрипт, который отвечает за вывод навигаций?

За вывод на фронт-энд отвечают шаблоны активной Темы.

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

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

Читать еще:  «умные» часы canyon cns-sw72bb

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

Ну а если вам не нравится главное меню его конечно тоже можно убрать. Но это будет нонсенс…

И в конце концов может быть вы уже покажете свой «секретный» сайт, по которому постоянно задаете вопросы?

P.S. В чем заключается Ваш критерий

  • Ответ изменён 1 год, 2 месяца назад пользователем O .
  • Ответ изменён 1 год, 2 месяца назад пользователем O .
  • Ответ изменён 1 год, 2 месяца назад пользователем O .
  • Ответ изменён 1 год, 2 месяца назад пользователем O .

Так в том-то и дело, что там нет таких настроек. Я решил сильно не заморачиваться, а просто через CSS закрасить кнопки под цвет фона сайта (теперь их просто не видно). Да, решение не правильное, но даже если кто и найдет кнопку, то Я не вижу ничего такого
страшного не вижу.

Так в том-то и дело, что там нет таких настроек. Я решил сильно не заморачиваться, а просто через CSS закрасить кнопки

Мы в конце концов увидим сайт, которому нужна помощь?!
Это для чего по-Вашему? http://joxi.ru/82QBEwgijxNdJA

  • Ответ изменён 1 год, 2 месяца назад пользователем O .

Spectrum, не лень ли вам было писать «поэму» для меня, выбирая, что же больше мне не нравится?

И в конце концов может быть вы уже покажете свой «секретный» сайт, по которому постоянно задаете вопросы?

Доступ к сайту ограничен, только зарегистрированные пользователи могут выполнять какие-то действия и просматривать контент. Эти Юзеры — предприятия. Создавать заведомо ложный профиль лишь для ваших очей у меня нет смысла, т.к я на 100% уверен, что никто так и не решит проблем, который на данный момент только 1 (топик с кнопкой)

я на 100% уверен, что никто так и не решит проблем

Зачем вы пришли на форум со своей кнопкой?
Ну да ладно. У каждого свои причуды. Удачи вам.

Постраничная навигация WordPress с помощью the_posts_pagination()

  • 2020-03-15
    • 18
    • Июля
      2016

Доброго времени суток

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

Еще 18 декабря 2015 вышла новая версия WordPress. Версия 4.1 включала в себя несколько новых функций одна из которых как раз и есть нужная нам – the_posts_pagination(). Разработчики WordPress побеспокоились о нас с вами и добавили такую замечательную функцию. Теперь Вы можете не устанавливать плагины типа WP-PageNavi или использовать код на подобии того, что я показывал в статье – Постраничная навигация в WordPress без плагина.

Чтобы вывести навигацию, Вам просто нужно добавить вызов функции в нужное место на странице и все. Делать это нужно в файлы, где выводится цикл. Например, в index.php, archive.php, category.php, search.php и тд. Вам нужно найти цикл, он выглядит примерно так:

Дале Вам нужно после endwhile; добавить нашу функцию the_posts_pagination(). В итоге у Вас получится:

Так же, если у Вас там есть вызов плагина wp_pagenavi() или самописного кода wp_corenavi();, можете удалить их. теперь они ни к чему. Их работу выполнит наша новая функция the_posts_pagination(). В результате у Вас внизу страницы должно появится вот такое поле с постраничной навигацией.

Если посмотреть на данную навигацию со стороны кода, HTML кода, который сгенерируется на странице, то он будет выглядеть примерно так:

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

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

Данная функция имеет несколько настроек, которые помогут Вам немного настроить пагинацию, если конечно это нужно. Я напишу все настройки сразу, а Вы при желании ненужные строки просто удалите. То есть данный код вставляется в то же место где Вы просто вставляли the_posts_pagination();

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

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

  • ‘show_all’ => false, – Показывать или нет все страницы которые есть на сайте. По умолчанию нет, потому как если их много будет что-то страшное
  • ‘end_size’ => 2, – Количество страниц которые будут показаны в начале и в конце. Например, если в по умолчанию в начале и в конце по 1 цифре выглядит это так 1..6,7,8..99 и все. В данном примере мы установили значение 2. Значит у нас получится – 1,2..6,7,8..98,99. То есть чем больше значение, тем больше доступных в начале и конце.
  • ‘mid_size’ => 2, – Количество страниц вокруг текущей страницы. По умолчанию 1, значит у нас получится 1..6,7,8..99 – текущая страница – 7, по бокам по одной странице. В данном примере установлено 2 и станет вот так – 1..5,6,7,8,9..99. Текущая тоже сем и по бокам по две доступные страницы.
  • ‘prev_next’ => true, – Указывает нужно ли выводить кнопки по бокам, для переключения вперед или назад. То есть – предыдущая/следующая страница.
  • ‘prev_text’ => ‘«’, – То что будет в кнопке назад. Можете написать текст, символ или добавить иконку, используя статью – Иконки из шрифта Font Awesome
  • ‘next_text’ => ‘»’, – То же самое, только кнопка назад.
  • ‘add_args’ => false, – Массив аргументов (переменных запроса), которые нужно добавить к ссылкам.
  • ‘add_fragment’ => ”, – В скобках можно добавить текст, который добавится к ссылкам. Пагинация продолжит работать без сбоев. Например, у Вас ссылка на третью страницу http://localhost/?paged=3, если Вы добавите в скобки слово page, то ссылка станет такой – http://localhost/?paged=3page.
  • ‘before_page_number’ => ‘страница’, – Данный текст выведется перед каждым номером страницы. Например – страница1, страница2 и тд. Пример можно посмотреть
  • ‘after_page_number’ => ‘!’, – Этот текст выведется после номера страницы. На скриншоте выше это видно. В данном примере это просто знак восклицания.
  • ‘screen_reader_text’ => ‘Смотреть другие страницы’, – Текст над пагинацией. По умолчанию это – Навигация по записям , но если вы в скобки введете свой текст, например как в примере – Смотреть другие страницы, то он заменит стандартный.

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

На этом все, спасибо за внимание.

Если Вам был полезным мой труд, можете поддержать сайт, обменяться со мной текстовыми ссылками или посмотреть рекламку, что займет 2 минуты 🙂

Как добавить постраничную навигацию на сайт WordPress

От автора

В добавлении постраничной навигации на сайт любой системы, есть, как плюсы (удобство для посетителя), так и минусы (появляются страницы с повторяющимися заголовками в тегах title). Чтобы добавить постраничную навигацию на сайт WordPress, а вернее, чтобы поменять стандартную навигацию (предыдущая страница – следующая страница) на порядковые кнопки постраничного листания, используем плагин WP-pagenavi.

Стандартная постраничная навигация WordPress

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

Функции, которые выводят стандартную навигацию: next_posts_link и previous_posts_link . Запомним их, они нам пригодятся.

Добавить постраничную навигацию на сайт WordPress поможет плагин WP-pagenavi

Чтобы изменить постраничную навигацию по блогу и добавить кнопки для выборочного листания, используем плагин WP-pagenavi. Страница плагина: https://wordpress.org/plugins/wp-pagenavi/installation/

Установить плагин можно тремя стандартными способами:

  1. Из консоли WP, воспользовавшись поиском по имени;
  2. Скачать плагин на его странице WordPress.org (ссылка внизу статьи);
  3. Или скачать плагин на его странице WordPress.org, распаковать архив и «залить» каталог плагина wp-pagenavi в папку /wp-content/plugins/ и активировать плагин из консоли блога.

Как запустить плагин WP-pagenavi

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

Примечание: Начиная делать изменения в файлах рабочей темы, сделайте резервную копию своего сайта и его базы данных. Если, что-то пойдет не так, можно будет откатиться на резервную копию.

Задача для активации wp-pagenavi, в следующем. Нужно найти в файлах рабочей темы функции next_posts_link и previous_posts_link и строки с ними заменить на:

Где и как искать функции next_posts_link и previous_posts_link

Как правило, функции next_posts_link и previous_posts_link можно найти в файлах темы: index, archive, functions . Сделать это можно в Редакторе из консоли блога.

добавить постраничную навигацию на сайт WordPress

Если поиск из консоли не приносит быстрых результатов, а попросту вы не видите эти функции, делаем следующее:

  • Через FTP соединение, копируем файлы рабочей темы к себе на компьютер.
  • Открываем все скачанные файлы в текстовом редакторе, например Notepadd++.
  • Далее, используем поиск редактора «Найти во всех файлах» ищем названия наших функций: next_posts_link и previous_posts_link .
  • Найдя их, заменяем на:

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

Как изменить внешний вид кнопок WP-pagenavi

  • По умолчанию, кнопки палагина с номерами страниц белые/серые. Рамки квадратные. Поменять внешний вид кнопок, можно в файле: pagenavi-css.css. Лежит этот файл в каталоге: wp-content/plugins/wp-pagenavi .

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

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