Cara mudah membuat Load more pada WordPress

September 19, 2018 Artikel,Tips dan Trik,WordPress Kholis Muhaimin

Kamu pengen ganti navigation post dengan Load More? Kamu berada di artikel yang tepat, kabar baikinya. Ternyata sangat mudah membuat fitur Load more, pertama kita harus membuat looping dulu. Kemudian copy paste script ke functions.php, Load more ini menggunakan AJAX. Ok langsung aja kita praktek!

Looping


<div class="container">
<div class="entry-content">
<?php
$args = array(
'post_type' => 'post',
'post_status' => 'publish',
'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() ?>
<h2><?php the_title() ?></h2>
<?php the_excerpt() ?>
<?php endwhile ?>
</div>
<?php endif ?>
<div class="loadmore btn btn-info btn-small">Load More...</div>
</div>
<script type="text/javascript">
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>
</div>

Functions.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',
'post_status' => 'publish',
'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() ?>
<h2><?php the_title() ?></h2>
<?php the_excerpt() ?>
<?php endwhile ?>
<?php
endif;

wp_die();
}

Sekarang cek hasil copy paste script di atas, jika berhasil tiap kita klik button Load more..akan muncul artikel lainnya. Artikel akan tampil terus menerus sampai semua artikel semua ditampilkan.

62 total views, 1 views today

Facebooktwittergoogle_plusredditpinterestlinkedinmail