Are you looking to improve the user experience on your WordPress blog by relocating the “Previous” and “Next” navigation links to the top of your single blog post? With a simple snippet of code, you can effortlessly achieve this.
In this document, we’ll guide you through the process of how to move the “Previous and Next” link to the top of the “Single Blog Post” with a simple code snippet.
How to move the “Previous and Next” link to the top of the “Single Blog Post”
Here’s a quick and easy guide to get you started.
- Log in to your WordPress admin panel using your credentials.
- In the WordPress dashboard, go to “Appearance” and select “Theme File Editor.”
- In the Theme Editor, you should see a list of theme files on the right. Locate and select the `functions.php` file from the list.
- Inside the `functions.php` file, you can add the following code snippet:
add_action('astra_entry_before', 'move_single_post_navigation' );
function move_single_post_navigation() {
astra_single_post_navigation_markup();
}
- After adding the code snippet, click the “Update File” button to save your changes.
This code will hook into the astra_entry_before action, which allows you to add content before the single post content.
Alongside this code, it’s necessary to disable the post navigation for individual blog posts. To accomplish this, follow these steps in the customizer:
- Navigate to Blog > Single Post.
- Activate the “Disable Post Navigation” toggle.
Together, this code and customization will seamlessly move the “Previous and Next” link to the top of the “Single Blog Post”.
Note: We have documentation or an article for you that will assist you in better understanding it. Here’s the link: https://wpastra.com/docs/add-custom-php-code/.
Now, go to one of your single blog post pages on your WordPress site and refresh the page. You should now see the “Previous” and “Next” navigation links displayed at the top of your blog post content, providing a more convenient reading experience for your website visitors.
That’s it! You’ve successfully moved the “Previous” and “Next” navigation links to the top of your single blog post using a simple code snippet.
Note: Remember to make any changes to your theme’s files with caution, and always keep a backup of your site in case anything goes wrong. If you have any questions or need further assistance, leave a comment below.