Здравствуйте уважаемые читатели блога . В этой статье рассмотрим, как настроить постраничную навигацию с помощью плагина WP-PageNavi для .
После установки этого полезного плагина постраничная навигация будет иметь вид:
Согласитесь, так намного лучше. Причем это только первоначальный вариант. А ведь можно настроить вид постраничной навигации так, чтобы она гармонично вписывалась в вашего сайта. Да и как может быть по другому, если мы говорим про блог вебмастера ?
Для начала нужно скачать плагин PageNavi с официального сайта себе на компьютер и распаковать архив. В результате вы получите папку PageNavi с несколькими файлами. Далее настраивает соединение с с помощью ftp-менеджера FileZilla и , в директорию /wp-content/plugins/ .
После чего открываем админ-панель WordPress, заходим во вкладку плагины, находим PageNavi и нажимаем «активировать ».
На этом установка и активация плагина PageNavi завершена. Осталось только прописать в файлах index.php, archive.php и search.php код, который отвечает за вывод постраничной навигации. Для этого откройте файлы с помощью текстового редактора и найдите следующие строки:
Замените их на:
< ?php if(function_exists("wp_pagenavi")) { wp_pagenavi(); } ?>После этого постраничная навигация будет выводиться на этих страницах. Но зачастую ее оформление не вписывается в дизайн блога, поэтому ее нужно настроить. Для этого открываем в админке блога «Настройки» и выбираем пункт «Список страниц». Откроется такое окно:
В нем вы можете внести изменения по своему вкусу . Например, убрать слово «страница» в первой строке или вообще ее очистить и т. д. В общем экспериментируйте, пока не получите вариант, который вас устроит. Для этого блога я оставил все как есть. Ниже укажите стиль списка страниц, сколько страниц показывать и нажмите сохранить.
Теперь переходим непосредственно к настройке внешнего вида постраничной навигации. Для этого придется отредактировать файл стилей плагина PageNavi — pagenavi-css.css . Откойте его с помощью текстового редактора Notepad++ и внесите необходимые изменения в следующий код:
.wp-pagenavi a, .wp-pagenavi a:link, .wp-pagenavi a:active { padding: 2px 4px 2px 4px; margin: 2px; text-decoration: none; border: 1px solid #0066cc; color: #0066cc; background-color: #FFFFFF; } .wp-pagenavi a:hover { border: 1px solid #114477; color: #114477; background-color: #FFFFFF; } .wp-pagenavi span.pages { padding: 2px 4px 2px 4px; margin: 2px 2px 2px 2px; color: #000000; border: 1px solid #000000; background-color: #FFFFFF; } .wp-pagenavi span.current { padding: 2px 4px 2px 4px; margin: 2px; font-weight: bold; border: 1px solid #000000; color: #000000; background-color: #FFFFFF; } .wp-pagenavi span.extend { padding: 2px 4px 2px 4px; margin: 2px; border: 1px solid #000000; color: #000000; background-color: #FFFFFF; }Можете изменить цвет текста, фона, будет ли изменяться цвет текста после наведения курсора и т. д. После того, как внесете все изменения, сохраните файл и оцените результат. Кстати, значительно облегчит работу плагин FireBug для браузера Firefox.
Приветствую читателей моего блога сайт сегодня поделюсь с Вами настройками постраничной навигации без плагина на блоге . Для чего вообще нужна постраничная навигация на сайте и что полезного она в себе несет? это юзабилити блога, благодаря которому посетители сайта с легкостью могут найти полезную дляних информацию.
Итак, прежде чем перейти к настройкам навигации необходимо настроить удобный режим чтения ваших постов, которые будут отображаться на странице блога. Для этого переходим в Панель Администрирования — Настройки -Чтение:
и устанавливаем количество отображаемых постов, которые будут отображаться на каждой странице:
В данном случае установлено 5 записей. Обычно на блога отображается от 5 до 7 записей на каждой странице. Теперь когда с данными настройками мы разобрались внизу страницы мы видим стандартную постраничную навигацию WordPress, которая имеет примерно такой вид:
Когда у Вас на блоге количество постов предположим 10-15 и они занимают не более 2-3 страниц то такая навигация вполне удобна, но когда важ блог регулярно наполняется контентом и количество статей близится к 100 или 200 и все эти посты размещены 5 на каждой странице. То Я думаю не сложно будет подсчитать сколько страниц будет размещено на блоге. При этом чтоб посетителю Вашего блога найти какой либо пост не приходилось пролистывать все страницы блога на WordPress, постраничная навигация должна иметь более удобный и функциональный вид для пользователя:
Подобная навигация поможет придержать читателя у Вас на блоге так, ему более удобно пролистывать Ваш сайт в поиске актуальных для него постов. Тем самым мы опять таки улучшаем , которые помогают нам в продвижении нашего блога.
Подобная навигационная панель может выводится при помощи плагина WP-PageNavi. При этом Я считаю, что блог должен функционировать с найменьшим количеством плагинов, чтоб не создавать дополнительные нагрузки при отображении сайта. Поэтому мы будем рассматривать не сложную настройку отображения WordPress постраничная навигация без плагина.
Технические настройки
Окрываем Панель администрирования- Настройки -Редактор -открываем файл functions.php и в начале вставляем ниже указанный код:
// Панель навигации
function wp_corenavi() {
global $wp_query, $wp_rewrite;
$pages = »;
$max = $wp_query->max_num_pages;
if (!$current = get_query_var(‘paged’)) $current = 1;
$a["base"] = str_replace(999999999, ‘%#%’, get_pagenum_link(999999999));
$a["total"] = $max;
$a["current"] = $current;$total = 0; //1 — выводить текст «Страница N из N», 0 — не выводить
$a["mid_size"] = 1; //сколько ссылок показывать слева и справа от текущей
$a["end_size"] = 1; //сколько ссылок показывать в начале и в конце
$a["prev_text"] = ‘«’; //Левая кавычка перехода«
$a["next_text"] = ‘»’; //Правая кавычка перехода»if ($max > 1) echo ‘
’;’;
if ($total == 1 && $max > 1) $pages = ‘Страница ‘ . $current . ‘ из ‘ . $max . ‘’.»\r\n»;
echo $pages . paginate_links($a);
if ($max > 1) echo ‘
}
или же вот такой вид:
и заменяем выделенный код на следующий:
После этого проверяем настройки на вашем сайте должно отобразится стандартоное отображение настроек навигации:
Панель навигации
*/
.wp-pagenavi {
height: 50px;
clear: both;
color:#BB7B00;
}
.wp-pagenavi span.pages{
color: #BB7B00;
}
.wp-pagenavi a, .wp-pagenavi span {
text-decoration: none;
padding: 6px 9px;
margin: 2px;
background:#ffffff;
font: bold 14px Verdana,sans-serif;
color: #85B6C5;
border-radius:5px ;
}
.wp-pagenavi a:hover, .wp-pagenavi span.current {
border-color: #BB7B00;
background:#85B6C5;
color:#ffffff;
}
.wp-pagenavi span.current {
color: #f5f5f5;
background:#85B6C5;
padding: 8px 9px;
}
Теперь когда мы подключили стили для отображения в WordPress панели навигации без использования плагина мы сможемувидеть подобный вид:
Для того, чтоб избавиться от дополнительных дублей страниц, которые не любят поисковые системы нам необходимо закрыть от индексации страницы page. Для этого в начале файла functions.php нам необходимо добавить следующий код:
/*** ДОБАВЛение meta robots noindex,nofollow ДЛЯ СТРАНИЦ ***/
function my_meta_noindex () {if (
is_paged() // Все и страницы навигации
) {echo «».’’.»\n»;}
}add_action(‘wp_head’, ‘my_meta_noindex’, 3); // добавляем noindex,nofollow в head
Сохраняемся и проверяем наши настройки. Для этого открываем любую из страниц 2, 3-10 и т.д нажимаем Ctrl+U и в кодировке страницы должен отображаться следующий код:
При этом важно в файле robots.txt не должны закрываться Disallow: /page от индексации. На этом настройки завершены надеюсь Вы разобрались во всех этих кодировках. Если остались вопросы пишите в комментариях, обязательно отвечу. До скорых встреч!
Здравствуйте, читатели блога сайт! Стандартная постраничная навигация WordPress сводится лишь к возможности переходить на следующую или возвращаться к предыдущей странице с анонсами статей. Никакой нумерации страниц визуально не видно — это неудобно. Исправить ситуацию можно с помощью плагина WP-PageNavi или его аналога WP Page Numbers. Третий плагин, который я сегодня рассмотрю, Number My Post Pages, позволяет представить информацию одной статьи постранично.
2. Распакуйте и загрузите на сервер папку с файлами плагина в директорию wp-content/plugins, используя бесплатный .
3. Активируйте его, в списке плагинов он идет под именем «список страниц».
4. Теперь необходимо заменить стандартный код для постраничной навигации в шаблонах index.php, archive.php и search.php на новый:
От темы к теме вид кода может несколько меняться, поэтому ищите конструкцию, содержащую строчки 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.
Сталкивался я и с тем, что плагин WP-PageNavi не работает .
1. Плагин WP-PageNavi не активируется . Скорее всего вы используете особо продвинутую тему, в которой уже используется нумерованная постраничная навигация. Добавьте на блог несколько статей, чтобы увидеть используемую по умолчанию навигацию на блоге. Скорее всего она выполнена в стили используемой темы и менять в ней ничего не надо. Если не понравилась — почистите шаблоны темы от кода постраничной навигации, тогда плагин WP-PageNavi должен активироваться.
2. WP-PageNavi на главной странице работает некорректно — не переключаются страницы, выдаются ошибки или содержание страниц не изменяется. Это опять же связано с используемой темой WordPress.
Откройте на редактирование шаблон index.php и найдите код, который отвечает за вывод записей:
| … |
Замените его на следующий код:
| … |
Проверьте работоспособность WP-PageNavi.
3. Если и это не помогло, то можно воспользоваться альтернативным плагином — WP Page Numbers .
Установка плагина WP Page Numbers аналогично рассмотренной выше установки WP-PageNavi, только используется несколько другой код:
Настройки плагина располагаются в разделе «Параметры» — «Page Numbers».
WP Page Numbers предоставляет на выбор 5 стилей оформления постраничной навигации WordPress. Конечно, по сравнению с многообразием стилей WP-PageNavi Style это выглядит скудно, но темы универсальные и прекрасно подойдут для большинства блогов.
Из остальных настроек я только заменил значения «Page» на «Страница», а предлог «of» на «из».
Последний плагин в моей подборке называется Number My Post Pages и предназначен для создания постраничной навигации внутри одной записи. Он пригодится вам в том случае, если объем материала на странице блога очень велик, и его лучше представить постранично для удобства читателя.
1. Скачайте плагин Number My Post Pages.
2. Распакуйте архив и перекиньте папку с файлами плагина на ftp в директорию wp-content/plugins.
3. Активируйте плагин Number My Post Pages.
4. Добавьте в шаблоны single.php и page.php используемой темы WordPress следующий код:
Чтобы разбить содержание статьи на страницы следует воспользоваться тегом:
Настройки плагина Number My Post Pages проживают по адресу «Параметры» — «Number Post Pages».
Практически любой блоггер, который ведет свой блог на движке WordPress, знаком с плагином WP-PageNavi, который выводит постраничную навигацию такого вида:
Но не каждый знает (включая меня до недавнего времени), что WordPress имеет встроенную функцию (начиная аж с версии 2.1), которая реализует практически тот же самый функционал . Т.е. необходимость в использовании плагина отпадает.
Некоторое время я пользовался другим аналогичным решением , за что большое спасибо его автору Тимуру.
Функция, которую я вам предлагаю, совсем небольшая по размеру:
function wp_corenavi() { global $wp_query; $pages = ""; $max = $wp_query->max_num_pages; if (!$current = get_query_var("paged")) $current = 1; $a["base"] = str_replace(999999999, "%#%", get_pagenum_link(999999999)); $a["total"] = $max; $a["current"] = $current; $total = 1; //1 - выводить текст "Страница N из N", 0 - не выводить $a["mid_size"] = 3; //сколько ссылок показывать слева и справа от текущей $a["end_size"] = 1; //сколько ссылок показывать в начале и в конце $a["prev_text"] = "«"; //текст ссылки "Предыдущая страница" $a["next_text"] = "»"; //текст ссылки "Следующая страница" if ($max > 1) echo "
"; }Данный код необходимо поместить в файл functions.php вашего шаблона. В функции всего пять опций, они отделены разрывами строк. Комментарии я написал, думаю, тут все понятно.
Для того, чтобы вывести навигацию в нужном месте, вставляйте в шаблон следующий код:
HTML-код, который получается в результате вывода функции, выглядит следующим образом:
Как видите, присутствуют все необходимые CSS-классы, которые можно использовать для оформления любого элемента навигации (например, текущую страницу, ссылки на предыдущую и следующую страницы).
Проверял данную функцию на версиях WordPress, начиная с 2.3.3, а также тестировал варианты с включенным и отключенным ЧПУ. Все работает, как и полагается.
Пользуйтесь.
Если вам нужен надежный хостинг и регистрация доменов , то вас ждет крупнейших украинский хостинг-провайдер FREEhost.UA, который готов предложить любой вид хостинга, начиная от виртуального, заканчивая арендой готового сервера.
