Топ-100 Accordion Menu
Создать акаунт
NULLTOP » CMS » DLE » Плагины DLE » AJAX навигация в custom

AJAX навигация в custom

08 янв 2024, 19:44
Плагины DLE
11
0
AJAX навигация в custom

AJAX навигация в custom 

Для DLE есть несколько платных модулей для AJAX навигации или AJAX подгрузки новостей в {custom}. Но мы хотим бесплатно, поэтому решено создать свой. Пораскинув мозгами, решил не умничать и взял за основу древнюю статью AJAX навигация в теге Custom - реализация от Sander'a. Адаптировал, допилил и получилось это...

Модуль поддерживает кэширование страниц (отдельный кэш для каждой страницы) и запоминание страниц в постраничной навигации.

Установка:

  1. Установить модуль через систему плагинов.
  2. Добавить в JS вашего шаблона:
    /* AJAX навигация в custom */
    var cn = localStorage.getItem('custom_nav'), hh = $('.header').height(); // читаем запись в localStorage и получаем высоту header'а (заменить на свой класс при необходимости)
    if(cn) { // если запись есть
        var cid = cn.split(',')[0], cp = cn.split(',')[1]; // получаем параметры
        if(cp == '1') localStorage.removeItem('custom_nav');
        else custom_navig(cid,cp); // вызываем функцию, если не первая страница
    }
    function custom_navig(id,p,t){
        $.get('engine/ajax/controller.php?mod=custom',{id:id,page:p},function(d){
            if(t){ // если это подгрузка
                t.remove(); // удаляем кнопку подгрузки
                $("#"+id).append(d); // добавляем контент в блок с custom
                localStorage.removeItem('custom_nav'); // удаляем запись в localStorage
            } else { // если это постраничная навигация
                $("#"+id).html(d); // заменяем содержимое блока на полученные данные
                localStorage.setItem('custom_nav', id+','+p); // пишем в localStorage
            }
            // прокручиваем страницу до разделителя/начала блока
            $('html,body').animate({scrollTop: $('#'+id+p).offset().top-(hh*2)}, 600);
        })
    }
  3. Очистить кэш.


Использование:

<div id="lenta">{custom idblock="lenta" navtpl="custom_nav"}</div>


где lenta - это ID родительского блока {custom} (обязательный параметр), custom_nav - файл шаблона для навигации (если параметр не указан, выводится стандартная ссылка на подгрузку). В качестве шаблона можно указать стандартный шаблон navigation.tpl, все теги поддерживаются.

В шаблоне custom_nav.tpl (или в любом, который вы указали) доступны теги:

[next]Текст[/next] - для вывода ссылки для подгрузки
[prev-link]Текст[/prev-link] - для вывода ссылки на предыдущую страницу
[next-link]Текст[/next-link] - для вывода ссылки на следующую страницу
{pages} - для вывода списка страниц


Количество страниц до разделителя "..." указывается в функции custom_navig() в переменной $count (в движке где-то прописано это количество).

Обновление от 16.12.2023, в котором переработан и оптимизирован код. Из ссылок навигации убран js (onclick) и добавлены ссылки на страницы. Переделана работа с кэшом и изменён JS-код для работы с навигацией. Следует изменить имя параметра в {custom} на block="lenta":

Версия:
17.0
Категория:
Плагины DLE
Автор:
ravchik
Источник:

Все материалы, представленные на сайте, носят исключительно ознакомительный характер!

Если ссылка битая, пожалуйста сообщите нам через форму комментариев или в ЛС

Комментарии
Минимальная длина комментария - 50 знаков. комментарии модерируются
Кликните на изображение чтобы обновить код, если он неразборчив

Смотрите также: