Установка:
1. Скачиваем архив и распаковываем его в папку с своим шаблоном.2. В main.tpl своего шаблона, перед: Добавляем:
[aviable=main]
$(function() {
jQuery.ias({
container : '#dle-content', // Название контейнера в котором находятся новости (менять не нужно)
item: '.news', // Название контейнера самой новости
pagination: '.navigation', // Название контейнера навигации по страницам
next: '#page_next a', // Ссылка на следующюю новость
loader: '', // Загрузчик, который появляется при подгрузке страниц
triggerPageThreshold: 2, // Количество страниц, после которых прегратится автоматическая подгрузка и появится кнопка
trigger: 'Ещё' // Текст кнопки
});
});
[/aviable]
[aviable=showfull]
$(function() {
jQuery.ias({
container : '#dle-comments-list', // Название контейнера в котором находятся комменты (менять не нужно)
item: '.comment', // Название контейнера самого коммента
pagination: '.navigation', // Название контейнера навигации по страницам
next: '#page_next a', // Ссылка на следующюю новость
loader: '', // Загрузчик, который появляется при подгрузке страниц
triggerPageThreshold: 2, // Количество страниц, после которых прегратится автоматическая подгрузка и появится кнопка
trigger: 'Ещё' // Текст кнопки
});
});
[/aviable]3. В CSS стили, в любое место, добавляем:
.ajaxProgress {background:#eee url(../images/loader.gif) no-repeat center center;display:block;width:40px;height:40px;margin:10px auto;border-radius:10px;border:1px solid #ddd;}
.ias_trigger a {box-shadow:inset 0px 1px 0px 0px #fff;border-radius:6px;border:1px solid #dcdcdc;display:block;color:#777;font-weight:bold;padding:10px 0;text-decoration:none;margin-bottom:20px;text-shadow:1px 1px 0px #fff;text-align:center;font-size:14px;
background: #f4f4f4;
background: -moz-linear-gradient(top, #f4f4f4 0%, #eaeaea 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f4f4f4), color-stop(100%,#eaeaea));
background: -webkit-linear-gradient(top, #f4f4f4 0%,#eaeaea 100%);
background: -o-linear-gradient(top, #f4f4f4 0%,#eaeaea 100%);
background: -ms-linear-gradient(top, #f4f4f4 0%,#eaeaea 100%);
background: linear-gradient(to bottom, #f4f4f4 0%,#eaeaea 100%);
}
.ias_trigger a:hover {
background: #efefef;
background: -moz-linear-gradient(top, #efefef 0%, #e0e0e0 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#efefef), color-stop(100%,#e0e0e0));
background: -webkit-linear-gradient(top, #efefef 0%,#e0e0e0 100%);
background: -o-linear-gradient(top, #efefef 0%,#e0e0e0 100%);
background: -ms-linear-gradient(top, #efefef 0%,#e0e0e0 100%);
background: linear-gradient(to bottom, #efefef 0%,#e0e0e0 100%);
}
.ias_trigger a:active {
box-shadow:inset 0 0 5px rgba(0,0,0,.1);
}4. Открываем shortstory.tpl и оборачиваем всё его содержимое в такой DIV:
...тут содержимое...5. Открываем comments.tpl и опять оборачиваем его содержимое в DIV:
...тут содержимое...6. Открываем navigation.tpl и оборачиваем его содержимое в DIV:
...тут содержимое...Плюс тут же меняем:
[next-link]Вперед[/next-link]На:
[next-link]Вперед[/next-link]Готово! 
Теперь немного подробнее что мы сделали… В первом шаге, мы загрузили сам скрипт и картинку в шаблон 🙂
Во втором, мы подключили этот скрипт на нужных нам страницах. Для новостей на главной, а для комментариев в полной новости. При необходимости, вы можете расширить список страниц, прочитав документацию DLE. Например подключить ещё на странице «последние комментарии», при просмотре категори и т.д.
В третьем шаге, мы немного преукрасили внешний вид. ajaxProgress — это стили для загрузчика, который появляется при загрузке страниц. А ias_trigger, это кнопка с предложением загрузить ещё страницу.В 4, 5 и 6 пунктах мы дали классы контейнерам, чтоб скрипт понимал что нужно подгружать и что прятать. Вы можете изменить названия и классы, если понимаете что делаете :)За считанные минуты, мы сделали современный сайт, без каких либо вмешательств в движок.Работа скрипта, сделана очень продумано: сохраняется навигация по страницам и есть поддержка «умеренной» загрузки (после нескольких страниц, просто появляется кнопка для загрузки).
Имея желание, при помощи плагина можно сделать AJAX загрузку страниц своей мечты.
Версия DLE: 9.x-10.x
Автор: SaD Вернуться назад