Add Previous and Next Post Links on Single Post Pages

From IThemes Codex
Revision as of 15:43, July 22, 2013 by Elise (Talk | contribs)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to: navigation, search

If you want to show a Previous or Next Post link on a single post page, you can do so using a shortcode. Add the following code at the end of your functions.php file (but before the closing ?>, if any).

Code

function my_previous_next_post() {
    // retrieve the value for next post link
    $next_string = "Next post →";
    ob_start(); 
    next_post_link("%link", $next_string);
    $next_link = ob_get_clean(); 
    
    // retrieve the value for previous post link
    $previous_string = "← Previous post";
    ob_start(); 
    previous_post_link("%link", $previous_string);
    $previous_link = ob_get_clean(); 
    
    // build output
    $return = PHP_EOL . '<div id="next-previous" class="navigation clearfix">' . PHP_EOL;

    // display previous link if any
    if ($previous_link) {
        $return .= '<div class="nav-previous alignleft">'. PHP_EOL;
        $return .= $previous_link. PHP_EOL;
        $return .= '</div>'. PHP_EOL;
    }

    // display next link if any
    if ($next_link) {
        $return .= '<div class="nav-next alignright">'. PHP_EOL;
        $return .=  $next_link . PHP_EOL;
        $return .= '</div>'. PHP_EOL;
    }

    $return .= '</div>';

    return $return;
}
add_shortcode('previous-next-post-links', 'my_previous_next_post');

Usage

Insert the shortcode [previous-next-post-links] in your LoopBuddy layout where you want the Previous and Next post links to appear.

Customize the Appearance

  • you may have to add some styling, using css you can target the classes used in this example
  • you can change the appearance of the links by changing the following lines in the code:
    $next_string = "Next post &rarr;";

and

    $previous_string = "&larr; Previous post";


← Back to LoopBuddy Codex Home

Personal tools
Namespaces
Variants
Actions
iThemes Codex
Codex Navigation
Toolbox