I have a post page on my site, it shows all posts created in wordpress, however they are many post, so I put an application that only shows 5 posts in the page, and clicking the button created, 5 more post, however, some post comes repeated. I wonder why the posts are coming back.
Functions.php
<?php
add_action('wp_ajax_load_posts_by_ajax', 'load_posts_by_ajax_callback');
add_action('wp_ajax_nopriv_load_posts_by_ajax', 'load_posts_by_ajax_callback');
function load_posts_by_ajax_callback() {
check_ajax_referer('load_more_posts', 'security');
$paged = $_POST['page'];
$args = array(
'post_type' => 'post',
'status' => 'published',
'cat' => 3,
'order' => 'ASC',
'posts_per_page' => '2',
'paged' => $paged,
);
$my_posts = new WP_Query( $args );
if ( $my_posts->have_posts() ) :
?>
<?php while ( $my_posts->have_posts() ) : $my_posts->the_post() ?>
<div class="col-md-12 glossario">
<h2 class="tituloGlossario"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
<a href="<?php the_permalink(); ?>" style="color:#fff;"><p class="textoGlossario"><?php echo wp_trim_words( get_the_content(), 20, '...' ); ?></p></a>
</div>
<?php endwhile ?>
<?php
endif;
wp_die();
}
?>
Post page:
<?php
$args = array(
'post_type' => 'post',
'status' => 'published',
'cat' => 3,
'order' => 'ASC',
'posts_per_page' => '2',
'paged' => 1,
);
$my_posts = new WP_Query( $args );
if ( $my_posts->have_posts() ) :
?>
<div class="my-posts">
<?php while ( $my_posts->have_posts() ) : $my_posts->the_post() ?>
<div class="col-md-12 glossario">
<h2 class="tituloGlossario"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
<a href="<?php the_permalink(); ?>" style="color:#fff;"><p class="textoGlossario"><?php echo wp_trim_words( get_the_content(), 20, '...' ); ?></p></a>
</div>
<?php endwhile ?>
</div>
<?php endif ?>
<div class="loadmore">Load More...</div>
Script:
<script>
var ajaxurl = "<?php echo admin_url( 'admin-ajax.php' ); ?>";
var page = 2;
jQuery(function($) {
$('body').on('click', '.loadmore', function() {
var data = {
'action': 'load_posts_by_ajax',
'page': page,
'security': '<?php echo wp_create_nonce("load_more_posts"); ?>'
};
$.post(ajaxurl, data, function(response) {
$('.my-posts').append(response);
page++;
});
});
});
</script>
Thanks for the help!