Product shortcode columns not working

  • Resolved lemouz

    (@lemouz)


    5 years, 6 months ago

    Hi,
    I use woocommerce shortcode to display my 4 last products.
    [products limit=”4″ columns=”4″ orderby=”id” order=”DESC” visibility=”visible”]

    But it doesnt work fine : It displays 1 product per row which is ugly of course.

    The strangest thing is that I use WP Staging to make tests before going to production and this works fine !

    The bad one : https://ibb.co/cQ7wmYS
    The good one : https://ibb.co/xM0dJV7

    Thanks for your help !

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Peter Lawrenson

    (@lorro)

    5 years, 6 months ago

    Try this custom css:

    @media screen and (min-width: 768px) {
  ul.products li.product {
    margin: 0 1% !important;
    width: 23% !important;
  }
  .br_alabel {
    top: 40px !important;
  }
}

    Custom css can be entered at:
    Dashboard > Appearance > Customize > Additional CSS

    Check other pages and device widths for unwanted side effects.

    Thread Starter lemouz

    (@lemouz)

    5 years, 6 months ago

    Hi,
    Thanks, this works OK for the front page. But this goes messy with others (https://www.byaeni.fr/categorie-produit/produits-en-stock/)

    I’d like to understand why this is OK with the site used for test but not with the “real” one. The staging is on the same server….

    Peter Lawrenson

    (@lorro)

    5 years, 6 months ago

    1. The products-in-stock page has 5 products to a row, whereas the home page has 4 to a row. I think the thing to do is restrict my snippet above to the home page only. Alter the second line to:
    .home ul.products li.product {

    2. Sounds like a day’s job for a hands-on dev….

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Product shortcode columns not working’ is closed to new replies.