Previous/Next arrows or links on single pages, similar to single posts

Hi,

I would like to be able to add navigation links at the bottom of single pages.

I am able to add the code below to the child theme’s functions.php, which adds a previous/next link on posts, and I wondered if something similar might be possible on pages?

add_action ('the_content', 'add_next_post_item_link' );

function add_next_post_item_link ( $content ) {
    if ( is_singular('post') ) {
	    $next_name = "Next Post <i class=\"x-icon-chevron-right\"></i>";
	    $prev_name = "<i class=\"x-icon-chevron-left\"></i> Previous Post";
	    $next_link = get_next_post() ? '<a style="float: left;" href="' . get_permalink( get_next_post()->ID ) . '">' . $prev_name . '</a>' : '';
	    $prev_link = get_previous_post() ? '<a style="float: right;" href="' . get_permalink( get_previous_post()->ID ) . '">' . $next_name . '</a>' : '';
	    $posts = '<div class="wp-post-navigation-next">'.$next_link.$prev_link.'</div>';
	    return $content . $posts;
    } else {
	    return $content;
    }
}

Very grateful for any help that can be offered here.

Hi There,

Thanks for writing in!
Please check this article for a possible solution!
https://codex.wordpress.org/Next_and_Previous_Links

At the end of the article, there is a code snippet and a plugin suggested to make it works.

Thanks

Thanks, that’s helpful, I will try the plugin.

Meanwhile, can you give me the correct functions.php code to allow previous/next arrows on single posts? The code above is old, and the one I found here doesn’t work:

Thanks again.

Hey Michael,

Before I point to the solution, please understand that the theme already has a Previous and Next arrows already existing in Integrity, Icon and Ethos stacks. Adding your own requires custom development and it should be your responsibility to maintain and enhance.

Your code does not work because of the space in the add_action function.

The icons in that function won’t work also because Font Awesome has been update to V5 so structural changes need to be made.

Here is the working code with working icon:

add_action( 'the_content', 'add_next_post_item_link' );

function add_next_post_item_link ( $content ) {
    if ( is_singular('post') ) {
	    $next_name = 'Next Post <i class="x-icon x-icon-chevron-right" data-x-icon="&#xf054;"></i>';
	    $prev_name = '<i class="x-icon x-icon-chevron-left" data-x-icon="&#xf053;"></i> Previous Post';
	    $next_link = get_next_post() ? '<a style="float: left;" href="' . get_permalink( get_next_post()->ID ) . '">' . $prev_name . '</a>' : '';
	    $prev_link = get_previous_post() ? '<a style="float: right;" href="' . get_permalink( get_previous_post()->ID ) . '">' . $next_name . '</a>' : '';
	    $posts = '<div class="wp-post-navigation-next">'.$next_link.$prev_link.'</div>';
	    return $content . $posts;
    } else {
	    return $content;
    }
}

Hope that helps and thank you for understanding.

Hi @christian_y

Thanks for your reply, but I’m not sure I understand. If the theme already has previous and next arrows, how is it that I don’t see them on single posts? Is there somewhere that this functionality needs to be enabled?

The only way I understood these previous/next arrows could be enabled is by using something like the code you have supplied, is this incorrect?

Thanks again.

It is either you’re using the Renew stack or you have the Breadcrumbs disabled where the Previous and Next links are situated.

Otherwise yes, previous/next links could be added using the custom code.

Thanks.

Ok, yes I realise now that the previous/next navigation is part of the breadcrumbs function in Integrity. As I don’t want breadcrumb navigation, it’s best for me to use the custom code.

Can I request that some kind of customisable previous/next functionality be incorporated into a future version of X, perhaps as a Cornerstone element? I imagine many users would see this as a great addition to X.

Thanks again.

Sure. I’ll post this as feature request.

Thanks for your feedback.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.