By default, WordPress has a function that allows you to split a single post or page into multiple pages. They’re called “Page-Links” and they’re useful if you want to split a long post into pages to make it easier to read.
To add a page link to your post, place your cursor in your editor and type:
[gist id=”d9724e2fa687ede868a2″ file=”page-link-tag.html”]
Place this where you’d like your page break to appear (make sure you switch to the “Text” tab in you visual editor).
The default appearance is very basic and will look something like:
The result we’re going after is to style the Page-Links so that they look the same as our styled Genesis Pagination (you can see these on archive pages, etc):
The WordPress Codex for wp_links_pages page has some pointers on how to style the page links. We can use this to get us closer to where we want to be.
Add Styling To The Default Page-Links
Using the wp_link_pages_args filter, we can add this to our theme’s functions.php to style the Page-Links:
[gist id=”d9724e2fa687ede868a2″ file=”wp-link-page-args.php”]
(Please note, these examples include our custom css so they may not look the same in your theme. We will show the CSS we used to style these at the end of the post for reference)
You’ll notice one of the filter args is “next_or_number”. You can use either “next” or “number”, but not both. So depending you which you choose your Page Links will now look like one of these:
Page Numbers And Previous / Next Links for Page-Links
Getting closer, but we want to have both page numbers and “Previous Page” or “Next Page” links. After doing some research, I came across this post on Stack Exchange explaining that this option is not built in by default. Using the function from this post we can add “Previous Page” or “Next Page” along with the numbers:
[gist id=”d9724e2fa687ede868a2″ file=”wp-links-page-prev-next-number-links.php”]
The end result? Here is the actual Page-Link inserted. Click on Next Page or 2 to view the CSS used to style this: