5

Hey all, I'm attempting to do convert my current pagination:

  • from : Prev 1 2 3 Next
  • to: Page 1 of 2 -->

My current code looks like this:

if( ! function_exists( 'my_pagination' ) ) {
    function my_pagination() {
        global $wp_query;    
        $big = 999999999; // This needs to be an unlikely integer
        $paginate_links = paginate_links( array(
            'base' => str_replace( $big, '%#%', get_pagenum_link($big) ),
            'current' => max( 1, get_query_var('paged') ),
            'total' => $wp_query->max_num_pages,
            'mid_size' => 0,
            'prev_next' => True,            
            'prev_text' => __('<span class="fa fa-long-arrow-left" aria-hidden="true"></span>'),
            'next_text' => __('<span class="fa fa-long-arrow-right" aria-hidden="true"></span>'),
            'type' => 'list'
        ) );
        if ( $paginate_links ) {
            echo '<div class="pagination">';
            echo $paginate_links;
            echo '</div>';
        }
    }
}

I have had NOT much experience at all dealing with pagination in WordPress until now, that is. I thought I'd make it easy on myself and simply change the_size to 0, then just use CSS before and after to add the page of, like so:

.pagination li:first-child:before {
    content: "Page "
}

.pagination li:first-child:after {
    content: " of"
}

But then I notice that WordPress is inserting:

<li><span class="page-numbers dots">…</span></li>

Because of the 'mid_size' => 0, and obviously I could just use li:nth(2) { display: none; } in the CSS. But then another issue is that the last page number is a href which is something I don't want either, so using all these work around methods just seems like a botched job and rather to do in the codex rather than the CSS. I've tried several solutions with no success.

How do I disable the adding of:

  • <span class="page-numbers dots">…</span>?
  • <a href> on the last page number?
  • Or how do you recommend I proceed altering the current array?
1
  • IIRC the one time I needed to use paginate_links I ended in "forking" it. Found it much simpler then figting its assumptions and complexity Apr 23 '16 at 12:39
4

Here's a workaround:

First change the paginate_links() output type to:

'type' => 'array',

Then we can collect the previous, current and next parts from the paginate_links() output.

Here's a simple example where we target the relevant classes:

$next       = '';
$current    = '';
$prev       = '';
foreach( (array) $paginate_links as $link )
{           
    if( false !== strpos( $link, 'prev ' ) )
        $prev = $link;
    elseif( false !== strpos( $link, ' current' ) )
        $current = $link;       
    elseif( false !== strpos( $link, 'next ' ) )
        $next = $link;
}

Finally we can construct the output as needed:

! empty( $current ) && printf(
    '<div class="pagination">%s %s %s %s %d %s</div>',
    $prev,
    esc_html__( 'Page', 'my-domain' ),
    $current,
    esc_html__( 'of', 'my-domain' ),
    $wp_query->max_num_pages,
    $next
);
3
  • Hey @Birgire, this almost works but apart from on pages with results fewer than 1 page results in an error (Invalid argument supplied for foreach() in functions.php on line 26) Here's how I added your code to my current code with the changes you suggested: jsfiddle.net/SimonHayter/6uLLpomr Apr 24 '16 at 12:43
  • @SimonHayter, I think we could add an array casting in the foreach loop and a check for non-empty $current before printing, to cover that.
    – birgire
    Apr 24 '16 at 13:03
  • you're welcome, glad to hear it worked for you @SimonHayter
    – birgire
    Apr 24 '16 at 15:32

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.