Каталог решений

Покупка продления купона

Продолжительность:
Общая сумма:
0 руб.
Ваш запрос успешно отправлен!
Условия использования
Продлить
Продолжить покупки

Постраничная ajax-навигация

Почему ваших пользователей бесит постраничная навигация?Вместо просмотра ассортимента, они вынуждены целиться по ссылкам (обычно маленьким).Перезагрузка страницы отнимает время.При возврате со страницы товара приходится проматывать каталог заново.Lazy-load вроде решил эти проблемы, но притащил свои:Не работающая кнопка «Назад»Единый URL, затрудняющий отправку ссылки на нужные товары.Невозможность быстро перейти на нужную страницу, даже если знаешь ее номер.Невозможность домотать до конца страницы.Нас тоже все это дико бесит, поэтому мы сделали модуль «Постраничная ajax-навигация ».За что ваши пользователи полюбят наш модуль:Он удобен:Подгружает товары по мере прокрутки страницы. (по нажатию на большую кнопку «Показать» еще, работающую по аналогии с ЯМ).Возвращает пользователя на то самое место в каталоге, с которого он перешел на страницу товара.Быстро работает:Страница не перезагружается, товары появляются прямо на том же месте.Товары кэшируются, ускоряя загрузку уже открытых и снижая нагрузку на сервер.Учитывает «пользовательские привычки»:Адекватно работает при нажатии кнопки «Назад».Меняет URL страницы, чтобы можно было отправить на ее ссылку.Выводит ссылки на остальные страницы.Не отправляет «подвал» в гиперпространственный «прыжок».За что разработчики полюбят наш модуль:Интеграция не требует копирования шаблонов сайта и страниц с подключением компонентов — ajax-содержимое отдаётся той же страницей, на которой вызван компонент каталога товаров, новостей, статей и т.д.JavaScript-библиотека модуля оснащена коллбэками, с помощью которых вы можете с легкостью добавить нужный функционал, например, «затемнять» контент страницы на время загрузки следующих элементов.Смотрите товары не отвлекаясь на навигацию.И еще кое-что:Если корректно установленный модуль не заработает на вашем сайте, мы вернем деньги (исключение — ваш сайт собран на решении от «Альфа Системс», так как был опыт неудачной интеграции модуля).Подробности в разделе «Ответы на вопросы» вкладки «Установка».

Постраничная ajax-навигация

Постраничная ajax-навигация

Купить: 2 990 руб.
Онлайн-демо
Скриншоты
Описание

Технические данные

Опубликовано:
14.03.2016
Обновлено:
01.12.2016
Версия:
1.0.3
Установлено:
Менее 50 раз
Подходящие редакции:
«Первый сайт», «Старт», «Стандарт», «Малый бизнес», «Эксперт», «Бизнес», «Корпоративный портал», «Энтерпрайз»
Адаптивность:
Да
Поддержка Композита:
Да
Совместимо с Сайты24
Нет

Описание

Почему ваших пользователей бесит постраничная навигация?
  • Вместо просмотра ассортимента, они вынуждены целиться по ссылкам (обычно маленьким).
  • Перезагрузка страницы отнимает время.
  • При возврате со страницы товара приходится проматывать каталог заново.
Lazy-load вроде решил эти проблемы, но притащил свои:
  • Не работающая кнопка «Назад»
  • Единый URL, затрудняющий отправку ссылки на нужные товары.
  • Невозможность быстро перейти на нужную страницу, даже если знаешь ее номер.
  • Невозможность домотать до конца страницы.
Нас тоже все это дико бесит, поэтому мы сделали модуль «Постраничная ajax-навигация ».

За что ваши пользователи полюбят наш модуль:

Он удобен:
  • Подгружает товары по мере прокрутки страницы. (по нажатию на большую кнопку «Показать» еще, работающую по аналогии с ЯМ).
  • Возвращает пользователя на то самое место в каталоге, с которого он перешел на страницу товара.
Быстро работает:
  • Страница не перезагружается, товары появляются прямо на том же месте.
  • Товары кэшируются, ускоряя загрузку уже открытых и снижая нагрузку на сервер.
Учитывает «пользовательские привычки»:
  • Адекватно работает при нажатии кнопки «Назад».
  • Меняет URL страницы, чтобы можно было отправить на ее ссылку.
  • Выводит ссылки на остальные страницы.
  • Не отправляет «подвал» в гиперпространственный «прыжок».
За что разработчики полюбят наш модуль:
  • Интеграция не требует копирования шаблонов сайта и страниц с подключением компонентов — ajax-содержимое отдаётся той же страницей, на которой вызван компонент каталога товаров, новостей, статей и т.д.
  • JavaScript-библиотека модуля оснащена коллбэками, с помощью которых вы можете с легкостью добавить нужный функционал, например, «затемнять» контент страницы на время загрузки следующих элементов.
Смотрите товары не отвлекаясь на навигацию.

И еще кое-что:

Если корректно установленный модуль не заработает на вашем сайте, мы вернем деньги (исключение — ваш сайт собран на решении от «Альфа Системс», так как был опыт неудачной интеграции модуля).

Подробности в разделе «Ответы на вопросы» вкладки «Установка».



Отзывы (3)

