Separate Next/Previous page links?

  • Resolved itsChimpanzee

    (@chimpanzeeuk)


    14 years ago

    Sorry if I’m being a bit dense here but this seems like it should be so obvious and I can’t figure it out! ??

    At the bottom of my archive page, I have links to ‘Older Posts’ and ‘Newer Posts’. It’s pretty simple:

    <div class="pageNav">
<div class="navLeft"><?php next_posts_link('Older Entries', '0') ?></div>
<div class="navRight"><?php previous_posts_link('Newer Entries', '0'); ?></div>
</div>

    My navLeft and navRight classes float left and right respectively and each have their own arrow-style background image in CSS. I want to do something similar for navigation in multi-page posts but I can’t find a function that will allow me to do it.

    wp_link_pages has various options but will always, it seems, print the ‘Page 1’, ‘Page 2’, ‘Page 3’, etc. or ‘Next Page’ and ‘Previous Page’ links in the same block. There doesn’t seem to be any way to separate them.

    I essentially need previous_page_link and next_page_link functions which work in the same way as posts navigation but no such function seems to exist. I’m surprised these two functions work so differently.

    Any help would be greatly appreciated.

Viewing 5 replies - 1 through 5 (of 5 total)
  • Chip Bennett

    (@chipbennett)

    You should have everything you need, with the arguments available for wp_link_pages():

    <?php $args = array(
    'before'           => '<p>' . __('Pages:'),
    'after'            => '</p>',
    'link_before'      => ,
    'link_after'       => ,
    'next_or_number'   => 'number',
    'nextpagelink'     => __('Next page'),
    'previouspagelink' => __('Previous page'),
    'pagelink'         => '%',
    'more_file'        => ,
    'echo'             => 1 ); ?>

    You want to set:
    – next_or_number to next
    – link_before to <span class="pagelink">
    – link_after to </span>

    Such as:

    <?php wp_link_pages( 'next_or_number=next&link_before=<span class="pagelink">&link_after=</span>' ); ?>

    Then, you just need to style span.pagelink accordingly, e.g.:

    span.pagelink {
     float:left;
     display:block;
     width: 50%;
     text-align:center;
}

    (or however you would like)

    Thread Starter itsChimpanzee

    (@chimpanzeeuk)

    Thanks for replying Chip. The problem is that the link_before and link_after need to be different for the ‘Next’ and ‘Previous’ links (because the background image points in a certain direction) but the function uses the same string for each link.

    Since my first post, I’m managed to cobble together a partial solution by just calling the function twice. It’s not very elegant but…

    https://pastebin.com/yeAfKhrE

    The problem with that is that it echos the ‘before’ and ‘after’ for both, leaving empty DIVs with the background image still there. I’m wondering now if there’s an ‘if’ I can wrap around each one to only call the first one when I’m NOT on the first page and only do the second one if I’m NOT on the last page. Does that make sense? Any ideas on how I could do that… or a better workaround completely?! ??

    Chip Bennett

    (@chipbennett)

    You can make use of the $paged variable.

    Apologies, but I’ll have to come back later to post code examples.

    Thread Starter itsChimpanzee

    (@chimpanzeeuk)

    Ok, I’ve created a really overblown workaround. I’m sure there are better solutions but I’m to the point of not caring now! At least this works!

    https://pastebin.com/NuthYg8c

    Thanks for your efforts, Chip.

    Chip Bennett

    (@chipbennett)

    Sometimes, as long as it works, that’s all that matters. ??

    Glad you figured something out!

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Separate Next/Previous page links?’ is closed to new replies.