Add Next Post button at the end of Blog post

Hi there,

you can use this PHP Snippet to convert the themes Next Post link to a button:

function filter_single_post_navigation($output, $format, $link, $post){
    // display post title
    // $title = get_the_title($post);
    $title = __( 'Next Post', 'generatepresss' );
    $url   = get_permalink($post->ID);
    $class = 'button next-post';
    $rel   = 'next';
    return "<a href='$url' rel='$rel' class='$class'>$title</a>";
}

add_filter( 'next_post_link', 'filter_single_post_navigation', 10, 4);

You can use this CSS to force it to fill the space available:

.button.next-post {
    width: 100%;
    text-align: center;
}

That worked like charm.. Thanks for the help David..

Anything we can do to hide the link? just above the next post button (link for previous post).. it shows the native link. I tried hiding it from the customize option in theme... but it seems the next button also gets hidden.

Here's the test page:
https://fatlossplanner.com/test-next-post-button/

Try this CSS:

#nav-below .nav-previous {
    display: none;
}

It worked... You are awesome...

You're welcome