Как разбить запись WordPress на несколько страниц
Нет ничего хуже, чем прокручивать длинную запись или страницу, когда очевидно, что она должна быть разделена на несколько частей, которые гораздо легче воспринимаются. Это легко сделать в WordPress, и этим стоит пользоваться. В этом руководстве мы опишем, как это можно сделать.
Добавьте теги в вашу запись
Просто напишите ваш пост или страницу как обычно, и там, где вам нужно начать новую страницу, используйте тег <!–nextpage–>
Вот скриншот демонстрационного поста, который разделен на три страницы с помощью тегов <!–nextpage–>
Это все, что вам нужно сделать с вашими записями или страницами.
Отредактируйте ваш шаблон
В папке вашей WordPress темы вы найдете файл single.php. Это шаблон, который отвечает за отображение отдельных постов или страниц. Именно здесь нам нужно сообщить WordPress, что он должен отображать ссылки на страницы для наших тегов <!–nextpage–>.
В файле single.php (или, может быть, в файле loop-single.php, который часто вызывается в файле single.php) вы найдете цикл WordPress, который выводит ваш пост или страницу. Вот краткая версия этого цикла:
| 12345678910 | if (have_posts()) while (have_posts()) : the_post(); the_title(); the_content(); wp_link_pages(); endif;endwhile; |
Этот цикл отображает заголовок и содержимое поста или страницы, но обратите внимание на функцию wp_link_pages. Эта функция отображает ссылки на страницы для каждого тега <!–nextpage–>, который вы вставили в пост.
Вот как будет отображаться ваш пост. Мы видим первую страницу со ссылками на вторую.
Это действительно так просто.
Стиль ссылок на страницы
То, что выводит функция wp_link_pages по умолчанию, — функционально, но достаточно скучно. Но wp_link_pages также дает нам возможность добавить текст перед ее выводом и после, так что мы можем добавить ссылкам на страницы свой CSS. Рассмотрим снова цикл с некоторыми стандартными аргументами, которые используются в теме WordPress Twenty-Ten.
| 12345678910111213 | if (have_posts()) while (have_posts()) : the_post(); the_title(); the_content(); wp_link_pages(array('before' => '<div class="page-link">' . 'Pages:','after' => '</div>')); endif;endwhile; |
Вот, как это будет выглядеть после того, как мы добавили CSS в класс page-link:
Конечно, вы можете пойти дальше в добавлении стилей в плане цвета и размеров. Также прочтите об аргументах функции wp_link_pages, так как они позволяют вам еще больше настроить вывод страниц.