Сообщение #2 Master » 11.01.2022, 18:23
Вы правильно сделали в main.tpl
Код: Выделить всё
<div class="fn_products_slide products_list row no_gutters swiper-container">
<div class="swiper-wrapper">
{foreach $featured_products as $product}
<div class="item product_item swiper-slide no_hover">
{include "product_list.tpl"}
</div>
{/foreach}
</div>
<div class="swiper-button-next"></div>
<div class="swiper-button-prev"></div>
</div>
Еще нужно в файле design/okay_shop/js/okay/js
найти код
Код: Выделить всё
/* Carousel products */
if( $('.fn_products_slide').length ) {
$('.fn_products_slide').each(function(){
var swiper = new Swiper(this, {
slidesPerView: 1,
pagination: {
el: this.querySelector('.swiper-pagination'),
clickable: true,
},
watchOverflow: true,
breakpoints: {
320: {
slidesPerView: 1,
},
360: {
slidesPerView: 2,
},
576: {
slidesPerView: 3,
},
768: {
slidesPerView: 3,
},
768: {
slidesPerView: 4,
},
1200: {
slidesPerView: 5,
},
}
});
});
}
и вместо кода для пагинации
Код: Выделить всё
pagination: {
el: this.querySelector('.swiper-pagination'),
clickable: true,
},
вставить код для стрелок навигации
Код: Выделить всё
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
и возможно добавить стили CSS
Вы правильно сделали в main.tpl
[code]<div class="fn_products_slide products_list row no_gutters swiper-container">
<div class="swiper-wrapper">
{foreach $featured_products as $product}
<div class="item product_item swiper-slide no_hover">
{include "product_list.tpl"}
</div>
{/foreach}
</div>
<div class="swiper-button-next"></div>
<div class="swiper-button-prev"></div>
</div>[/code]
Еще нужно в файле design/okay_shop/js/okay/js
найти код
[code] /* Carousel products */
if( $('.fn_products_slide').length ) {
$('.fn_products_slide').each(function(){
var swiper = new Swiper(this, {
slidesPerView: 1,
pagination: {
el: this.querySelector('.swiper-pagination'),
clickable: true,
},
watchOverflow: true,
breakpoints: {
320: {
slidesPerView: 1,
},
360: {
slidesPerView: 2,
},
576: {
slidesPerView: 3,
},
768: {
slidesPerView: 3,
},
768: {
slidesPerView: 4,
},
1200: {
slidesPerView: 5,
},
}
});
});
}[/code]
и вместо кода для пагинации
[code]
pagination: {
el: this.querySelector('.swiper-pagination'),
clickable: true,
},
[/code]
вставить код для стрелок навигации
[code]
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},[/code]
и возможно добавить стили CSS