WordPress wp pagenavi: WP-PageNavi — Плагин для WordPress

Три плагина постраничной навигации на WordPress

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

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

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

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

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

Содержание

• 1 WordPress-Seo-Pager
• 2 WP Page Numbers
• 3 WP-PageNavi

WordPress-Seo-Pager

Это очень простой плагин, обладающий минимальным количеством настроек. Кроме того, он полностью бесплатный. Установка происходит стандартным способом. Все настройки располагаются по следующему пути — «Параметры» — «SEO pager». После непосредственной активации через админку плагин уже будет работать. Нужно лишь подкорректировать основной цвет навигационных кнопок и цвет кнопок, который отображается в момент нажатия. Это нужно для того, чтобы подогнать их под дизайн сайта.

WP Page Numbers

Здесь все будет несколько сложнее. Плагин также является бесплатным и устанавливается стандартным способом. Однако вам придется удалить некоторые конструкции в файлах шаблона блога (next_posts_link, а также previous_posts_link). Эти конструкции создают стандартную навигацию между страницами. Вместо них нужно поставить собственный код плагина, который следует скопировать из настроек. Далее вы выбираете один из пяти вариантов внешнего оформления навигации (выбирайте то, что больше подойдет под дизайн блога). Кроме того, покопавшись в файлах CSS (при наличии соответствующих знаний), вы сможете поменять размеры кнопок, рамки, фоновые цвета и ряд других параметров.

WP-PageNavi

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

Как правило, они начинаются со следующей конструкции —

<div class=»navigation«>

Вместо них нужно вставить код плагина. Далее нас интересует файл под названием pagenavi-css.css. Он располагается в папке с установленным плагином. Здесь можно отредактировать стили CSS будущей навигации (поменять рамки, шрифты, фоновые цвета и т.д.).

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

Поделитесь со своими друзьями:

wp-pagenavi адаптивная навигация в wordpress

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

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

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

Как видно из картинки все плывет, так как попросту не влазит на экране. Давайте это поправим и оставим только важные кнопки.

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

В открытый файл и добавьте стили:

wp-pagenavi responsive navigation

@media (max-width: 800px) { .wp-pagenavi .page { display: none; } }

@media (max-width: 800px) {     . wp-pagenavi .page {         display: none;     } }

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

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

wp navigation responsive — hide buttons

@media (max-width: 800px) { .wp-pagenavi .page, .wp-pagenavi .last, .wp-pagenavi .first { display: none; } }

1 2 3 4 5 6 7

@media (max-width: 800px) {     .wp-pagenavi .page,     .wp-pagenavi .last,     .wp-pagenavi .first {         display: none;     } }

Вот что получилось:

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

/*

Услуги репетитора онлайн. Список курсов которые я веду

• Базовый курс по веб-дизайну;
• Верстка сайтов;
• Общий курс по CMS WordPress и продолжение курса по разработке шаблонов;
• Разработка сайтов на PHP.

Подробнее читайте на странице репетитор по WordPress

*/

Styles For WP Pagenavi Addon — Улучшенный дизайн для разбивки на страницы сообщений для WordPress

Styles For WP Pagenavi Addon — Улучшенный дизайн для разбиения на страницы сообщений для WordPress on – Лучший дизайн для разбиение на страницы

Быстрый и простой

Найдите лучшие плагины для WordPress

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

Testimonial

Testimonial плагины для WordPress

Галереи

Галереи плагины для WordPress

SEO

SEO плагины для WordPress

Контактная форма

9 0004 Плагины контактных форм для WordPress

Формы

Плагины форм для WordPress

Социальные сети Feeds

Плагины социальных лент для WordPress

Social Sharing

Плагины Social Sharing для WordPress

Календарь событий

Плагины календаря событий для WordPress

Слайдеры

Плагины слайдеров для WordPress

Аналитика

Аналитические плагины для WordPress

Обзоры

Обзоры плагинов для WordPress

Комментарии

Плагины комментариев для WordPress

Портфолио

Плагины портфолио для WordPress

Карты

Плагины Карт для WordPress

Безопасность

Плагины безопасности для WordPress

Перевод

