How to edit theme functions file to modify pagination?
-
16-10-2019 - |
Question
By default, when adding <!--nextpage-->
, the following links are displayed:
Pages: 1 2
I need to replace "Pages:" with a graphic arrow which links back to the previous page, and append a graphic arrow to the end of the links that links to the next page. I'm guessing there's a way to do this in the functions file?
Solution
Just specify an image as the "nextpagelink" and "previouspagelink" instead of the << or >>:
<?php wp_link_pages(array('before' => '<div class="pagenav"><strong>Navigate</strong>', 'after' => '</div>', 'next_or_number' => 'number', 'nextpagelink' => __('<img src="PUT YOUR IMAGE URL HERE" />'), 'previouspagelink' => __('<img src="PUT YOUR IMAGE URL HERE" />'))); ?>
Also, you are correct that by default you are limited to either "Numbers" or "Next/Previous" links but a plugin can extend this: http://wordpress.org/extend/plugins/wp-pagenavi/
Bonus: Add this to your function.php and it will add a "Nextpage" button next to the "More" button in the WYSIWYG editor:
// Add Next Page Button to TinyMCE Editor
add_filter('mce_buttons','wysiwyg_editor');
function wysiwyg_editor($mce_buttons) {
$pos = array_search('wp_more',$mce_buttons,true);
if ($pos !== false) {
$tmp_buttons = array_slice($mce_buttons, 0, $pos+1);
$tmp_buttons[] = 'wp_page';
$mce_buttons = array_merge($tmp_buttons, array_slice($mce_buttons, $pos+1));
}
return $mce_buttons;
}
OTHER TIPS
I have to admit that <!--nextpage-->
isn't a very well-documented feature (there's not even a button for it in the UI of the post editor!). But it's still incredibly useful and I've used it a few times to break up longer posts on my own site.
According to what documentation exists, though, this tag uses the function wp_link_pages()
. This function accepts a few parameters that allow you to style the output as needed.
In your case, you'd want to use the next_page_link
and previous_page_link
arguments.
So at the bottom of single.php
, use the following code to generate your page links:
<?php
wp_link_pages( array(
'before' => '<p>',
'after' => '</p>',
'next_or_number' => 'next',
'previouspagelink' => ' « ',
'nextpagelink' => ' »'
)
);
?>
This will replace the page numbers with << and >> arrows. It will also remove the "Pages:" text while keeping your links contained within a <p></p>
block.
Related: