Создал клон карусели (нужны были наборы по 3/5/7 и т.д. слайдов), разместил несколько модулей (из разных клонов) на странице. При нажатии на pagination слайды реагируют (листаются) во всех клонах/модулях сразу. Полагаю дело в swiper.min.js ?
КЛОН:
\catalog\controller\extension\module\carousel.php
<?php
class ControllerExtensionModuleCAROUSEL3IN1v01 extends Controller {
public function index($setting) {
static $module = 0;
$this->load->model('design/banner');
$this->load->model('tool/image');
$this->document->addStyle('catalog/view/javascript/jquery/swiper/css/swiper.min.css');
$this->document->addStyle('catalog/view/javascript/jquery/swiper/css/opencart.css');
$this->document->addScript('catalog/view/javascript/jquery/swiper/js/swiper.jquery.js');
$data['banners'] = array();
$results = $this->model_design_banner->getBanner($setting['banner_id']);
foreach ($results as $result) {
if (is_file(DIR_IMAGE . $result['image'])) {
$data['banners'][] = array(
'title' => $result['title'],
'link' => $result['link'],
'image' => $this->model_tool_image->resize($result['image'], $setting['width'], $setting['height'])
);
}
}
$data['module'] = $module++;
return $this->load->view('extension/module/CAROUSEL3IN1v01', $data);
}
}
\catalog\view\theme\default\template\extension\module\CAROUSEL3IN1v01.twig
<div class="swiper-viewport">
<div id="CAROUSEL3IN1v01{{ module }}" class="swiper-container">
<div class="swiper-wrapper">{% for banner in banners %}
<div class="swiper-slide text-center">{% if banner.link %}<a href="{{ banner.link }}"><img src="{{ banner.image }}" alt="{{ banner.title }}" class="img-responsive" /></a>{% else %}<img src="{{ banner.image }}" alt="{{ banner.title }}" class="img-responsive" />{% endif %}</div>
{% endfor %}</div>
</div>
<div class="swiper-pagination carousel{{ module }}"></div>
<!--
<div class="swiper-pager">
<div class="swiper-button-next"></div>
<div class="swiper-button-prev"></div>
</div>
-->
</div>
<script type="text/javascript">
$('#CAROUSEL3IN1v01{{ module }}').swiper({
mode: 'horizontal',
slidesPerView: 3,
pagination: '.carousel{{ module }}',
paginationClickable: true,
nextButton: '.swiper-button-next',
prevButton: '.swiper-button-prev',
autoplay: 7500,
loop: true
});</script>
Ну и хочу понять - куда ведёт эта строка...
pagination: '.carousel{{ module }}',
--
в платных услугах не нуждаюсь, копаю сам, кеш и модификаторы обновляю. openstore 3.0.2.0 Theme default