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 = 1; //1 - выводить текст "Страница N из N", 0 - не выводить $a['mid_size'] = 3; //сколько ссылок показывать слева и справа от текущей $a['end_size'] = 1; //сколько ссылок показывать в начале и в конце $a['prev_text'] = 'Назад'; //текст ссылки "Предыдущая страница" $a['next_text'] = 'Дальше'; //текст ссылки "Следующая страница" if ($max > 1) echo '<div class="navigator">'; if ($total == 1 && $max > 1) $pages = '<span class="pages">Страница ' . $current . ' из ' . $max . '</span>'."\r\n"; echo $pages . paginate_links($a); if ($max > 1) echo '</div>'; }
В коде присутствуют подсказки, думаю кто захочет поиграться с настройками разберется без проблем.
2. Выводим навигацию на страницах нашей темы.
Для того, чтобы вывести навигацию, нужно вставить код в в нужном месте. К примеру навигация используется в файле category.php или index.php. Нужно найти стандартную навигацию заменить ее. У меня она выглядела так:
<div> <div><?php next_posts_link('« Раньше') ?></div> <div><?php previous_posts_link('Позже »') ?></div> </div>
или как то так:
<nav id="nav-single"> <div class="assistive-text"><?php _e( 'Post navigation', 'gstudio' ); ?></div> <span class="nav-previous"><?php previous_post_link( 'Предыдущая запись <br> %link'); ?></span> <span class="nav-next"><?php next_post_link ('Следующая запись <br> %link'); ?></span> <div class="clear"></div> </nav><!-- #nav-single -->
Может быть совсем иначе, но смысл думаю понятен. В общем это счастье нужно заменить на наш новый код, который выглядит так.
<?php if (function_exists('wp_corenavi')) wp_corenavi(); ?>
После всех этих действий, навигация уже начнет работать, вот только выглядеть она будет не очень. И поэтому перейдем к следующему пункту.
3. Зададим стили css нашей навигации
Ниже приведен css код с видом как на моем сайте, который нужно вставить в файл style.css. Если вы хоть немного разбираетесь в css, думаю вы без проблем подгоните его под себя.
.navigator { padding:22px 0 25px 0; overflow:hidden; font-size:13px; color:#333333; clear:both; margin:0 auto; text-align:center; } .navigator a{ color: #333333; font-size: 13px; padding:5px 9px; text-decoration: none; -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.4); -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.4); box-shadow: 0 1px 2px rgba(0,0,0,0.4); } .navigator span.pages {padding: 3px 5px; color: #ffffff; background: #544DA7; padding:5px 9px; -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.4); -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.4); box-shadow: 0 1px 2px rgba(0,0,0,0.4); } .navigator a:hover{ background: #544DA7; color: #ffffff; font-size: 13px; text-decoration: none; padding:5px 9px; -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.4); -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.4); box-shadow: 0 1px 2px rgba(0,0,0,0.4); } .navigator span.current {background: #fff; border: 1px solid #544DA7; font-size: 13px; padding:5px 9px; text-decoration: none; -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.4); -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.4); box-shadow: 0 1px 2px rgba(0,0,0,0.4); } .navigator span.extend { padding:5px 9px; background:#f1f8f9; border: 1px solid #544DA7; } .str{background: #fff; color: #333333; font-size: 13px; padding:5px 9px; text-decoration: none; -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.4); -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.4); box-shadow: 0 1px 2px rgba(0,0,0,0.4);}
Вот и все что нужно, чтобы заработала постраничная навигация на WordPress. Если вы все вставили правильно то у вас появится симпатичная навигация.
На этом все. Спасибо за внимание 🙂