Бесконечная прокрутка Супер плагин WordPress

Бесконечная прокрутка Супер плагин Wordpress Прибамбасы для сайта

Привет! Мы продолжаем разбирать самые интересные и самые полезные плагины для сайта WordPress! Сегодня вы узнаете как можно очень просто и быстро сделать на своём сайте бесконечную прокрутку любых типов записей. Вы сможете сделать бесконечную прокрутку для страниц, записей, медиафайлов, изображений, чата, аудиозаписей, ссылок, галерей, видео и т.д.

Вы сможете добавить бесконечную прокрутку на любую страницу с помощью простого шорткода. Создать шорткод можно прямо из меню визуального редактора WordPress.

 

 

 

Бесконечная прокрутка записей плагин WordPress

 

Установить Супер плагин Ajax Load More – Infinite Scroll вы сможете прямо из админ-панели WordPress. Перейдите на страницу: ПлагиныДобавить новый, введите название плагина в форму поиска, нажмите Enter, установите и активируйте плагин.

 

Ajax Load More - Infinite Scroll

 

Далее, после установки и активации плагина, перейдите на страницу: Ajax Load MoreSettings. Здесь вы сможете настроить основные параметры плагина.

 

Ajax Load More

 

Для начала нужно настроить основные параметры:

 

– Container Type, здесь можно изменить тип контейнера, но не обязательно.

– Container Classes, можно добавить классы для контейнера, не обязательно.

– Disable CSS, можно отключить CSS стили плагина, чтобы использовать свои стили. Не обязательно.

– Button/Loading Style, здесь вам нужно выбрать стиль загрузки контента. У вас на выбор два варианта – кнопка или бесконечная прокрутка. Нажмите по полю “Chasing Arrows”, чтобы выбрать подходящий для вас вариант.

– Button Classes, можно добавить классы для кнопки. Не обязательно.

– Ajax Security, защита URL адресов от злоупотребления Ajax запросов. Рекомендуется включить.

– Top of Page, на начальной странице загрузки, переместить окно браузера пользователя в верхнюю часть экрана. Это может помочь предотвратить загрузку ненужных сообщений.

– Dynamic Content, отключить динамическое население категорий, тегов и авторов в шорткод Builder. Рекомендуется , если у вас есть необыкновенное количество категорий, тегов и / или авторов.

– Editor Button, можно скрыть кнопку для создания шорткодов из визуального редактора WordPress, на странице редактирования записи или страницы.

– Error Notices, уведомления об ошибках. Рекомендуется включить.

Сохраните настройки.

 

Далее, мы будем создавать шорткод для добавления на сайт бесконечной прокрутки. Вы можете создать шорткод на странице – Shortcode Builder.

 

Shortcode Builder

 

Если вы хотите добавить бесконечную прокрутку сразу в запись или на страницу, то можно создать шорткод прямо из визуального редактора WordPress, с помощью специальной кнопки.

 

Shortcode Builder

 

Что в первом, что и во втором варианте, настройки абсолютно одинаковые, сейчас мы их разберём:

 

– Template, шаблон оставьте по умолчанию, ничего менять здесь не надо.

– ID, если вы собираетесь добавлять бесконечную прокрутку на несколько страниц, с разными типами вывода записей, то вам нужно указать здесь уникальный идентификатор, чтобы шорткоды отличались. Нажмите под полем на вкладку – Generate Unique ID, чтобы добавить уникальный ID.

– Container Type, можно указать тип контейнера. Не обязательно.

– Container Classes, можно добавить классы для контейнера, не обязательно.

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

– Loading Label, здесь можно указать надпись, которая отображается на кнопке во время загрузки контента.

 Images Loaded, загружать изображения перед загрузкой основного содержимого. Не обязательно включать данную функцию.

– Pause, не загружать сообщения пока пользователь не нажмёт на кнопку.

– Enable Scrolling, включите данный параметр, чтобы включить бесконечную прокрутку. При прокрутки страницы записи будут автоматически подгружаться, то есть на кнопку жать не надо.

