В этой теме нет ответов

[Никита Панин]

Перейдите в раздел Сайт - Редактор шаблонов - в шаблоне "HTML" найдите:

<div class="products-grid row owl-carousel">
		 {% FOR index_page_favorites_goods %}

​
и перед данным блоком кода вставьте :

<div class="promo-carousel">

​
далее найдите :

</div>
	 {% ENDIF %}
	 <div id="delivery_banner">

​
и перед данным блоком кода вставьте :

<script>
		 $(function() {
		 $(".promo-carousel .owl-carousel").owlCarousel({
			 margin: 10,
			 nav: true
			
		 });
		 })
	 </script>
	 </div>

​
далее перейдите в main.css и добавьте (в самый конец):

.promo-carousel .owl-nav {position: relative;}
.products-grid.row.owl-carousel.owl-theme.owl-loaded {position: relative;}
.promo-carousel .owl-controls {position: absolute;width: 100%;top: 40%;}
.promo-carousel .owl-prev {width: 40px;}
.promo-carousel .owl-prev {left: 0;content: ">";}
.promo-carousel .owl-next {width: 40px;right: 0px;}
.promo-carousel .owl-prev:before { content: "<";color: #fff;}
.promo-carousel .owl-next:before {content: ">";color: white;}
.promo-carousel .owl-nav > div {position: absolute;background: red;padding: 3px 7px 4px 13px;color: #fff0;content: ">";text-align: center;font-size: 30px;border-radius: 23px;}

В конечном итоге , у вас получится блок следующего вида :