Загрузка статей по Ajax в WordPress - полное руководство
Блог
Делимся с Вами своими знаниями и новостями
26.04.2016

Загрузка статей по Ajax в WordPress – полное руководство

загрузка статей по Ajax

Загрузка статей по Ajax – можно сказать уже полностью стандартный функционал для многих блогов. Сегодня в этой статье мы рассмотрим данный способ, который прекрасно реализован на нашем сайте – Как Вы прекрасно видите, на нашем сайте отлично работает этот способ, и после нажатия на кнопку “Читать далее” подгружаются следующие статьи. Удобно? Безусловно. Итак приступим.

Для примера я рассмотрю вариант, если нам необходимо сделать данную подгрузку на странице блога, это index.php или category.php (все файлы располагаются в папке Вашей темы), обычно эти файлы есть всегда. Ищем вывод из базы наших статей, обычно это что-то в таком вот виде.

Как Вы заметили данный код выводит в цикле все записи. Сразу же после этого кода вставляем нашу кнопку “Загрузить еще”.

Прекрасно, все внедрили. Данный код проверяет, сколько у нас страниц содержит блог наш, если больше одной, выводит кнопку, меньше, не выводит.

ajaxurl – Это обработчик AJAX-запросов в WordPress.

true_posts – Сериализованный массив, содержащий все необходимые параметры запроса, является свойством класса WP_Query.

current_page – Номер текущей страницы.

Но думаю тут все понятно, по оформлению кнопки думаю сами разберетесь, как хотите, так ее и оформляйте. Итак, кнопку мы имеем, правда ничего не происходит если ее нажать, не работает ничего – но не переживайте – переходим к следующему этапу.

Подключение скриптов

Чтобы у нас все красиво работало нам необходимо подключить jQuery. Если Вы этого еще не сделали, в чем лично я сомневаюсь, то подключайте. А нижний код добавляем в файл нашей темы functions.php – если у Вас нету такого файла, такое может быть, если Вы сами создавали тему, то создайте этот файл прямо у себя в директории Вашей темы и туда добавьте следующий код.

Скрипт асинхронной загрузки постов WordPress

Итак, теперь мы дошли до самого интересного, чтобы наша кнопка отлично работала ей нужно показать, как работать и что загружать. Для этого в папке темы создаем файл скрипта, давайте назовем его loadmore.js. И впишем в этот файл следующий код.

Сразу спешу наперед. Данный код я позаимствовал их открытых источников в интернете. Но все работает очень круто, поэтому пусть автор не сердится на меня, но код просто потрясный. Все работает как часики.

Загрузка статей по Ajax – финальный штрих

Ну и последнее, скрипт асинхронно достает данные из php, остался последний штрих, добавить скрипт в funcions.php.

Отличный скрипт, просто потрясный, меняйте в скрипте, как должен отображаться Ваш один пост из ленты постов и все будет отлично работать. Вопросы, лайки и взаимные подписки приветствуются. Всем спасибо за внимание.

P.S. Если нужно удалять записи и вместо удаленных вставлять новые. В этом случае Вам необходимо изменить код в loadmore.js. А именно удалять блоки, которые уже есть. Для этого воспользуйтесь вот таким кодом, просто замените им свой код в loadmore.js.

Обратите внимание. В коде есть запись, куда надо вставить класс тех элементов, которые Вы хотите удалить. Вставляем его туда и будет Вам счастье. По всем вопросам – пишите комментарии.

Метки: ,

Комментарии:

Свяжитесь с нами уже сейчас




Отправляя нам сообщение, содержащее Ваши персональные данные, Вы соглашаетесь с нашей политикой конфиденциальности.
Онлайн заявка


Отправляя нам сообщение, содержащее Ваши персональные данные, Вы соглашаетесь с нашей политикой конфиденциальности.