Support » Plugin: WooCommerce » column product in new 2.1.2

Viewing 15 replies - 1 through 15 (of 16 total)
  • Same issue

    This is one of the topics I’ve written this post for: Changing the number of product columns in WooCommerce 2.1. Have fun!

    Well, I tried your filter, Coen and that was a bust, unfortunately.
    Jeez, all I know it was displaying fine before 2.1 and now the columns and images are wrong.

    Yeah, I guessing it is probably the theme but don’t even know where to begin and why it’s gone so wrong with an update.

    My shop is at and even the single product images are width content width now when they were previously about 50%

    I’ve added the filter for column display of 4 and I can see a first and last class as well.

    Kinda lost at this point and updates to the theme takes freaking months so that’s a bit of a no-go – got the theme originally for it’s BuddyPress support and the WooCommerce display was a bonus – until now, that is 🙂

    Exactly the same here as Martin.
    I did the same , tryed the filter but still doesen’t work, before 2.1.1 was ok!

    so i understand that nothing is change but is true that now doesen’t work. i have a backup of my website with old woocommerce and all works even the filter.

    SO there must be a solution.

    my website is

    The image of category was big! i had to manual use css to look small.. but i need to have 3 or 4 column.


    I can see that some have found solutions. Any chance of sharing, please?

    are you speaking about me?
    what i did was only resize my image adding this change to css to look the image smaller..
    (i use my custom css plugin
    and i did that code in it:

    .woocommerce ul.products li.product a img, .woocommerce-page ul.products li.product a img {
    width: 50%;
    height: auto;
    display: block;
    margin: 0 0 8px;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,0.3);
    -webkit-box-shadow: 0 1px 2px 0 rgba(0,0,0,0.3);
    -webkit-transition: all ease-in-out .2s;
    -moz-transition: all ease-in-out .2s;
    -o-transition: all ease-in-out .2s;
    transition: all ease-in-out .2s;

    BUT column still 2 ! it only looks better…
    waiting for solution or i have to downgrade to old woocommerce…

    For my theme I over-rode the .hentry {clear: both;} code with .hentry {clear: none;}

    but I don’t know enough geek to know if this is a sensible solution.

    how you do it?

    Well, all I’ve managed to do is reduce the image sizing to the smaller size that was pre-v2.1

    Still 2 columns which looks out of place.
    Filter obviously doesn’t work since the theme doesn’t have the required template files, I’m guessing.

    Does anyone have any clues what and where I need to do next?
    This is driving me nuts 🙂

    How i do it:

    #1 Your theme doesn’t use the filter

    The filter gets called from the template files. A lot of themes out there bundle all the WooCommerce templates files (they shouldn’t, but do it anyway) and might remove filters like this, for whatever reason. Please check the source of your theme files to see if it overrides any WooCommerce template files (to be found in the /woocommerce/ folder in your theme). If it does, make sure the loop_shop_columns filter is still used.

    no idea what you are trying to tell me @lododicesimo
    there is no /woocommerce/ folder in my theme

    exactly!!! is what i said! there is not. but Coen Jacobs in his post said it!

    and he has put resolved to this post?!

    i still in the problem.

    That’s only if your theme bundles WooCommerce template files.

    If it doesn’t do that, that doesn’t apply to your theme. In that case, go to the next steps.

    I’m neither a code or CSS expert but have managed to get some progress on the product pages with some CSS (remember I’m not good at this).
    I’ve added it here:
    [1] In case it helps someone progress their site
    [2] They might some some additional suggestion or improvements
    [3] Suggestions why the product listing is a bit fragmented – can’t quite nail that bit, at the moment

    /* ------- Style single page WooCommerce ------- */
    .woocommerce #content div.product div.images, .woocommerce #content div.product div.summary, .woocommerce div.product div.images, .woocommerce div.product div.summary, .woocommerce-page #content div.product div.images, .woocommerce-page #content div.product div.summary, .woocommerce-page div.product div.images, .woocommerce-page div.product div.summary {
      float: left !important;
      width: 45% !important;
      margin: 1em !important;
    /* ------- end of Style single page WooCommerce ---------- */
    /* Woocommerce style fixes */
    #content div.woocommerce.columns-4 ul.products li.product-category.product.first {
      float: left !important;
    	clear: none !important;
    	width: 22.05%;
      margin: 0 !important;
    #content div.woocommerce.columns-4 ul.products li.product-category.product.last {
      clear: none !important;
      width: 22.05% !important;
    #content div.woocommerce.columns-4 ul.products li.product-category.product {
      float: left !important;
    	clear: none !important;
      width: 22.05% !important;
    .woocommerce ul.products li.product, .woocommerce-page ul.products li.product {
     clear: none !important;
      float: left !important;
      margin: 0 0 2.992em 1em !important;
      width: 22.05% !important;
    /* fixes end */

    Hope it helps someone.

    much better! still empty part that I am trying to resolve..

Viewing 15 replies - 1 through 15 (of 16 total)
  • The topic ‘column product in new 2.1.2’ is closed to new replies.