Навигация wordpress без плагина
Здравствуйте, уважаемые друзья! Сегодня я Вам расскажу, как делается постраничная навигация wordpress без плагина. Все очень даже просто делается. Вам будет нужно дочитать статью “Постраничная навигация wordpress без плагина” до конца и проделать все действия с кодом предложенным мной. И так, приступим …
Что нам дает постраничная навигация wordpress без плагина?
- Во первых: если делать постраничную навигацию при помощи плагина, то это замедлит наш WordPress движок. Ведь любой плагин создает лишнюю нагрузку на ваш сервер.
- Во вторых: без постраничной навигации наш блог будет мало кому интересен, так как неудобно для посетителя искать нужный материал.
- В третьих: с постраничной навигацией происходит увеличение посещаемости блога и длительность времени прибывания посетителя на блоге.
Думаю, что этих доводов достаточно, чтобы у Вас появилась постраничная навигация wordpress без плагина!
Делаем постраничную навигацию wordpress без плагина
Скопируйте код, который находится в открывающемся спойлере и вставьте в файл functions.php в конеце кода перед тегом ?>:
function kama_pagenavi($before='', $after='', $echo=true) {
/* ================ Настройки ================ */
$text_num_page = ''; // текст для количества страниц. {current} заменится текущей, а {last} последней. Пример: 'Страница {current} из {last}' = Страница 4 из 60
$num_pages = 10; // сколько ссылок показывать
$stepLink = 10; // после навигации ссылки с определенным шагом (значение = число (какой шаг) или '', если не нужно показывать). Пример: 1,2,3...10,20,30
$dotright_text = '…'; // промежуточный текст "до".
$dotright_text2 = '…'; // промежуточный текст "после".
$backtext = '«'; // текст "перейти на предыдущую страницу". Ставим '', если эта ссылка не нужна.
$nexttext = '»'; // текст "перейти на следующую страницу". Ставим '', если эта ссылка не нужна.
$first_page_text = ''; // текст "к первой странице" или ставим '', если вместо текста нужно показать номер страницы.
$last_page_text = ''; // текст "к последней странице" или пишем '', если вместо текста нужно показать номер страницы.
/* ================ Конец Настроек ================ */
global $wp_query;
$posts_per_page = (int) $wp_query->query_vars[posts_per_page];
$paged = (int) $wp_query->query_vars[paged];
$max_page = $wp_query->max_num_pages;
if($max_page <= 1 ) return false; //проверка на надобность в навигации
if(empty($paged) || $paged == 0) $paged = 1;
$pages_to_show = intval($num_pages);
$pages_to_show_minus_1 = $pages_to_show-1;
$half_page_start = floor($pages_to_show_minus_1/2); //сколько ссылок до текущей страницы
$half_page_end = ceil($pages_to_show_minus_1/2); //сколько ссылок после текущей страницы
$start_page = $paged - $half_page_start; //первая страница
$end_page = $paged + $half_page_end; //последняя страница (условно)
if($start_page <= 0) $start_page = 1;
if(($end_page - $start_page) != $pages_to_show_minus_1) $end_page = $start_page + $pages_to_show_minus_1;
if($end_page > $max_page) {
$start_page = $max_page - $pages_to_show_minus_1;
$end_page = (int) $max_page;
}
if($start_page <= 0) $start_page = 1;
$out=''; //выводим навигацию
$out.= $before."<div class='wp-pagenavi'>\n";
if ($text_num_page){
$text_num_page = preg_replace ('!{current}|{last}!','%s',$text_num_page);
$out.= sprintf ("<span class='pages'>$text_num_page</span>",$paged,$max_page);
}
if ($start_page >= 2 && $pages_to_show < $max_page) {
$out.= '<a href="'.rtrim(get_pagenum_link(), '/').'">'. ($first_page_text?$first_page_text:1) .'</a>';
if($dotright_text && $start_page!=2) $out.= '<span class="extend">'.$dotright_text.'</span>';
}
if ($backtext && $paged!=1) $out.= '<a href="'.rtrim(get_pagenum_link(($paged-1)), '/').'">'.$backtext.'</a>';
for($i = $start_page; $i <= $end_page; $i++) {
if($i == $paged) {
$out.= '<span class="current">'.$i.'</span>';
} else {
$out.= '<a href="'.rtrim(get_pagenum_link($i), '/').'">'.$i.'</a>';
}
}
if ($nexttext && $paged!=$end_page) $out.= '<a href="'.get_pagenum_link(($paged+1)).'">'.$nexttext.'</a>';
//ссылки с шагом
if ($stepLink && $end_page < $max_page){
for($i=$end_page+1; $i<=$max_page; $i++) {
if($i % $stepLink == 0 && $i!==$num_pages) {
if (++$dd == 1) $out.= '<span class="extend">'.$dotright_text2.'</span>';
$out.= '<a href="'.get_pagenum_link($i).'">'.$i.'</a>';
}
}
}
if ($end_page < $max_page) {
if($dotright_text && $end_page!=($max_page-1)) $out.= '<span class="extend">'.$dotright_text2.'</span>';
$out.= '<a href="'.get_pagenum_link($max_page).'">'. ($last_page_text?$last_page_text:$max_page) .'</a>';
}
$out.= "</div>".$after."\n";
if ($echo) echo $out;
else return $out;
} Затем следующим шагом будет редактирование в файлах: index.php, search.php и archive.php.
Первое, ищем и меняем код:
- Для тех, кто не устанавливал плагины постраничной навигации, ищем вот такой код:
<div class="navigation">
<div class="navleft"><?php next_posts_link('« Предыдущие записи') ?></div>
<div class="navright"><?php previous_posts_link('Следующие записи »') ?></div>
</div> - Для тех, кто установил плагин постраничной навигации, ищем вот такой код:
<?php if(function_exists('wp_pagenavi')) { wp_pagenavi(); } ?> В обоих случаях меняем вот на этот код:
<?php if (function_exists('kama_pagenavi')) kama_pagenavi(); ?>
Далее нужно прописать стили для нашей новой постраничной навигации. В файле style.css темы оформления пропишите вот этот код:
.wp-pagenavi {
clear: both;
}
.wp-pagenavi a, .wp-pagenavi span {
text-decoration: none;
border: 1px solid #BFBFBF;
padding: 3px 5px;
margin: 2px;
}
.wp-pagenavi a:hover, .wp-pagenavi span.current {
border-color: #000;
}
.wp-pagenavi span.current {
font-weight: normal;
}
Или вот такие стили, они немного красивее, чем выше предложенные:
.wp-pagenavi {
clear: both;
margin: 5px;
}
.wp-pagenavi a, .wp-pagenavi span {
text-decoration: none;
border: 1px solid #BFBFBF;
padding: 3px 12px;
margin: 2px;
background-clip:padding-box;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
box-shadow:3px 3px 3px #666666;
-webkit-box-shadow 5px 5px 15px #666666;
-moz-box-shadow: 5px 5px 15px #666666;
}
.wp-pagenavi a:hover, .wp-pagenavi span.current {
border-color: #BFBFBF;
}
.wp-pagenavi span.current {
font-weight: bold;
}
Вот наша постраничная навигация wordpress без плагина и готова!
Если у Вас возникли вопросы по ходу работы, задавайте вопросы в комментариях к данной статье. Отвечу всем без исключения и постараюсь Вам помочь.