Magento 2: Page Builder Product Carousel custom options 2 column Layout

Question

I am trying to set the Page Builder carousel to show less items on a 2 column layout compared to a 1 column layout.

Already I have updated the following file app/design/frontend/{Vendor}/{theme}/etc/view.xml in the theme to update the Page Builder carousel on 1 column templates for what I need.

        <var name="breakpoints">
            <var name="mobile">
                <var name="conditions">
                    <var name="max-width">768px</var>
                    <var name="min-width">640px</var>
                </var>
                <var name="options">
                    <var name="products">
                        <var name="default">
                            <var name="slidesToShow">3</var>
                        </var>
                        <var name="continuous">
                            <var name="slidesToShow">2</var>
                        </var>
                    </var>
                </var>
            </var>
            <var name="mobile-small">
                <var name="conditions">
                    <var name="max-width">639px</var>
                    <var name="min-width">360px</var>
                </var>
                <var name="options">
                    <var name="products">
                        <var name="default">
                            <var name="slidesToShow">2</var>
                        </var>
                        <var name="continuous">
                            <var name="slidesToShow">1</var>
                        </var>
                    </var>
                </var>
            </var>
            <var name="mini-mobile">
                <var name="conditions">
                    <var name="max-width">359px</var>
                </var>
                <var name="options">
                    <var name="products">
                        <var name="default">
                            <var name="slidesToShow">1</var>
                        </var>
                        <var name="continuous">
                            <var name="slidesToShow">1</var>
                        </var>
                    </var>
                </var>
            </var>
        </var>
    </vars>

Please review code above as this is what is needed to change the qty showing on screen sizes and not done in CSS/Bootstrap.

Can anyone advise how I could update this for 2 column layouts as these are very squashed together on that layout.

I have viewed this post for some help but not sure how to change this for 2 column layout - Magento 2: Page Builder Product Carousel slick slide custom options

Answer 1

Magento itself and typically all magento themes uses bootstrap library for layout and for 2 column layout, usually the width configuration is 33.33 & 66.66 or 25 - 75 for desktop layouts, and for smaller screens these 2 columns are placed one after another in display.

So for your requirements, you can set nos. ins the same ratio as your columns are defined, if they are defined like 25-75 so no. of products for a 1024 resolution can be 3 instead of 4 but for smaller screens where your 2 columns are placed below each other, you can keep the same nos.

Hope I didn't misunderstand your question a

Answer 2

After a lot of searching and reading Magento docs I could not find a way how this can be achieved so I updated this the slider layout in css/less.