Sridhar Katakam

Genesis and WordPress Tutorials

How to add links to Previous Post and Next Post on single Posts in Genesis

by 7 Comments

Genesis has a handy function called genesis_prev_next_post_nav() which displays links to previous and next posts.

To display the prev and next post i.e., adjacent entry pagination on single posts, add this in child theme’s functions.php:

// Add single post navigation.
add_action( 'genesis_entry_footer', 'genesis_prev_next_post_nav' );

To give some breathing room below, in child theme’s style.css add

.single .adjacent-entry-pagination {
    margin-bottom: 40px;
}

Want to change the links to the generic “Previous Post” and “Next Post”?

Replace

// Add single post navigation.
add_action( 'genesis_entry_footer', 'genesis_prev_next_post_nav' );

with

add_action( 'genesis_after_entry', 'custom_adjacent_entry_nav' );
/**
 * Display links to previous and next entry.
 *
 * @since 2.3.0
 *
 * @return void Return early if not singular or post type doesn't support `genesis-adjacent-entry-nav`.
 */
function custom_adjacent_entry_nav() {

    if ( ! is_singular() ) {
        return;
    }

    genesis_markup( array(
        'open'    => '<div %s>',
        'context' => 'adjacent-entry-pagination',
    ) );

    echo '<div class="pagination-previous alignleft">';
    previous_post_link( '%link', '&laquo; Previous Post' );
    echo '</div>';

    echo '<div class="pagination-next alignright">';
    next_post_link( '%link', 'Next Post &raquo;' );
    echo '</div>';

    genesis_markup( array(
        'close'    => '</div>',
        'context' => 'adjacent-entry-pagination',
    ) );

}

Note: genesis_next_link_text and genesis_prev_link_text filters apply to archive pagination, not single post’s.

Source: genesis/lib/structure/post.php

  • Note: genesis_next_link_text and genesis_prev_link_text filters apply to archive pagination, not single post’s.

    I was just pulling my hair out trying to get this to work.

    Reply

  • Hi Sridhar,
    I added the code you provided & got the next & previous post links for each single post but for accessibility purpose I want to make clear which one is next post & which one is previous post. So is there a way to add the text next post & previous post before the links so that users can distinguish & understand these links better?

    Reply

    • Hi Raghava,

      Add this in functions.php instead:

      add_action( 'genesis_after_entry', 'custom_adjacent_entry_nav' );
/**
 * Displays links to previous and next entry.
 *
 * @since 2.3.0
 *
 * @return void Return early if not singular or post type doesn't support `genesis-adjacent-entry-nav`.
 */
function custom_adjacent_entry_nav() {

    if ( ! is_singular() ) {
        return;
    }

    genesis_markup( array(
        'open'    => '<div %s>',
        'context' => 'adjacent-entry-pagination',
    ) );

    echo '<div class="pagination-previous alignleft">';
    previous_post_link( '%link', '&#x000AB; Previous Post: %title' );
    echo '</div>';

    echo '<div class="pagination-next alignright">';
    next_post_link( '%link', 'Next Post: %title &#x000BB;' );
    echo '</div>';

    genesis_markup( array(
        'close'    => '</div>',
        'context' => 'adjacent-entry-pagination',
    ) );

}
      Reply

  • Hi Sridhar,
    The information is what I wanted. Thank you so much!!

    I have two questions about the coding. I hope I am not bothering you.
    1. How to move those Prev/Next button at the bottom of the content or above the comment section?
    2. How to modify the text “<< Previous Post” and “Next Post >>”? My site is written in Japanese and I would like to translate them into Japanese.

    Reply
    • >