Плагины перевода для WordPress

Реклама

Плагины рекламы для WordPress

Видеоплеер

Плагины видеоплеера для WordPress

Музыкальный проигрыватель

Плагины музыкального проигрывателя для WordPress

Backup

Плагины резервного копирования для WordPress

Конфиденциальность

Плагины конфиденциальности для WordPress

Оптимизация

Плагины оптимизации для WordPress

Чат

Плагины чата для WordPress

Обратный отсчет

Плагины обратного отсчета для WordPress

Маркетинг по электронной почте

Плагины для маркетинга по электронной почте для WordPress

Вкладки

Плагины для вкладок для WordPress

Членство

9 0004 Плагины членства для WordPress

всплывающие окна

всплывающие плагины для WordPress

Карта сайта

Плагины SiteMap для WordPress

Оплата

Платежные плагины для WordPress

Скоро

Скоро появятся плагины для WordPress

Электронная торговля

Плагины электронной коммерции для WordPress

Служба поддержки

Плагины службы поддержки для WordPress

Инвентаризация

Инвентаризация плагинов для WordPress

Видеоплеер

9 0004 Плагины видеоплеера для WordPress

Testimonials

Плагины Testimonials для WordPress

Tabs

Плагины Tabs для WordPress

Social Sharing

Плагины Social Sharing для WordPress

Social Feeds

Social Feeds plugins for WordPress

Slider

Slider plugins for WordPress

Reviews

Reviews plugins for WordPress

Portfolio 9001 9

Плагины портфолио для WordPress

Членство

Плагины членства для WordPress

Формы

Плагины форм для WordPress

Календарь событий

Плагины календаря событий для WordPress

Контакты

Плагины контактов для WordPress

Комментарии

Плагины комментариев для WordPress

Analytics

Плагины Analytics для WordPress

Common Ninja Apps

Одни из лучших плагинов Common Ninja для WordPress 9001 5

Просмотрите нашу обширную коллекцию совместимых плагинов и легко встраивайте их на любой веб-сайт, блог, интернет-магазин, платформу электронной коммерции или конструктор сайтов.

Форма обратной связи

Собирайте ценные отзывы без усилий

Значок отзывов

Повысьте доверие, улучшите SEO и увеличьте количество конверсий

Всплывающее окно «Что нового»

Информируйте пользователей и улучшайте их опыт

Форма петиции

Собирайте подписи и вносите изменения без усилий 90 003

Карточки меню ресторана

Повышение конверсии с помощью карточек меню ресторана

Обзоры Yelp

Повышение доверия и повышение доверия для увеличения продаж

Список меню ресторана

Увеличьте конверсию с помощью списка меню ресторана

Видеогалерея

Демонстрируйте видео, улучшите дизайн и увеличьте конверсию

Amazon Reviews

Повысьте доверие и улучшите доверие для увеличения продаж

Кнопка оплаты

Упростите процесс оформления заказа и увеличьте Продажи

Форма поддержки

Оптимизируйте поддержку клиентов с легкостью

Обратный отсчет

Повышайте вовлеченность, повышайте конверсию и привлекайте посетителей

Другие плагины

Плагины, которые могут вам понравиться

Откройте для себя приложения по платформам

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

Она предоставляет вам бизнес-инструменты, необходимые вашему сайту!

Стили для надстройки WP Pagenavi

Версия: 1.2.1

Добавляет дополнительные параметры стиля в плагин Wp-PageNavi WordPress ИЛИ функцию навигации WordPress the_posts_pagination().

Общий рейтинг

Рейтинг WordPress

Хотите написать отзыв?

Вы автор этого плагина? Хотите написать более подробный отзыв?

Отправить отзыв

У плагина есть проблемы

Извините, приятель! Плагин не смог пройти все наши тесты. Никаких обид, верно?

Тесты, выполненные тестовым скриптом WP Hive Результаты

• Минимальное влияние на использование памяти Использование памяти этим плагином меньше, чем среднее использование памяти другими плагинами на WordPress.org + 200 КБ. Проверьте часто задаваемые вопросы для получения дополнительной информации.

