Как убрать навигацию WordPress?

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

Содержание

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

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

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

Функция, которую я вам предлагаю, совсем небольшая по размеру:

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

Для того, чтобы вывести навигацию в нужном месте, вставляйте в шаблон следующий код:

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

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

Проверял данную функцию на версиях WordPress, начиная с 2.3.3, а также тестировал варианты с включенным и отключенным ЧПУ. Все работает, как и полагается.

dimox.name

Альтернатива плагину 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. Мне стало интересно посмотреть, как это будет выглядеть и я немного переделал код.

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

    wp-kama.ru

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

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

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

    Еще по теме:   Как установить HTML шаблон на Wordpress?

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

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

    wordpressmania.ru

    WordPress.org

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

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

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

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

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

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

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

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

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

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

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

    • Ответ изменён 5 мес., 2 нед. назад пользователем Spectrum.
    • Ответ изменён 5 мес., 2 нед. назад пользователем Spectrum.
    • Ответ изменён 5 мес., 2 нед. назад пользователем Spectrum.
    • Ответ изменён 5 мес., 2 нед. назад пользователем Spectrum.

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

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

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

    • Ответ изменён 5 мес., 2 нед. назад пользователем Spectrum.
    Еще по теме:   Как установить Вордпресс на локальный сервер?

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

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

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

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

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

    ru.wordpress.org

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

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

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

    Зачем использовать плагин WP-PageNavi

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

    А так после установки плагина:

    это зависит от тех опций, которые вы выберите в окне его настроек.

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

    Плагин предварительно нужно будет скачать отсюда. Найдите справа кнопку «Download» и сохраните архив wp-pagenavi.zip у себя на компьютере. Затем распакуйте его и загрузите получившуюся в результате разархивирования папку на сервер хостинга в директорию с плагинами wp-content/plugins/ .

    Для этого вам понадобится получить доступ к файлам и папкам вашего WP блога по протоколу FTP (тут читайте про то, как этому делу может помочь FileZilla).

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

    После того, как вы скопируете файлы плагина на сервер хостинга в папку wp-content/plugins/ , вам нужно будет зайти в админку Вордпресса ( http://vash_sait.ru/wp-admin/ ) и выбрать из левого меню админки пункт «Плагины». В верху открывшегося окна «Управление» вам нужно нажать на ссылку «Неактивно» (или же, если нет перевода, то «Inactive»).

    Откроется окно со всеми установленными, но еще не активированными расширениями. Найдите среди них «WP-PageNavi» и нажмите на ссылку «Активировать», расположенную под его названием.

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

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

    Обычно постраничная навигация используется на главной странице блога (файл INDEX.PHP из папки с вашей темой), на вебстраницах архивных материалов (ARCHIVE.PHP) и в результатах поиска (файл SEARCH.PHP). Собственно, в эти файлы (шаблоны) нам и нужно будет вставить код вызова нужной нам функции.

    Т.е. нужно будет опять подключиться по FTP и зайти в папку с текущей темой:

    Найдите в ней INDEX.PHP и откройте его на редактирование в удобном для вас редакторе (я использую для этой цели продвинутый Нотепад++ — у меня есть статья по работе с ним). Теперь ваша задача состоит в том, чтобы найти в INDEX.PHP участок кода, отвечающий за переход на предыдущую или последующую страницу. Непростая задачка, не правда ли? Хотя, конечно же, для кого как.

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

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

    После того, как идентифицируете нужный фрагмент, вам нужно будет заменить его строкой вызова функции wp_pagenavi :

    Теперь необходимо сохранить произведенные в INDEX.PHP изменения, зайти на главную страницу своего блога и убедиться, что все работает как надо. Т.е. вместо стандартной пагинации, используемой в WordPress, у вас используется красотища от WP-PageNavi.

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

    Условие будет зависеть от того, установлен плагин WP-PageNavi на вашем блоге или нет. Выглядеть оно может примерно так:

    В этом коде условие:

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

    А если WP-PageNavi установлен, то навигационная панель будет формироваться его силами:

    Хотя, конечно же, можно не заморачиваться и просто заменить одно на другое, но это дело ваше.

    Так, теперь все тоже самое вы должны будете проделать для файлов ARCHIVE.PHP и SEARCH.PHP из папки с вашей темой ( wp-content/themes/Название папки с вашей темой оформления ).

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

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

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

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

    Еще по теме:   Как убрать название темы в подвале Вордпресс?

    Можно добавить слово «Страница» в это поле, если вам так больше нравится:

    А при желании можно вообще его очистить. В графах «Элемент ‘Текущая страница’» и «Элемент ‘Страница’» оставляйте все как есть. Здесь задается отображение надписи для текущей и всех остальных вебстраниц в виде порядкового номера. Получится примерно так:

    В полях «Text For First Page» и «Text For Last Page» вы можете задать текст для кнопок перехода к первой и последней:

    Вместо текста в графе «Text For First Page» вы можете написать единицу, а поле «Text For Last Page» — %TOTAL_PAGES% (вместо этой надписи будет отображаться число всех вебстраниц):

    В полях «Text For Next Post» и «Text For Previous Post» прописываются знаки стрелочек для отображения на кнопках перехода на следующую и предыдущую:

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

    Переходим к дальнейшим настройкам под названием «Настройки списка»:

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

    «Обычный» вы видели на предыдущих скриншотах, а при выборе стиля «Drop-down List» вы получите, примерно, такой вид панели WP-PageNavi в WordPress:

    Если вы поставите галочку в поле «Always Show Page Navigation», то даже для вебстраниц, у которых пока не требуется вводить нумерацию (допустим, что на главной еще не достаточно постов, чтобы осуществилось разбиение), все равно будет отображаться навигация примерно в таком виде:

    В «Number Of Pages To Show» вы можете задать, сколько страничек будет отображаться в виде непрерывного (последовательного) ряда чисел. Переход на остальные будет возможен с помощью кнопок следующей и предыдущей, а так же кнопок перехода на первую и последнюю. Я поставил там пятерку, в результате чего получил:

    В «Number Of Larger Page Numbers To Show» можете задать, сколько далеких номеров вебстраниц (большего, чем текущие отображаемые номера численного значения) будет показано после кнопки перехода на следующую.

    А в поле «Show Larger Page Numbers In Multiples Of» можете задать шаг, с которым будут отображаться номера далеких вебстраниц. Допустим, что в первом поле я поставлю тройку, а во втором двойку:

    В результате панель PageNavi будет выглядеть так:

    Т.е. выводятся номера всего трех далеких вебстраниц с интервалом (шагом) равным двойке (6, 8, 10). Для того, чтобы не использовать показ далеких номеров, вам достаточно будет поставить ноль в графе «Number Of Larger Page Numbers To Show».

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

    Изменение внешнего вида панели постраничной навигации

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

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

    В этом файле свойства CSS, задающие внешний вид панели WP-PageNavi, выглядят так:

    Обращаю ваше внимание, что названия классов и ID (тут читайте про эти селекторы подробнее), которые используются здесь, относятся именно к моему шаблону. Поясню назначение некоторых правил и свойств CSS.

    задает внешние и внутренние отступы (margin и padding — тут про них смотрите) для кнопок панели (фактически для ссылок с этих кнопок, т.к. эти свойства будут применены именно к ссылкам задаваемым тегом A и размещенным в контейнере wp-pagenav ).

    Так же в этом правиле задается цвет текста ссылок (белый цвет задается в свойстве color: #fff; — здесь читайте про Color и background в CSS).

    Рамка вокруг ссылок будет отсутствовать (свойство border: 0px ), а фоновый цвет для контейнеров с этими ссылками будет определяться свойством background-color: #2b99ff; . Именно этот цвет вы можете видеть на скриншотах расположенных выше для неактивных кнопок панели постраничной навигации.

    задает цвет для текста и фона контейнера (кнопки) с ссылкой, к которой в данный момент подведен курсор мыши (CSS свойства ссылки при наведении — a:hover — здесь описаны hover и другие селекторы псевдоклассов).

    Цвет текста ссылки по прежнему остается белым, а вот цвет фона (фактически цвет кнопки) меняется на более темный ( background-color: #154b7d; ). Т.е. посетитель, подводя курсор мыши к кнопкам панели навигации, будет видеть изменение цвета этой кнопки, что создает ощущение интерактивности.

    Задает внешний вид кнопки с номером, открытой в данный момент странички блога (в коде у этой ссылки будет прописан тег SPAN с классом CURRENT). Такая кнопка будет выглядеть так же, как кнопка с цифрой один, на приведенном ниже рисунке:

    В этом CSS правиле задается изменение цвета фона этой активной кнопки (свойство background:#26343c ), цвета текста ссылки на этой кнопке (свойство color: #add352 ), а кроме этого шрифт текста ссылки будет жирным в силу этого CSS свойства — font-weight: bold (тут описаны все возможные комбинации Font (Weight, Family, Size, Style) и Line Height).

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

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

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

    ktonanovenkogo.ru

    Поделиться:
    Нет комментариев

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

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

    ×
    Рекомендуем посмотреть
    Adblock
    detector