Обсуждения (7)
1 - 5 из 7
Что нового
1.0.3 (01.12.2016)
  • Добавлен ещё один infinity (lazyload) режим: авто-предзагрузка новых элементов включается по клику на «Показать ещё». Режим активируется установкой опции lazyDynamicDelayedStart в значение true, при вызове js-библиотеки модуля.
  • Добавлен параметр lazyDynamicOffset у js-библиотеки модуля. Установив его при включенном lazyload-режиме, например в значение -300, новые элементы будут подгружаться недоскролив до постранички 300 пикселей, что позволит незаметно от пользователя дозагружать новые элементы.
  • Рефакторинг js-библиотеки модуля. Добавлена возможность менять параметры вызова плагина «на лету».
1.0.2 (07.09.2016) Исправления js-библиотеки модуля: поправлены ошибки infinity-скролл (lazyload) режима
1.0.1 (25.03.2016) - поправлена ошибка работы js-библиотеки в Firefox
Установка
Модуль требует подключения jQuery. Подключить её можно и нужно строкой <?php CJSCore::Init(array(‘jquery’)); ?>, либо <?php CJSCore::Init(array(‘jquery2’)); ?> в шаблоне сайта. Только при таком подключении jQuery буден подключен «выше» по коду, чем js-библиотека нашего модуля.

При установке модуля в систему копируется новый шаблон постраничной навигации “artmix_ajax_pagination”. Для применения шаблона войдите в настройки компонента, перейдите в раздел “Настройки постраничной навигации” и в настройке “Шаблон постраничной навигации” выберите шаблон “artmix_ajax_pagination”. Сохраните настройки компонента.

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


Рассмотрим на примере интеграции в шаблон компонента bitrix:catalog.section.

Типичный шаблон выглядит так:
<div class="bx_catalog_list">
   <?php 
   foreach ($arResult['ITEMS'] as $key => $arItem) 
   { 
      ?>  <div class="item"> 
            <a href="<?php echo $arItem['DETAIL_PAGE_URL']; ?>" title=""><?php echo $arItem['NAME'] ?></a> 
         </div><?php 
   } 
   ?> 

      ....  

   <?php 
   if ($arParams["DISPLAY_BOTTOM_PAGER"]) 
   { 
      ?><? echo $arResult["NAV_STRING"]; ?><? 
   } 
   ?>
</div>

После адаптации он будет выглядеть так:
<div class="bx_catalog_list js-ax-ajax-pagination-content-container"> 

   <!--ax-ajax-pagination-separator--> 

   <?php 
   foreach ($arResult['ITEMS'] as $key => $arItem) 
   { 
   ?> 
      <div class="item"> 
         <a href="<?php echo $arItem['DETAIL_PAGE_URL']; ?>" title=""><?php echo $arItem['NAME'] ?></a> 
      </div><?php 
   } 
   ?> 

   .... 

   <?php 
   if ($arParams["DISPLAY_BOTTOM_PAGER"]) 
   { 
      ?><? echo $arResult["NAV_STRING"]; ?><? 
   }  
   ?> 

   <!--ax-ajax-pagination-separator--> 

</div> 

...... 

<sc ript>
    if (typeof(jQuery) != 'undefined' && jQuery().axpajax) {
        $(document).ready(function () {
            $('.js-ax-ajax-pagination-content-container').axpajax({
                lazyDynamic: false,            
                lazyDynamicTimeout: 0,
                lazyDynamicOffset: -300,
                lazyDynamicDelayedStart: false,
                pagination: '.js-ax-ajax-pagination-container a.js-ax-pager-link',
                lazyLoad: '.js-ax-ajax-pagination-container .js-ax-show-more-pagination',
                lazyContainer: '.js-ax-ajax-pagination-container',
                specialParams: {
                    ajax_page: true
                },
                callbacks: {
                    beforeLoad: function (obj) { },
                    afterLoad: function (obj) { },
                    onError: function (err) { }
                }
            });
        });
    }
</sc ript>


Что поменялось:
  • Оборачивающему блоку мы добавили css-класс js-ax-ajax-pagination-content-container. Именно по этому классу js-библиотека модуля будет находить блок, куда вставлять результаты ответа сервера
  • Добавили 2 html-комментария <!--ax-ajax-pagination-separator--> — это, так называемые, разделители. Важно, чтобы именно между ними был вывод echo $arResult[‘NAV_STRING’] (или любого другого вывода html постраничной навигации)
  • Добавили блок с js-скриптом, который и инициализирует работу нашей ajax-постраничной навигации. Его лучше всего вставить в самом конце шаблона.


Ответы на вопросы

Почему модуль может не заработать?

  1. У ссылок шаблона нашей постраничной навигации есть ещё какие-то обработчики событий (например, у компонента, в котором используется наша постраничка, включен AJAX-режим. Решение: не использовать его)
  2. Нет подключения библиотеки JQuery
  3. Подключение JQuery «ниже» по коду подключения нашей js-библиотеки постраничной навигации
  4. JQuery подключен 2 или более раз
Напишите нам на info@artmix.ru, мы попробуем помочь. Если ничего не выйдет — вернем уплаченную вами сумму (исключение — ваш сайт собран на решении от «Альфа Системс», так как был опыт неудачной интеграции модуля).

Обратите внимание мы принимаем запросы на возврат в течение месяца с момента покупки.
Поддержка
По вопросам работы и ошибкам модуля: http://support.bitrix.artmix.ru/tickets/. По остальным вопросам: info@artmix.ru

Лицензионное соглашение

Другие решения разработчика

Решение добавлено в корзину

Перейдите в корзину и оформите заказ или продолжите покупки
Перейти в корзину
Продолжить покупки