– Scroll Distance, расстояние от нижней части экрана, чтобы вызвать загрузку сообщений. (По умолчанию = 150)

– Maximum Pages, максимальное количество страниц для загрузки во время прокрутки. (0 = без ограничений)

– Pause Override, разрешить прокрутку, чтобы переопределить параметр Pause и запустить загрузку сообщений при прокрутке.

– Transition Type, можно выбрать стиль загрузки перехода.

– Transition Speed, скорость перехода в миллисекундах.

– Transition Container, удалить контейнер загрузки, не рекомендуется!

– Destroy After, удалить ajax загрузку после загрузки определённого количества страниц (укажите количество в поле). Не обязательно!

– Posts Per Page, укажите здесь сколько будет загружаться записей или страниц за один раз.

– Post Type, выберите здесь, какие типы записей вы хотите добавить в бесконечную прокрутку.

– Post Format, можно выбрать формат сообщений. Выберите стандартный формат, для вывода значений по умолчанию.

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

 Date, можно указать дату, для запроса по дате архива, чтобы выводились записи из определённого архива. Не обязательно.

– Custom Fields (Meta_Query), можно выводить определённые пользовательские поля, указав здесь их данные. Не обязательно! Оставьте без изменений!

– Author, можно выбрать автора, чтобы выводились только его записи. Не обязательно!

– Search Term, здесь можно указать слово или слова, по которым будут выводиться записи. То есть, если в записи есть такое слово, значит запись будет показана. Не обязательно!

– Post Parameters, здесь можно включить или исключить определённые записи, указав их ID. Можно выбрать статус записи, например, опубликованные или нет.

– Ordering, здесь можно выбрать, по каким параметрам сортировать записи при выводе их в бесконечной прокрутке. Можно оставить по умолчанию.

– Offset, здесь можно задать смещение. Например, если указать 5, то первые 5 записей будут пропущены.

– Custom Arguments, через точку с запятой список разделенных пользовательских значений. Могут быть использованы для запроса по параметрам, не доступных в шорткоде. Не обязательно!

 

Далее, после создания шорткода, скопируйте готовый шорткод.

 

ajax_load_more

 

Шорткод необходимо добавить на страницу, где будет бесконечная прокрутка. Если в шорткоде вы выбрали тип записей post, то в бесконечной прокрутке будут выводится последние записи и т.д. Всё очень просто! Плагин лично проверял, всё работает!

Кстати, забыл рассказать, на вкладке “Repeater Templates” отображается код шаблона записей, которые будут отображаться в бесконечной прокрутке. Доступен только один шаблон, можно заказать дополнительные темы, но уже платно. Если вы разбираетесь в коде, то вы можете его изменить под себя.

 

Ajax Load More: Repeater Templates

 

Остались вопросы? Напиши комментарий! Удачи!

 

info-effect.ru
Добавить комментарий для Илья Журавлёв Отменить ответ

Имя и Email указывать не обязательно. Чтобы получить ответ на свою электронную почту, укажите свой Email.

  1. Алёна

    Привет! А как сделать, чтобы кнопка скрывалась, когда уже выведены все записи, и больше загружать нечего?

    Ответить
    1. Admin автор

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

      Ответить
      1. Алёна

        Я уже разобралась, в настройках ничего такого не нашла, но когда выведены все записи, кнопке автоматом добавляется класс .done, я просто указала классу .done{display: none} и тогда она скрывается.

        Ответить
        1. Admin автор

          Отлично, молодец !

          Ответить
  2. Александр

    Добрый день. Так куда шорткод вставлять? При создании новой страницы иконки оранжевой нет. А по остальному я туп))

    Ответить
    1. Admin автор

      Здравствуйте. Шорткод можно ставить на любую страницу, где будет бесконечная загрузка записей.

      Ответить
  3. Артем

    Добрый день, у меня выводится 10 постов, при нажатии на Load more подгружаются остальные посты, но среди них есть дубликаты из первой 10-ки, как этого избежать?

    Ответить
    1. Admin автор

      Здравствуйте. Внимательно читайте настройки. Я писал об этом. Параметры Post Parameters и Offset.

      Ответить
  4. Кирил

    Добрый день! А как поисковики к этому относятся, проблем с индексацией и выдачей не будет?

    Ответить
    1. Admin автор

      Здравствуйте. Не будет. XML карту сделайте и всё нормально будет.

      Ответить
      1. Кирил

        Ок. Спасибо за совет, поэкспериментирую!

        Ответить
  5. Алексей

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

    Ответить
    1. Admin автор

      Здравствуйте. В настройках создания шорткода смотрите параметр Ordering, там можно выбрать тип сортировки.

      Ответить
      1. Алексей

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

        Ответить
        1. Admin автор

          Как у вас записи сортируются, в настройках Ordering что указано?

          Ответить
          1. Алексей

            Настройка указана Desc и в настройках и в шорткоде
            Выгляните пожалуйста и вы поймете о чем я.

          2. Admin автор

            В основных настройках отключите параметр Dynamic Content.

  6. Алексей

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

    Ответить
    1. Admin автор

      Здравствуйте. В файл single.php ставьте код, тогда во всех записях будет.

      Ответить
      1. Алексей

        Скажите, а в PHP файл добавлять простой шорткод (например [ajax_load_more])?

        Ответить
        1. Алексей

          Сам спросил, сам ответил… совсем из головы вылетело))

          Ответить
          1. Admin автор

            Разве там нет php кода или только шорткод?

  7. Алексей

    Этим плагином нельзя сделать подгрузку следущей записи?

    Ответить
    1. Admin автор

      Если вы имеете ввиду целую запись, нет нельзя. Но, можно изменить шаблон записи.

      Ответить
  8. Владимир

    Как тоже самое работает для Woocommerce что только не делал не работает ваш плагин для товаров

    Ответить
    1. Admin автор

      Только что проверял, всё работает. В настройках Shortcode Builder – Post Type, нужно выбрать Товар.

      Ответить
  9. Владимир

    Подскажите как решить эту проблему?

    Ответить
  10. Владимир

    Выбирал товар, всеравно не отображается

    Ответить
    1. Admin автор

      Значит что-то не так делаете.

      Ответить
  11. Амар

    Здравствуйте.
    Мобильное отображение ужас, слева картинка, а справа тонкий текст (((

    Подскажите плиз что нужно поправить в “коде шаблона” что бы стало так:
    -Заголовок-
    -Картинка-
    -Начало текста-

    Ответить
    1. Admin автор

      Добрый день. Да, такой шаблон у плагина по умолчанию. Там есть платные шаблоны. По коду ничего не могу сказать.

      Ответить
  12. павел

    Всем привет! Думаю актуальный вопрос. Как убрать эффект паралакс для мобильных, а то крайне прыгает на мобильных. Тема Shop ilse.Буду признателен за помощь.

    Ответить
    1. Admin автор

      Привет! Очень просто, с помощью CSS, здесь показывал.

      Ответить
  13. Семён

    Здравствуйте .Есть вариант сделать прокрутку по горизонтали ?
    Спасибо…

    Ответить
    1. Admin автор

      Здравствуйте. Смотря чего. Можно сделать горизонтальную прокрутку в виде слайдера для записей, есть такой плагин. Чтобы можно было колесом мыши прокручивать по горизонтали, такого не видал. Хотя, надо посмотреть, может есть такой плагин.

      Ответить
    2. Admin автор

      Есть подобный плагин – Horizontal scrolling announcement

      Ответить
    3. Admin автор

      Вспомнил, есть такая функция у плагина: Master Slider — Responsive Touch Slider

      Ответить
  14. Сергей

    Здравствуйте. Так и непонял, куда нужно его вставлять (шорткод)? Нужно на главной странице сделать бесконечный вывод записей. 

    Ответить
    1. Admin автор

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

      Ответить
  15. Дени

    Здравствуйте! Подскажите пожалуйста как убрать вывод изображений? Чтобы был только текст

    Ответить
    1. Admin автор

      Здравствуйте. Посмотрите настройки Template – можно шаблон изменить., Post Format – можно выбрать формат сообщений. Если не поможет, можно попробовать скрыть изображения с помощью CSS стилей. Может помочь плагин SiteOrigin CSS.

      Ответить
  16. Андрей

    Вставил свой шаблон записи в repeater template, но после этого перестал работать вывод контента из плагина Advanced Custom Fields, который выводился в записи. Вывод проходил через ID, ‘название поля’, true ) ?>

    Ответить
    1. Admin автор

      Здравствуйте. Значит плагины конфликтуют. Надо выяснить из-за чего. В основных настройках плагина Ajax Load More включите параметр Error Notices. Также посмотрите в плагине, который перестал работать, можно ли включить отладку. Если не поможет, зайдите в корневой каталог сайта на хостинге, где все файлы WordPress, типа wp-content, wp-includes. Там должен быть файл error_log, откройте его, нужно найти описание ошибки, её причину и путь к файлу, в котором она воспроизводится.

      Ответить
  17. Артем

    Добрый день! Как настроить плагин для страницы archives.php?

    Ответить
    1. Admin автор

      Здравствуйте. Очень просто. Вставьте в файл php код, в то место, где должна отображаться бесконечная прокрутка.

      Ответить
      1. Артем

        Спасибо за ответ! Хочу дополнить, для тех кто наткнётся еще на это connekthq.com/plugins/ajax-load-more/docs/code-samples/category-archives/

        Ответить
  18. Дмитрий

    Всегда хорошие статье на сайте, спасибо. Когда вижу в выдаче этот ресурс по интересующему вопросу, то всегда его выбираю, даже если ниже конкурентов, так как знаю, что найду адекватный ответ на свой вопрос!

    Ответить
  19. Вероника

    Спасибо за статью, но немного не поняла за параметр Offset: -” здесь можно задать смещение. Например, если указать 5, то первые 5 записей будут пропущены.”

    что такое “смещение”, и зачем пропускать записи?
    Заранее, спасибо за ответ.

    Ответить
    1. Admin автор

      Например, если вы не хотите, чтобы первые 2 или 3 записи из блога отображались в бесконечной ленте. Можно сказать исключение, а не смещение.

      Ответить
      1. Вероника

        Спасибо за ответ, попробую реализовать. Подскажи пожалуйста, у Вас есть статьи, как интегрировать слайдер инстаграмма на сайт? (не Вордпресс, для WP я нашла отличные плагины). Может есть у Вас решение для обычного сайта?

        Ответить
        1. Admin автор

          Не, я только по WP.

          Ответить
  20. Евгений

    как сделать просто кнопку, в настройках не даёт поставить, хотя есть

    Ответить
    1. Admin автор

      Что значит просто кнопку?

      Ответить
  21. gerurd

    А как реализовать функцию Scroll_container, чтобы бесконечная прокрутка была в пределах указанного контейнера ? вставил css –
    div.my_container{
    width: 100% ;
    height: 600px ;
    padding: 5px 10px 20px 30px;
    border: 2px solid #999;
    background: ##EFF8F8;
    }
    в генераторе шорт кода в параметре scroll_container указал my_container. И не работает :(

    Ответить
  22. gerurd

    Заработало, добавил в css параметр overflow-y: auto;. И вот новая напасть, почему то изображения не отображаются 0_о.
    С чем это может быть связано?

    Ответить
    1. Admin автор

      Добрый день. Видимо какая-то несовместимость. Разбираться надо.

      Ответить
      1. gerurd

        Кстати, а длину выводимого анонса как то можно в настройках изменить, или нужно в код лезть ?

        Ответить
        1. Admin автор

          Не нашёл такого параметра. Наверно в платной версии есть.

          Ответить