OpenCart – карусель производителей opencart – автопрокрутка

Конечно, немного несправедливо модуль карусели OpenCart называть “каруселью производителей”, ведь с помощью этого модуля можно вывести не только логотипы производителей, но и избранные товары, лишний раз разрекламировать категории товаров, дать ссылки на магазины-партнеры и т.д.


В общем, с помощью карусели можно много чего сказать и показать покупателю, но так уж повелось, что большая часть магазинов использует карусель именно для вывода логотипов производителей или брендов.
Итак, с сутью карусели порядок, но вот с ее “спокойным состоянием” не все так гладко. По умолчанию, карусель OpenCart не имеет автоматической прокрутки (скроллинга), для того, чтобы просмотреть все изображения карусели, необходимо кликать на стрелочку(и). Кстати, изначально видна только одна стрелочка, та что справа, так как влево крутить пока что нечего – не самая красивая картина получается.



Для того, чтобы при загрузке магазина сразу были видны обе стрелочки, изображения прокручивались автоматически и появилась цикличность, при которой изображения, дойдя до конца карусели, не останавливались, а начинали свой показ по новой, внесем небольшое изменение в catalog/view/theme/default/template/module/category.tpl. Открываем файл и вместо

<script type="text/javascript"><!-- $('#carousel<?php echo $module; ?> ul').jcarousel({ vertical: false, visible: <?php echo $limit; ?>, scroll: <?php echo $scroll; ?> }); //--></script>

1 2 3 4 5 6 7

<script type="text/javascript"><!-- $('#carousel<?php echo $module; ?> ul').jcarousel({ vertical: false, visible: <?php echo $limit; ?>, scroll: <?php echo $scroll; ?> }); //--></script>

размещаем

<script type="text/javascript"><!-- $('#carousel<?php echo $module; ?> ul').jcarousel({ vertical: false, auto: 4, wrap: 'circular', visible: <?php echo $limit; ?>, scroll: <?php echo $scroll; ?> }); //--></script>

1 2 3 4 5 6 7 8 9

<script type="text/javascript"><!-- $('#carousel<?php echo $module; ?> ul').jcarousel({ vertical: false, auto: 4, wrap: 'circular', visible: <?php echo $limit; ?>, scroll: <?php echo $scroll; ?> }); //--></script>

Мы добавили всего две строки, в которых auto задает скорость прокрутки изображений, а wrap – цикличность, чтобы дойдя до последнего изображения, карусель не останавливалась, а продолжала свое вращение. Теперь карусель вращается как по клику, так и самостоятельно и у нее теперь почти полноценный вид с двумя стрелочками (дизайн которых обязательно стоит сменить:) ).