Слайдер - карусель для ДЛЕ
Створюю і просуваю комерційні сайти та інтернет-магазини з 2008 року. 1-05-2013, 00:10 3 076 1Проста красива реалізація прокручування безлічі зображень у фіксованому блоці. По іншому це називається карусель зображень.
Ця jQuery карусель представлена з горизонтальною прокруткою
Слайдер для ДЛЕ:
1) Створюмо у своїй темі шаблон - slaider.tpl і прописуємо:
<li><div class="car"><a href="{full-link}"><img src="[xfvalue_prevy]" width="160" alt="{title}" /></a></div></li>
[ xfvalue_prevy ] - prevy - це додаткове поле яке потрібно створити, я його використовую для виводу в короткій і повній новині маленького зображення. Замість [ xfvalue_prevy ] можна вставити {image-1}, що виведе URL першої картинки, яка знаходяться в короткій новині.
2) В головному шаблоні main.tpl перед </head> прописуємо:
<script type="text/jаvascript" src="{THEME}/js/carousel.js"></script>
3) В головному шаблоні main.tpl в тому місці де має стояти слайдер вставляємо:
<!-- SLAYDER nuz -->
<div class="infiniteCarousel">
<div class="wrapper2">
<ul>
{custom category="14" template="slaider" aviable="global" from="0" limit="10" cache="yes"}
</ul>
</div>
</div>
<!-- SLAYDER nuz -->
* Цифра "14" - це номер категорії з якої виводяться картинки.
5) Вставляємо css: