Статья посвящена добавлению ссылок “предыдущие” и “следующие” для перемещения с одной статьи на другую. Замечательно ведь, когда имеются красивые и удобные навигационные кнопки. После прочтения отдельной статьи, читатели вашего собственного блога скорее всего захотят ознакомиться с чем-то ещё, именно в этот момент им будут очень необходимы данные функции. А также можно вывести похожие записи для большей информации читателям.
Помимо навигации “предыдущие” и “следующие” есть еще одна возможность, это добавление самих названий материалов рядом с кнопками “предыдущие” и “следующие”. Данное дополнение также пользуется спросом под названием Post Navigation Links, поэтому рекомендуется ознакомиться с установкой этой функции к себе на сайт.
Установка.
Откройте файл single.php и в любом удобном месте для вас поместите следующею функцию:
<div id="singnex"> <div class="lion">← Предыдущий пост <?php previous_post_link('%link', '%title'); ?> </div> <div class="linx">Следующий пост → <?php next_post_link('%link', '%title'); ?> </div> </div>
Самым итоговым и достаточно важным шагом является добавлений стилей CSS для наших навигационных ссылок. Откройте файл style.css и добавьте стили.
/** Стили навигации singl */ #singnex {float: left; margin:10px;} #singnex .lion {float: left;width: 50%;text-align: left;} #singnex .lion a {float: left;text-align: left;} #singnex .linx {float: right;width: 50%;text-align: right;} #singnex .linx a {float: right;text-align: right;} #singnex a{text-decoration: underline; } #singnex a:hover { text-decoration: none; }
Результат.
Это стандартный код из кодекса WordPress, больше информации можно найти на официальном сайте.
codex.wordpress.org/Next_and_Previous_Links
Здравствуйте. Все работает, только смущает один момент. Если название заголовка не достаточно длинное, то получается в одну строку, то есть примерно так: Следующая запись>ваап ор ворв. Как сделать, чтобы название поста всегда было под надписью «Следующая запись»?
Ева, здравствуйте! Самое простое решение, поставьте просто тег переноса строки. Пример:
Предыдущий пост < br>