No results found. Try again with different words?

Search must be at least 3 characters.

How to move the “Previous and Next” link to the top of the “Single Blog Post”

Sidebar Image

Did not find a solution? We are here to help you succeed.

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.

"Previous and Next" link to the top of the "Single Blog Post"

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”.

"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.

"Previous and Next" link to the top of the "Single Blog Post"

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.

Was this article helpful?
Sidebar Image

Did not find a solution? We are here to help you succeed.

Related Docs

Join 1,653,898+ Happy Site Owners Using Astra

Whether you are a beginner, small business owner, or professional web developer, Astra provides all the tools you need to easily build your beautiful WordPress website.

REWIND

YEAR IN REVIEW

Download is Just A Click Away!

Membership Retention Checklist Download

Download is Just A Click Away!

Enter your email address and be the first to learn about updates and new features.

Download Free Astra Theme - Modal Popup Form
Scroll to Top
Now choose your preferred
page builder addon
Choose your preferred page builder addon

Download is Just A Click Away!

Enter your email address and be the first to learn about updates and new features.

Download Free Astra Theme - Modal Popup Form