Плагин вордпресс навигация страниц в

Интернет помощник в сети

Seo блог, продвижение, оптимизация сайта и WordPress уроки

Постраничная навигация в WordPress, WP Page Numbers плагин нумерации страниц

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

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

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

Если, статей на блоге не большое количество, то оставить такую навигацию временно можно, но если количество записей на вашем блоге превышает 20 записей, а тем более 100, кстати это уже 113 пост, то найти нужную страницу будет сложновато.

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

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

Плагин называется WP Page Numbers. На мой взгляд, он очень удобен для новичков, а аналогом данного плагина является WP Page Navi.

Установка и настройка WordPress плагина WP Page Numbers

1. Скачиваем плагин WP Page Numbers от сюда, устанавливайте его к себе на блог и активируйте.

2. Далее в админке WordPress идем в Внешний вид -> Редактор и открываем следующие файлы темы: archive. php, categories. php, index. php, single. php, page. php, search. php намного лучше будет, если вы их будете редактировать в текстовом редакторе Notepad++. Нажимаем Ctrl + F и ищем в них следующий код:

У вас данный код может отличаться, поэтому скопируйте небольшой кусок кода, например, «новые записи». Замените данный код на этот:

3. Далее идем настраивать данный плагин Параметры ( или Настройки) ->Page Numbers и выбирайте какое оформление навигации вы желаете. Всего будет представлено пять видов, но, если они вам не подходят, то можно их подредактировать.

Мне больше всего понравился последний:

Также можно перевести плагин на русский:

И сохраните данные изменения.

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

Откройте ваш FTP клиент и перейдите в папку плагина wp-content/plugins/wp-page-numbers/название вида навигации ( его вы выбирали в 3-ем шаге).

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

А чтобы поменять цвет при наведении на цифру, откройте wp-page-numbers. css. И чтобы поменять цвет найдите строку #wp_page_numbers li a:hover background: в моем случае это 44 строка. Далее поставьте нужный вам код цвета, выбрать можно при помощи программ цветовых палитр. Например, можно поставить оранжевый цвет, как на картинке — #FAD93E.

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

WP-PageNavi — постраничная навигация для блога

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

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

  • Скачиваем плагин WP-PageNavi на русском языке с сайта wordpress. org
  • В админ панели Вашего блога, в меню слева выбирайте Плагины — Добавить новый. Далее переходите на вкладку Загрузка. Нажимаете Обзор. и указывайте путь к архиву с плагином на компьютере. После этого нажимайте Установить. После того, как плагин будет загружен, нажмите Активировать плагин.
  • Для отображения кнопок навигации под страницами, необходимо добавить следующий код:

  • Данный код добавляется в те файлы шаблона, которые отвечают за отображение страниц архива(arhive. php), поиска (search. php) и главной стараницы — index. php.

  • Раньше у Вас на сайте была установлена навигация в виде: Следующая страница, Предыдущая. Необходимо заменить код, который отвечает за отображение этой навигации. Откройте файл с кодом, например, arhive. php нажмите CTRL+F на клавиатуре и введите в поиск внизу фразу navigation.

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

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

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

    Здравствуйте, читатели блога FairHeart. ru! Стандартная Постраничная навигация WordPress сводится лишь к возможности переходить на следующую или возвращаться к предыдущей странице с анонсами статей. Никакой нумерации страниц визуально не видно — это неудобно. Исправить ситуацию можно с помощью плагина WP-PageNavi или его аналога WP Page Numbers. Третий плагин, который я сегодня рассмотрю, Number My Post Pages, позволяет представить информацию одной статьи постранично.

    Установка и настройка WP-PageNavi и стилей к нему

    2. Распакуйте и загрузите на сервер папку с файлами плагина в директорию wp-content/plugins, используя бесплатный ftp клиент FileZilla.

    3. Активируйте его, в списке плагинов он идет под именем «список страниц».

    4. Теперь необходимо заменить стандартный код для постраничной навигации в шаблонах index. php, archive. php и search. php темы WordPress на новый:

    Стандартный код постраничной навигации WordPress выглядит примерно так:

    От темы к теме вид кода может несколько меняться, поэтому ищите конструкцию, содержащую строчки next_posts_link и previous_posts_link.

    Как только замените код, плагин WP-PageNavi начнет работать. Все настройки плагина на русском языке и доступно расписаны, поэтому разобраться с ними не составит труда. Располагаются они в разделе «Плагины» — «список страниц».

    Чтобы настроить внешний вид, необходимо отредактировать файл со стилями плагина WP-PageNavi — wp-pagenavi/pagenavi-css. css. Для этого перейдите в раздел «Плагины» — «Редактор», выберете в качестве плагина для изменения WP-PageNavi и найдите списке файл с разрешением. css.

    Конечно, чтобы настроить стили постраничной навигации вам необходимо знать хотя бы основы CSS. Чтобы не терять время на его изучение (хотя рано или поздно вам придется изучить как минимум html и css) можно воспользоваться плагином WP PageNavi Style, который предоставляет уже готовые стили на любой вкус.

    Устанавливается плагин WP PageNavi Style стандартно, ничего прописывать в теме для него не нужно. Только скачайте последнюю версию с WordPress. org. После активации создается новый одноименный раздел в панели администратора WordPress.

    Рассмотрим основные настройки, их немного.

    Опция Select StyleSheet позволяет переключится между существующими стилями ( existing styles ) и возможностью сформировать их самому ( custom ).

    Выбор стилей очень большой, даже глаза разбегаются. Особенно красиво выглядят стили на CSS3. Думаю, каждый найдет что-то интересное для себя. После выбора визуального оформления постраничной навигации, задайте ее расположение — Align Navigation : left — слева, rigth — справа и center — по центру.

    Теперь рассмотрим, какие опции предоставляет нам раздел Custom.

    • Heading Color — цвет заголовка, не обязательно знать html код цвета, достаточно кликнуть на поле и визуально его выбрать;
    • Background Color — цвет заднего фона;
    • Active / Current Background Color — задней фон кнопки текущей страницы (активной);
    • Font Size — размер шрифта;
    • Link Color — цвет ссылки;
    • Link Mouse Hover / Active Color — цвет ссылки при наведении на нее курсора мыши;
    • Link Border Color — цвет границы кнопки с номером страницы;
    • Link Border Mouse Hover/Active Color — цвет границы, при наведении на кнопку курсора мыши;
    • Align Navigation — выравнивание на странице: по центру, по левому или правому краю.

    Не забудьте сохранить измененные настройки WP-PageNavi Style — Save Settings

    WP-PageNavi не работает

    Сталкивался я и с тем, что плагин WP-PageNavi не работает.

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

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

    По материалам:

    Http://iglous. ru/postranichnaya-navigaciya-v-wordpress-wp-page-numbers-plagin-numeracii-stranic/

    Http://inetsovety. ru/plagin-dlya-wordpress-wp-pagenavi/

    Http://fairheart. ru/wordpress/osnovy-sozdaniya-bloga/postranichnaya-navigaciya-na-bloge-wordpress-plaginy-wp-pagenavi-style-wp-page-numbers-i-number-my-post-pages. html