Я хочу разбивать страницы WordPress в пользовательском цикле с помощью Ajax, поэтому, когда я нажимаю на загрузку, появятся новые сообщения о кнопках.
Мой код:
<?php $postsPerPage = 3; $args = array( 'post_type' => 'post', 'posts_per_page' => $postsPerPage, 'cat' => 1 ); $loop = new WP_Query($args); while ($loop->have_posts()) : $loop->the_post(); ?> <h1><?php the_title(); ?></h1> <p> <?php the_content(); ?> </p> <?php endwhile; echo '<a href="#">Load More</a>'; wp_reset_postdata(); ?>
Этот код не разбивается на страницы. Есть лучший способ сделать это?
Кнопка « Load More
должна отправить запрос ajax
на сервер, и возвращаемые данные могут быть добавлены к существующему контенту с использованием jQuery или простого javascript. Предполагая, что вы используете jQuery, это будет стартовый код.
Пользовательский обработчик Ajax (клиентская сторона)
<a href="#">Load More</a>
Изменить на:
<a id="more_posts" href="#">Load More</a>
Javascript: – Поместите это в нижней части файла.
//</script type="text/javascript"> var ajaxUrl = "<?php echo admin_url('admin-ajax.php')?>"; var page = 1; // What page we are on. var ppp = 3; // Post per page $("#more_posts").on("click",function(){ // When btn is pressed. $("#more_posts").attr("disabled",true); // Disable the button, temp. $.post(ajaxUrl, { action:"more_post_ajax", offset: (page * ppp) + 1, ppp: ppp }).success(function(posts){ page++; $(".name_of_posts_class").append(posts); // CHANGE THIS! $("#more_posts").attr("disabled",false); }); }); //</script>
Пользовательский обработчик Ajax (на стороне сервера) PHP. Поместите это в файл functions.php.
function more_post_ajax(){ $offset = $_POST["offset"]; $ppp = $_POST["ppp"]; header("Content-Type: text/html"); $args = array( 'post_type' => 'post', 'posts_per_page' => $ppp, 'cat' => 1, 'offset' => $offset, ); $loop = new WP_Query($args); while ($loop->have_posts()) { $loop->the_post(); the_content(); } exit; } add_action('wp_ajax_nopriv_more_post_ajax', 'more_post_ajax'); add_action('wp_ajax_more_post_ajax', 'more_post_ajax');