I am using the following code to show next/previous posts in my wordpress theme.

previous_post_link('<span class="left">&larr; %link</span>');
next_post_link('<span class="right">%link &rarr;</span>'); ?> 

It's working but I want to limit the post title which is displayed in the link to a specific length because too big links don't work because of the space I have. And I want to have the arrow within the link so that it shows link and arrow with the same style. Is that possible aswell?

Thank you!


Here's a little coding that should implement this for you:

<?php $max_length = 5; // set max character length here

$next = get_next_post()->ID;
$prev = get_previous_post()->ID;

if( $prev ) {
    $title = get_the_title( $prev );
    $link = get_the_permalink( $prev );
    $post_name = mb_strlen( $title ) > $max_length ? mb_substr( $title, 0, $max_length ) . ' ..' : $title;
        <span class="left">
            <a href="<?php echo $link; ?>" rel="prev" title="<?php echo $title; ?>">&larr; <?php echo $post_name; ?></a>
if( $next ) {
    $title = get_the_title( $next );
    $link = get_the_permalink( $next );
    $post_name = mb_strlen( $title ) > $max_length ? mb_substr( $title, 0, $max_length ) . ' ..' : $title;
        <span class="right">
            <a href="<?php echo $link; ?>" rel="next" title="<?php echo $title; ?>"><?php echo $post_name; ?> &rarr;</a>
} ?>

Hope that helps in your template.

Edit: small fix so this could work with multibyte characters. (mb_strlen - mb_substr)

  • Thank you! Works like a charm. But is there a way to get the two arrows inside the link? That'd look way better I suppose! – Benedikt W May 23 '16 at 13:51
  • I was blind, sorry. Got it now! Thanks for your answer!!! – Benedikt W May 23 '16 at 13:54
  • Oh. No worries, actually there's one arrow (left) which was outside the link. Edited the answer. Have a good day! – Samuel Elh May 23 '16 at 13:56

Can't this be done by css?

.nav_posts .title {
    display: inline-block;
    text-overflow: ellipsis;
    max-width: 30ex;
    white-space: nowrap;
    overflow: hidden;
previous_post_link('<span class="nav_posts left">&larr; <span class="title">%link</span></span>');
next_post_link('<span class="nav_posts right"><span class="title">%link</span> &rarr;</span>');
  • I used the code of @Samuel Elh but I think this could work too. – Benedikt W May 23 '16 at 14:36
  • 1
    I've edited code of @Samuel to use mb_strlen and mb_substr so his code would cope with accents too... you will not have the correction until he validates it... (I'm new to this site and missing points to gain right to comment) – Antony Gibbs May 23 '16 at 14:41

Both of these should trickle down to get_adjacent_post_link() function, which passes result through dynamic {$adjacent}_post_link filter (where $adjacent is previous or next).

You should be able to use this filter to make any changes to final output.

  • I am new to php, what exactly do I have to do? – Benedikt W May 23 '16 at 13:41
  • 1
    I would recommend to start with filters documentation probably. The pure PHP part would not be in scope here, this stack focuses primarily on WP specifics part, some degree of basic PHP proficiency is implied. – Rarst May 23 '16 at 13:48

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.