Слайдеры

Для создания слайдера добавьте аттрибут data-slider="{ID слайдера}"

Аттрибут data-slider-options принимает json массив с параметрами слайдера. Список параметров доступен в документации библиотеки owl.carousel.js

<?php
$arSliderOptions = [
	'items' => 2, // Количество отображаемых элементов
];
?>
<div data-slider="images" data-slider-options='<?=\Bitrix\Main\Web\Json::encode($arSliderOptions)?>'>
	<img src="img_1.png" alt="img 1">
	<img src="img_2.png" alt="img 2">
	<img src="img_3.png" alt="img 3">
	<img src="img_4.png" alt="img 4">
</div>
	

Для размещения элементов навигации слайдера разместите на странице следующий код

<!-- Кнопки навигации -->
<div data-slider-nav="{ID слайдера}" class="slider-nav" id="slider-nav-cards"></div>
<!-- Навигационные точки навигации -->
<div data-slider-dots="{ID слайдера}" class="slider-dots" id="slider-dots-cards"></div>
<!-- Мобильная навигация -->
<div data-slider-nav-sm="{ID слайдера}" class="slider-nav-sm"></div>

Метод Redsign\MegaMart\Layouts\Section:useSlider('{ID слайдера}') автоматически размещает элементы навигации внутри обертки

<?php
$layout->useSlider('cards');
?>