How to change wodpress paging to load more

Asked

Viewed 62 times

0

I have a site in wordpress, Thema is the TOTAL. In the pagination of this theme, are the page numbers and the previous and next arrows. What I want is to replace this pagination with a button to press more, where the user will click to load more posts and portfolio.

In short, replace default paging for a button to press more.

I found that the file that loads the portfolio is vcex_portfolio_grid.php

The pagination area is this one:

// Display pagination if enabled
        if ( 'true' == $atts['pagination']
            || ( 'true' == $atts['custom_query'] && ! empty( $wpex_query->query['pagination'] ) )
        ) {
            $output .= wpex_pagination( $wpex_query, false );
        }

    $output .= '</div>';

    // Reset the post data to prevent conflicts with WP globals
    wp_reset_postdata();

1 answer

0

Speaking partner!

You will replace that standard Wordpress pagination by the following code:

<div class="fetch">
    <?php next_posts_link( __( 'Carregar mais posts', 'nome-do-tema' ) ); ?>
</div>

<script type="text/javascript">
$('.fetch a').click(function(e) {
    e.preventDefault();
    $(this).addClass('loading').text('Carregando...');
    $.ajax({
        type: "GET",
        url: $(this).attr('href') + '#boxes',
        dataType: "html",
        success: function(out) {
            result = $(out).find('#boxes .box');
            nextlink = $(out).find('.fetch a').attr('href');
            $('#boxes').append(result);
            $('.fetch a').removeClass('loading').text('Carregar mais posts');
            if (nextlink != undefined) {
                $('.fetch a').attr('href', nextlink);
            } else {
                $('.fetch').remove();
            }
        }
    });
});
</script>

If it still doesn’t work, check in the browser console that the function I gave you isn’t being recognized. Then just test by changing the location function, ie leaving above or below the main jquery.

I hope I’ve helped!

  • Thanks for the attention brother! Sorry for the ignorance, but this I do in the file functions.php of the theme (TOTAL)?

  • No friend.. You must insert in the template file itself, where you find the include of your default paging. I mean, just replace it with all the stuff I sent you, leaving it in the same spot as the pattern.

  • In the portfolio pagination file, the area appears like this: // Display pagination if enabled if ( 'true' == $atts['pagination'] || ( 'true' == $atts['custom_query'] && ! Empty( $wpex_query->query['pagination'] ) ) ) { $output .= wpex_pagination( $wpex_query, false ); } $output .= '</div>'; // Reset the post data to Prevent Conflicts with WP globals wp_reset_postdata();

  • Hum! So you are using a custom template, different from what already comes in the Wordpress package. In your case, you will need to analyze more carefully to replace the function I passed. You can inform me the name of the template you are using?

  • Of course, it’s TOTAL - https://themeforest.net/item/total-responsive-multipurpose-wordpress-theme/6339019 . For the portfolio I’m using the theme module

  • Buddy, you’re gonna have to keep testing, switch to that code I gave you. If your theme was the default that comes in Wordpress, it would be much easier. Anyway, I always use this code on my sites and works well!

Show 1 more comment

Browser other questions tagged

You are not signed in. Login or sign up in order to post.