Changing the number of scrolled products in the carousel after clicking the prev/next arrow

Question

I tried to change default behavior od prev/next button in featured products carousel. For example: I want to have scrolled next 4 items after clicking once next arrow. There is any posibility to configure that in yaml or should I change something in JS? And if it is matter of JS where can I find the logic responsible for?

I tried to find a solution with yaml configuration so far.

Answer 1

The featured products carousel uses a slick slider under the hood, so you can use any options that present in their documentation by yml file. For instance change a behavior of slider on home page

# layouts/default/oro_frontend_root/featured_products.yml
- '@setOption':
    id: featured_products
    optionName: slider_options
    optionValue:
        slidesToShow: 4
        slidesToScroll: 4
        arrows: true
        responsive:
            - { breakpoint: 1100, settings: { arrows: true } }
            - { breakpoint: 993, settings: { slidesToShow: 3, arrows: true } }
            - { breakpoint: 768, settings: { slidesToShow: 2, arrows: true } }
            - { breakpoint: 641, settings: { slidesToShow: 1, arrows: true } }

There is JS that responsible for it: list-slider-component