Постраничная навигация WordPress без плагинов.

Приветствую все посетителей блога WebMasterMaksim.ru, сегодня продолжаю серию статей «без плагинов» и расскажу я про постраничную навигацию WordPress.

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

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

Постраничная навигация WordPress без плагинов
Постраничная навигация WordPress без плагинов

Вот все статьи серии «Без плагинов»:

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

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

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

Вот смотрите видео Евгения Попова про работу с этим плагином:


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

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

[php]
<!—?php global $wp_query; $max_page = $wp_query—>max_num_pages;
$nump=6; /*Количество отображаемых подряд номеров страниц*/

if($max_page>1){
$paged = intval(get_query_var(‘paged’));
if(empty($paged) || $paged == 0) $paged = Первая;

echo ‘</pre>
<div class="wp-pagenavi">’;
/* echo ‘Страница ‘.$paged.’ из ‘.$max_page.’      ‘;*/
if($paged!=1) echo ‘<a href="’.get_pagenum_link(1).’">« Первая</a> ‘;
else echo ‘<span style="text-decoration: underline;">1</span>’;

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 ‘<span style="text-decoration: underline;">’.$i.'</span>’;
}

if($end<$max_page-1) echo "<b>…</b>";

if($paged!=$max_page) echo ‘<a href="’.get_pagenum_link($max_page).’"> Последняя »</a>’;
else echo ‘<b> Последняя</b> ‘;
echo ‘</div>
<pre>
‘ ;
}
?>
[/php]

Теперь сохраняем этот файл и заливаем его в вашу тему, идите к себе на хостинг, wp-content > themes > название вашей темы, и уже сюда закачиваем наш только что созданный файл pagenavi.php.

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

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

Для этого нам нужно вставить через админку WordPress, код-функцию вызова постраничной навигации, в файлы index.php, search.php и archive.php, конкретное место я вам указать не могу у каждого свои темы, ну я думаю вы с этим справитесь!

Вот этот код вызова постраничной навигации:

[php]</pre>
<div class="pagenavi"></div>
<pre>
[/php]

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

Посмотрите на код файла pagenavi.php, в него я включил контейнер div class=»pagenavi», а это значит что мы уже можем в файл стилей вашей темы добавлять правила для вашей навигации.

Теперь через админку заходим в редактор вашей темы в файл (style.css) и вставляем туда следующие стили оформления навигации по страницам в WordPress:

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

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

Все постраничная навигация WordPress без плагинов создана.

1 Звезда ХЕРНЯ!2 Звезды ЧИТАЛ И СПАЛ3 Звезды НУ МОЖНО ПОЧИТАТЬ4 Звезды НРАВИТСЯ!5 Звезд КРУТО! (1 оценок, среднее: 5,00 из 5)
Загрузка...Предыдущая
Создать блог WordPressWordPress создаем карту сайта без плагинов.
Следующая
Создать блог WordPressWordPress не работает rss - ошибки - This page contains the following errors - Below is a rendering of the page up to the first error.