Hirurg
Изучающий
- Регистрация
- 29 Сен 2013
- Сообщения
- 880
- Лучшие ответы
- 0
- Репутация
- 546
И так, первым делом определимся с тем, что нам понадобится. Нам нужен JS-код слайдера, шаблон 1 слайда, шаблон main.tpl и настройки для тега {custom}. Начнём по порядку.
Установка:
1. Сам JS-код слайдера и CSS к нему можно скачать с GitHub.
2. Загружаем файл jquery.smslider.min.js из архива в папку /templates/ШАБЛОН/js/.
3. Загружаем файл smslider.css из архива в папку /templates/ШАБЛОН/css/.
4. Картинку sm_arr.png заливаем в /templates/ШАБЛОН/images/.
5. В шаблон main.tpl перед:
HTML:
</head>
HTML:
<link type="text/css" rel="stylesheet" href="{THEME}/style/smslider.css" />
<script type="text/javascript" src="{THEME}/js/jquery.smslider.min.js"></script>
HTML:
<div id="sm_slider">
<ul>
{ custom template="slide"}
</ul>
</div>
HTML:
<script type="text/javascript">
$(document).ready(function(){
$('#sm_slider').smSlider()
})
</script>
Готово, слайдер установлен, но он не работает – у него нет ни единого слайда. Этим мы сейчас и займёмся. Создадим шаблон slide.tpl и запишем туда код:
HTML:
[image-1]<li><a href="{full-link}"><img src="{image-1}" alt="{title}" /></li>[/image-1]
Вот и всё. Никакие сложные изменения в движке не требуются. Вы так же можете добавить кэширование, вывод только из 1 категории и т.д. Можно поменять размер картинки (сейчас он явно слишком большой для сайта). Так же можно выводить краткий текст из статьи. Ничего сложного в этом нет.
Последнее редактирование модератором: