5

Доброго времени суток. У меня есть сайт на WP. Я пытаюсь сделать AJAX подгрузку постов. Понимаю, что тема избитая, но нигде не удалось найти единого решения, которое хоть как-то можно адаптировать под мой случай.

В разделе "новости" выводятся записи (2 штуки). Под этим блоком есть кнопка "Читать далее". По клику на ней должны появляться еще две новости. И так далее. У меня нет ни пагинации, ничего, по чему можно было бы понять, на какой странице ты находишься. Я попыталась написать решение самостоятельно, но оно не работает (я подозреваю, что что-то не так в PHP и получении данных в AJAX, но что именно - сказать не могу).

Что вообще должен запрашивать AJAX и отдавать PHP? Спасибо.

Структура вывода постов:

<div class="row">       

            <?php if ( have_posts() ) :  while ( have_posts() ) : the_post(); ?>
              <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12 news-item">
              <div class="news-date">
                <?php the_time($format = 'j F Y'); ?>
              </div>
              <div>
                <h3><?php the_title(); ?></h3>
                <p><?php the_content(); ?></p>
              </div>
            </div>
            <?php endwhile; ?>
            <?php endif; ?>

          </div>

          <div class="more-link"><a href="#">Read more></a>
              </div>

JS

$(function() {


    var posts = 2;
    var posts_offset = 0;

    $("#load-post").click(function() {


                $.ajax({
                type: "GET",
                url: "/wordpress/wp-admin/themes/my_theme/load-posts.php", 
                dataType: 'html',
                data: ({ <?php $posts ?>}),
                success: function(data){
                    $('.news').append(data);
                    posts_offset += 2;

                }
            });
        }

    });
});

PHP

if (isset($_GET['posts_offset']))
{
  $posts_offset = $_GET['posts_offset'];
}
$posts = get_posts( array(
  'numberposts'     => 2,
  'offset'          => $posts_offset
) );

!!UPD!!

Поправила код, теперь происходит следующее: в конец .news аппендится код из PHP файла, а не дополнительные посты.

JS

    $(function () {

  var posts = 2;
  var posts_offset = 0;

  $("#load-post").click(function (e) {
    e.preventDefault();

    $.ajax({
      type: "POST",
      url: "/wp-content/themes/1cka/load-posts.php",
      dataType: 'html',
      data: {
        posts_offset: posts_offset
      },
      success: function (data) {
        $('.news').append(data);
        posts_offset += 2;

      }
    });
  })
});

PHP

<?php require_once("header.php"); ?>
<?php
if (isset($_GET['posts_offset']))
{
  $posts_offset = $_GET['posts_offset'];
}

global $post;

// записываем $post во временную переменную $tmp_post
$tmp_post = $post;
$args = array( 'posts_per_page' => 2, 'offset'=> $posts_offset );
$myposts = get_posts( $args );
foreach( $myposts as $post ) : setup_postdata($post); ?>
    <?php if ( have_posts() ) :  while ( have_posts() ) : the_post(); ?>
            echo  '<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12 news-item">
              <div class="news-date">
                <?php the_time($format = 'j F Y'); ?>
              </div>
              <div>
                <h3><?php the_title(); ?></h3>
                <p><?php the_content(); ?></p>
              </div>
            </div>'
            <?php endwhile; ?>
            <?php endif; ?>
<?php endforeach; 

$post = $tmp_post;

?>
13
  • Что возвращает get_posts()? Рискну предположить, что в $posts записывается строка с самими постами. Попробуйте добавить echo $posts;
    – froxxendsg
    Commented 2 июн. 2015 в 19:25
  • И ещё, непонятно, что Вы пытаетесь отправить скрипту, судя по всему, он должен принимать posts_offset, это и отправляйте.
    – froxxendsg
    Commented 2 июн. 2015 в 19:31
  • Дополнила код исправлениями. Я слабо представляю, что делать в JS c posts_offset, ведь мы его используем, чтобы получить посты в PHP Commented 2 июн. 2015 в 19:44
  • "аппендится код из PHP файла, а не дополнительные посты." -- ну да, а разве load-posts.php не выводит эти самые посты? | Насколько понимаю, posts_offset - это смещение постов.
    – froxxendsg
    Commented 2 июн. 2015 в 20:15
  • posts_offset - это начиная с какого поста начинать показывать, идея такая: каждый раз по нажатию на кнопку php передает два предыдущих поста и увеличивает posts_offset на 2, чтобы в следующий раз показать следующие. Commented 2 июн. 2015 в 20:21

1 ответ 1

0

Очень хороший и понятный пример для организации подгрузки при скроле, так и на клик: https://www.billerickson.net/infinite-scroll-in-wordpress/ Правда в JS нужно ещо прикрутить проверку существует ли такой класс на странице, чтобы не выдавало ошибок в консоли

if( $('.post-box-list').length ) { 
Код тут
}

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.