Problem with Columns in WooCommerce

  • Hello,

    So I was able to change the number of columns in WooCommerce from the standard 4 to 2, but there seems to be some sort of table that is stopping me from being able to use all of the space. So there are two “phantom” columns that are blank but still take up space.

    The things that I have done:

    1) I added this code to my theme’s functions

    global $woocommerce_loop;
    $woocommerce_loop[‘columns’] = 2;

    2) I changed the images’ CSS to {width:auto;} so the images will actually be full sized.

    Now they are overlapping AND they are stuffed into two columns (with two blank columns to the side).

    Is there any way to fix this? Has anyone else had issues with blank columns when changed the number of columns?

    You can see the site at https://www.vtwoodenware.com

    https://www.ads-software.com/extend/plugins/woocommerce/

Viewing 6 replies - 1 through 6 (of 6 total)
  • Thread Starter mtucker

    (@mtucker)

    Someone else must be having this issue. I figured out how to make it two columns and push everything to the right, but now I have all this white space to the right side of the website and it does not display properly in Safari.

    Anyone know how to actually remove those right two “blank” columns? It seems like there is some sort of table and the filtering effect is not working.

    Thanks!

    It looks pretty good in Chrome, I’d have to say … except that the add to cart button isn’t there yet. Have you set prices for products?

    The columns appear centered to me, and the images dynamically scale as the width is changed. I don’t have a huge monitor attached at the moment, so it might be something I would see differently if I were able to open the browser to 2000 pixels wide or something.

    Actually it looks good in Safari too, other than in both there is maybe 100 pixels of padded space extra on the right than on the left.

    Thread Starter mtucker

    (@mtucker)

    Thanks for the response, citynode.

    The website owner specifically asked to leave out the addto cart button, so I hid it using CSS.

    The main issue I am having is that if you scroll to the right you will notice that there is a lot of blank space. This is because I wanted to change the number of columns in Woocommmerce from 4 to 2.

    To do this, I added this to my theme’s function file.

    global $woocommerce_loop;
    $woocommerce_loop[‘columns’] = 2;

    When I did that it removed the images from two of the columns but it kept two “blank” columns- so the space remained as a placeholder. The only way to make the images larger was to allow the element to stretch beyond the site wrapper and have the blank columns rest on the right hand side of the website (which is why you can scroll to the right). So in short, the solution above is not truly removing the columns, just removing the images and keeping those columns. Has anyone figured out a solution for this?

    Thanks for checking in Safari by the way. I’m not a mac user and apple is no longer supporting Safari. A few people checked for me and said the pictures were overlapping and they were not centered. Anyone else able to check in Safari?

    Thanks!

    Curious: why build an ecommerce site and leave out the add-to-cart button? Are you going to use some other way to order, or is that his idea to put the site into maintenance mode or sandbox mode so that nobody tries to order yet?

    Thread Starter mtucker

    (@mtucker)

    When you click on the image and go to the product page you can add to cart.

    sathiya111

    (@sathiya111)

    Hey mtucker,
    I am having the same issue, have you find any solution for it.
    If so can you share the solution with me.your timely reply will be appreciated

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Problem with Columns in WooCommerce’ is closed to new replies.

Tags