Постраничная навигация WordPress: что это, как сделать без плагина на php, плагином

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

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

На wordpress ее организуют так, что на странице выводится блок информации из большого массива данных. 

Постраничная навигация: что это

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

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

В переводе с английского «pagination» или пагинация — это порядковая нумерация страниц. Постраничная навигация разделяет общий текстовый материал сайта на отдельные страницы с порядковой нумерацией (1-2-3).

Есть варианты, когда длинную статью или комментарии разбивают на странички, но здесь есть нюансы со стороны seo. Об этом отдельно.

Использование плагинов

Самый простой выход для создания постраничной навигации — установить плагин.

СТАТЬИ ПО ТЕМЕ:

Как сделать, изменить wordpress главную страницу

Html выделить текст цветом (фон), рамкой

Отложенная, запланированная публикация WordPress

Самый известный WP-PageNavi. У него много установок, он обновляется, совместим с последней версией wordpress.

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

Найдите в них код вызова функций next_posts_link и previous_posts_link. Они вызывают стандартную навигацию, о ней я писала в начале статьи.

Замените их функцией

<?php if ( function_exists( 'wp_pagenavi' ) ) wp_pagenavi(); ?>.

Пример.

wp-pagenavi плагин
wp-pagenavi
Сохраните изменения в файле. Сделайте настройки плагина: в разделе Параметры:

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

Другой доступный плагин WP-Paginate.

Без плагина, на php

В интернете есть множество кодов, рабочих, как утверждают авторы блогов, где эти коды опубликованы. Но, похоже, что КАЖДЫЙ КОД работает только с определенным шаблоном. Убедилась в этом, перепробовала массу вариантов. И привожу схему постраничной навигации без плагина (с использованием php), сработавшую на двух блогах с разными шаблонами.

галочка В редакторе вашей темы (шаблона) создайте новый файл pagenavi.php. Похожий файлик я уже создавала, когда устанавливала форму обратной связи без плагина. Опишу процесс еще раз.

СОЗДАТЬ документ в программе Блокнот

ВНЕСТИ в этот файл код

<?php
global $wp_query;
$max_page = $wp_query->max_num_pages;
$nump=10;
if($max_page>1){
$paged = intval(get_query_var('paged'));
if(empty($paged) || $paged == 0) $paged = 1;echo '<div>';
if($paged!=1) echo '<a href="'.get_pagenum_link(1).'">1</a>&nbsp;';
else echo '<u>1</u>';if($paged-$nump>1) $start=$paged-$nump; 
else $start=2;
if($paged+$nump<$max_page) $end=$paged+$nump; 
else $end=$max_page-1;
if($start>2) echo "<b>…</b>";for ($i=$start;$i<=$end;$i++)
{
if($paged!=$i) echo '<a href="'.get_pagenum_link($i).'">'.$i.'</a>';
else echo '<u>'.$i.'</u>';
}if($end<$max_page-1) echo "<b>…</b>";
if($paged!=$max_page)
 echo '<a href="'.get_pagenum_link($max_page).'"> Последняя &raquo;</a>';
else echo '<b>&nbsp;Последняя</b>';
echo '</div>' ;
}
?>

СОХРАНИТЬ файл как pagenavi.php (смотрите пример, как это делать).

сохранить как php неправильно
неправильно
сохранить как php неправильно
неправильно
как сделать форму обратной связи без
правильно
сохранить как php правильно
правильно

ПЕРЕМЕСТИТЬ файл pagenavi.php с помощью программы FILEZILLA в папку с вашим шаблоном PUBLIC_HTML — WP-CONTENT — THEMES (более подробно написано вот здесь).

закачать на серверСКОПИРОВАТЬ файл pagenavi.php в папку с вашей темой Wordpress
ЛИБО СКОПИРОВАТЬ через файловый менеджер из аккаунта на хостинге.

постраничная навигация через php

Как результат — файл pagenavi.php должен появиться в редакторе вашей темы.

галочка ВНЕСИТЕ изменения в тех файлах, где вы хотите видеть нумерацию страниц на сайте: index.php (главная страница), archive.php.

ДОБАВЬТЕ КОД, отвечающий за вывод постраничной навигации

<div class="pagenavi"><?php include(TEMPLATEPATH."/pagenavi.php");?></div>

НАЙДИТЕ МЕСТО для вставки кода

На открытой странице сайта наведите курсор на линк Предыдущая страница.

Откройте ПРОСМОТРЕТЬ КОД ЭЛЕМЕНТА, определите, что за этот элемент отвечает class more_posts (у меня, у вас может быть другой).

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

НАЙДИТЕ class more_posts на странице index.php.
место для вставки кода php
ЗАМЕНИТЕ кусок кода между тегами <div> и </div> на нужный (приведен выше).

И вот что получитсяВордпресс навигация Что-то не очень красиво? Конечно, нужно еще и стили для постраничной навигации прописать в файле style.css.

галочка ВНЕСИТЕ в файл style.css следующий код.

.navigation {clear:both; width:500px; height:auto;text-align:center;
margin:30px 0 30px 50px;padding-top:15px;!important;}
.navigation .right, .navigation .left {width:230px; font-size:18px;
text-align:right;margin:0;!important;}
.navigation .left {text-align:left;!important;}
.navigation a, .navigation a:visited {text-decoration:none;
color:#939186;!important;}
.navigation a:hover {color:#5D5643;text-decoration:none;!important;}
.pagenavi {clear:both;display:block;font-size:14px;margin:0;
padding:7px 0 7px 0;!important;}
.pagenavi a {clear: both;width:auto;font-size:14px;
padding:3px 7px 3px 7px;background-color:#F3EFE6;!important;}
.pagenavi b {clear:both;width:auto;margin:0 6px 0 5px;
text-decoration:none;!important;}

АДАПТИРУЙТЕ его к дизайну своего блога, попробуйте изменить background-color и другие параметры. У меня, вот что получилось, все ссылочки работают. Вордпресс постраничная навигация без плагина

Заключение

Теперь понятно, как сделать постраничную навигацию на php без плагина, используя плагин wordpress. Постраничная навигация будет видна, если записей на блоге больше, чем отображается на страницах блога (смотрите в настройках чтения). Пример: вы выводите по 6 записей на странице, а всего их 7. Тогда будут отображаться две странички.

Понравилась статья? Поделиться с друзьями:
Я новичок
Добавить комментарий

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!: