How do I make the grid display 4 products instead of 5 on mobile?

This topic has 7 replies, 3 voices, and was last updated 3 weeks, 4 days ago ago by Luca Rossi

  • Avatar: Goostaf
    Goostaf
    Participant
    September 18, 2024 at 09:52

    Hello, we are doing a grid display of 5 in a row and a load more button, can we make it so that on mobile it initially displays 4 products only to make it look nice

    Please, contact administrator
    for this information.
    Files is visible for topic creator and
    support staff only.
    6 Answers
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    September 18, 2024 at 12:45

    Hello, Goostaf,

    Thank you for reaching out to us with your request.

    There is no such option, unfortunately.

    Best Regards,
    8Theme’s Team

    Avatar: Goostaf
    Goostaf
    Participant
    September 18, 2024 at 12:47

    I remember exactly that you had a theme with a solution for me, I can’t find it, there was a css code that hid the fifth product on a mobile device just

    Avatar: Goostaf
    Goostaf
    Participant
    September 18, 2024 at 13:08

    there was a style that hid 1 product on the mobile and only 4 were shown

    Avatar: Justin
    Luca Rossi
    Support staff
    September 18, 2024 at 17:17

    Hi @Goostaf,

    Can you try with this custom CSS codes?

    .etheme_products .products-loop > div:nth-child(5n+1) {
        display: none;
    }

    Hope it helps!

    Avatar: Goostaf
    Goostaf
    Participant
    September 18, 2024 at 17:24

    Yes, what is needed, the question is, is it possible to make 6 displayed on the mobile through the code as well? On PC 5, on mobile 6

    Avatar: Justin
    Luca Rossi
    Support staff
    September 19, 2024 at 04:26

    Dear Goostaf,

    We hope this message finds you well. We’re writing to assist you with the WPBakery Builder’s Products element. To set the product limit to 6, please follow the instructions provided in the screenshot linked below:

    [https://prnt.sc/5FDnUvrBUiR8](https://prnt.sc/5FDnUvrBUiR8)

    Should you require any further assistance, please do not hesitate to contact us.

    Best regards,
    The 8Theme Team

  • Viewing 7 results - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.Log in/Sign up

8theme customization service

Helpful Topics

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.