[Resolved] How to add pagination to top of archive posts page?

[Justin]

Hello! How would I go about adding the pagination at the top of the page to advance to additional pages on archive pages? As it stands, this feature is at the bottom but we’d like to a) Add it to the top, and b) change the styling to numbers in boxes. Are these tasks feasible? Thanks!!

[Leo]

Hi there,

At the very top of the page?

If so try this snippet:

add_action( 'generate_before_header', 'lh_move_pagination' );
function lh_move_pagination() {
    if ( is_archive() ) {
        the_posts_pagination( array(
	    'end_size' => 2,
	    'mid_size' => apply_filters( 'generate_pagination_mid_size', 1 ),
            'prev_text' => apply_filters( 'generate_previous_link_text', __( '← Previous', 'generatepress' ) ),
	    'next_text' => apply_filters( 'generate_next_link_text', __( 'Next →', 'generatepress' ) ),
	) );
    }
}

Adding PHP: https://docs.generatepress.com/article/adding-php/

[Justin]

Hmm, that’s close to what I need but instead of the very top of the page, I need it in the top of the section – similar to how this support forum has pagination at top and bottom of the forums section. How would I accomplish this for archived post pages?

[Leo]

Hmm try the inside content container:

add_action( 'generate_inside_container', 'lh_move_pagination' );
function lh_move_pagination() {
    if ( is_archive() ) {
        the_posts_pagination( array(
	    'end_size' => 2,
	    'mid_size' => apply_filters( 'generate_pagination_mid_size', 1 ),
            'prev_text' => apply_filters( 'generate_previous_link_text', __( '← Previous', 'generatepress' ) ),
	    'next_text' => apply_filters( 'generate_next_link_text', __( 'Next →', 'generatepress' ) ),
	) );
    }
}

[Justin]

Thanks, that’s better. However, it’s in the upper left. How can I go about adjusting where it lives (i.e. upper right and not so far up?

[Leo]

Actually can you try a different hook? I think it will work better.

add_action( 'generate_before_main_content', 'lh_move_pagination' );
function lh_move_pagination() {
    if ( is_archive() ) {
        the_posts_pagination( array(
	    'end_size' => 2,
	    'mid_size' => apply_filters( 'generate_pagination_mid_size', 1 ),
            'prev_text' => apply_filters( 'generate_previous_link_text', __( '← Previous', 'generatepress' ) ),
	    'next_text' => apply_filters( 'generate_next_link_text', __( 'Next →', 'generatepress' ) ),
	) );
    }
}

Let me know 🙂

[Justin]

That didn’t seem to make any difference. I appreciate the help, but do you have any other suggestions? I am looking to place the pagination at the top – very similar to pagination on these forums!

[Leo]

Hmm I tested the code and it should show up similar to this site.

Can you add the code in so I can see where it’s showing up for you?

[Justin]

Sure! I’ve added it back. You’ll see on our /News page that the pagination is at the top, in the upper left of the container. It doesn’t look like the pagination on these forums. We also want to align it to the right of the content container (and to the left of the sidebar). Thanks in advance!

[Tom]

Sorry we didn’t get back to you quicker – looks like you removed it again.

Any chance you can show me a screenshot of what it looks like when you use Leo’s code?

[Justin]

No worries! It’s actually still there.

[Tom]

Ah, missed it somehow!

Try this code instead:

add_action( 'generate_before_main_content', 'lh_move_pagination', 0 );
function lh_move_pagination() {
    if ( is_archive() ) {
        the_posts_pagination( array(
	    'end_size' => 2,
	    'mid_size' => apply_filters( 'generate_pagination_mid_size', 1 ),
            'prev_text' => apply_filters( 'generate_previous_link_text', __( '← Previous', 'generatepress' ) ),
	    'next_text' => apply_filters( 'generate_next_link_text', __( 'Next →', 'generatepress' ) ),
	) );
    }
}

Let me know 🙂

[Justin]

It’s still in the same place 🙁

[Tom]

The HTML is actually in the correct place now.

Now it just needs a little CSS:

.site-main > .nav-links {
    padding: 40px 40px 0;
}

[Justin]

That worked! Perfect, thanks so much!!

[Author]

Posts