• Минимальное влияние на скорость страницы Влияние этого плагина на PageSpeed ​​меньше, чем среднее влияние других плагинов на WordPress. org + 1000 миллисекунд

• Нет ошибок PHP, предупреждений, уведомлений Автоматический тест WP Hive не обнаружил ошибок PHP при активации этого плагина на нашем сервере

• Нет проблем с Javascript Автоматический тест WP Hive не обнаружил ошибок JavaScrip при активации этого плагина на нашем сервере

  .

• Последняя версия PHP 7.4.8, совместимая Автоматический тест WP Hive обнаружил, что плагин полностью совместим с последней версией PHP

  .

• Последняя версия WordPress 5.9, совместимая Автоматический тест WP Hive обнаружил, что плагин полностью совместим с последней версией WordPress 9.0003

• Оптимизированный размер базы данных Плагин создает менее 50 таблиц базы данных

• Нет ошибок активации Автоматический тест WP Hive не обнаружил ошибки активации при активации этого плагина на нашем сервере

• Нет ошибок ресурсов Автоматический тест WP Hive не обнаружил ошибок ресурсов при проверке этого плагина на нашем сервере

  .

• Часто обновляется Плагин не обновлялся хотя бы раз за последние 90 дней

Скачать плагин Сайт плагина

О стилях для WP Pagenavi Addon

Производительность

Скорость страницы

• Среднее время загрузки страницы увеличилось на 0 с
• Это быстрее, чем 99% плагинов

Эталонный тест скорости Узнайте больше о том, как мы собираем данные

• Перед активацией плагина
• После активации плагина

Страниц

Контрольный показатель

Изменение

Среднее изменение

— 0 с

/(главная страница)

— 0,06 с

/wp-admin/edit-comments.php

— 0 с 90 003

/wp-admin/edit-теги. php?taxonomy=category

— 0,01 с

/wp-admin/edit.php

+ 0,02 с

/wp-admin/index.php

— 0,11 с

9000 4 /wp-admin/медиа-новый . php

— 0,04 с

/wp-admin/options-discussion.php

+ 0,12 с

/wp-admin/options-writing.php

— 0,14 с

/wp-admin/post-new.php

+ 0,19 с

/wp-admin/ постновый. php?post_type=page

+ 0,1 с

/wp-admin/upload.php

— 0,04 с

Больше Меньше

Тест использования памяти Узнайте больше о том, как мы собираем данные

• Перед активацией плагина
• После активации плагина

Страниц

Контрольный показатель

Изменение

Среднее изменение

+ 25,66 КБ

/ (главная страница)

+ 2,2 КБ

/wp-admin/edit-comments.php

+ 2. 91 КБ

/wp-admin/edit- tags.php?taxonomy=category

+ 4,04 КБ

/wp-admin/edit.php

+ 2,96 КБ

/wp-admin/index.php

+ 3,05 КБ

9 0004 /wp-admin/медиа -new.php

+ 3,93 КБ

/wp-admin/options-discussion. php

+ 3,97 КБ

/wp-admin/options-writing.php

+ 1,89 КБ

/wp-admin/post-new.php

+ 3,49 КБ

/wp-admin/ постновый. php?post_type=page

+ 2,94 КБ

/wp-admin/upload.php

+ 3,91 КБ

Больше Меньше

Пользователь R Оценка стилей для аддона WP Pagenavi от пользователей WP Hive

Оценить Сейчас

Статистика

Подробнее

Таблицы базы данных

Плагин добавил 0 дополнительных опций в ваш WordPress.

WP-Options

Плагин добавил 0 дополнительных опций на ваш сайт WordPress.

Ошибки

Подробнее о том, как WP Hive определяет эти данные.

Покажите свой плагин

PHP 7.4.8

Работает на WP Hive

WP 5.9

Работает на WP Hive

PHP 7.4.8 РП 5.9

Нравится использовать этот плагин?

Почему бы вам не сравнить плагин
с другим плагином

Начать сравнение

Рейтинги и обзоры

Общее качество

5

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

5

Качество поддержки

5

Соотношение цены и качества

5

Характеристики

5

Нравится то, что вы видите?

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