In this members-only tutorial, we share JS and CSS customizations to make Admin Post Navigation plugin work and improve the appearance of the previous and next buttons tooltips.
Admin Post Navigation is a plugin that adds links to previous and next items when viewing an individual post/page/CPT edit screen in WordPress for all post types out of the box.
The problem with the plugin (v2.1 as of today) is that it does not work with Gutenberg.
There's a newer plugin called Buttons to Edit Next/Previous Post but it adds the buttons only for posts and pages and not other CPTs and no filter is provided for this.
Admin Post Navigation offers more flexibility by providing filters - for example to change the previous and next text.
We shall
- move the admin post nav into the edit post header settings so the previous and next links aren't hidden anymore in the WordPress Gutenberg editor
- add WP editor classes to the previous and next links so they look like buttons
- use CSS to replace the regular titles with larger tooltips
- change the text for the "previous" button to "Older →"
- change the text for the "next" button to "← Newer"
For Pages:
For Posts (and Custom Post Types):
Step 1
Install and activate Admin Post Navigation plugin.
Step 2
Install and activate Advanced Scripts.
Note: Code for users of Code Snippets/WPCodeBox is also provided below.
Add a new script like this:
Note that current_screen is not an option for the hook that is present by default in the plugin's interface. You would need to delete the default plugins_loaded and type/paste current_screen and press comma.
Code: