Changing the number of product columns in WooCommerce 2.1

Some people asked me this question on Twitter and I always pointed them to the support forums we’ve got. When this question got asked for the 10th time this week, I figured I had to check if this was actually any different in WooCommerce 2.1 now. Turns out, it’s not. It still works the same as it did in previous versions.

Hi! In new WooCommerce 2.1.2, how can I change the number of shop columns? All fixes that I can find on Google are not working in this release.

Well, here we go. Let’s debunk this myth that it’s no longer working by showing some examples.

The filter is and always was loop_shop_columns

This filter never changed. In the WooCommerce templates, this filter is used to determine the number of columns on all pages that contain products; shop archive, categories etc. Let’s look at what the WooCommerce documentation says about this filter; “Change number of products per row“:

Defines where ‘first’ and ‘last’ classes are applied in product archives.

In other words, this number that we can filter actually determines on which elements the classes first and last are applied. This made me think about possible causes this can break, but more on that later.

Using the filter, let’s change the number!

This filter gets a static number as parameter that we can change. So we have to write a really simple function that returns the new number that we want:

Yes, that is all. This works. Let’s verify this by looking into the source of the shop page of my testing site (and the number of columns actually changed too):

WooCommerce column classesSo the bottom line is, yes this filter still works!

What can go wrong?

Now, I’m glad you asked. There are a couple things that can go wrong here.

 #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.

#2 Your theme doesn’t style the classes properly

Even if this filter gets called and it inserts the classes by using it, it doesn’t mean it styles the classes properly. If your theme removes all of the default WooCommerce stylesheets, it has to add styling for these classes as well. Make sure your theme adds styling to the first and last classes, so they are used as start end end of rows.

#3 Your theme screws up in another way

I hate to pick on themes all the time, but sadly they cause a lot of these issues. If everything is working as expected, there’s only one way to really exclude your theme from the list of possible causes: Switch to a default theme. If this filter still doesn’t work when you are using an unmodified Twenty Twelve theme, something else is wrong. You are allowed to post a question in the WooCommerce support forums for this issues and explain that this all didn’t work.

About this site

Noticed how lightning fast this website is? It's powered by a Digital Ocean VPS and they are awesome. Go check it out (and get $10 in credits for free when signing up via this link)!

6 thoughts on “Changing the number of product columns in WooCommerce 2.1”

  1. Hi

    thanks for the article, how about related products, cross sells, and up sells columns count?

    I am using this snippet:

    function woocommerce_output_related_products() {
    woocommerce_related_products(4,1);
    }

    but after upgrading to WC 2.1 this is the error notice I get:

    Notice: woocommerce_related_products was called with an argument that is deprecated since version 2.1! Use $args argument as an array instead.

    I suppose it is changed in WC 2.1

    So now what code should be used in the functions.php

    1. The woocommerce_related_products function now expects a parameter in the form of an array. Read the source for this function and you’ll see the available keys in that array to configure the output.

      This function is properly deprecated though, so it will still work in 2.1. Might change for 2.2, so please get it fixed before we push that out.

      Also, please don’t use my comments for support requests, but use the WooCommerce support forums instead.

  2. hi..

    i been using woocommerce 2.1.2.
    i got stuck with the payment gateway which not available to edit or appear in woocmmerce collumn. any solution for this? please..

  3. Why do all “help” articles like this leave out the php file this code is supposed to go in! Is it functions.php, page-full.php or where???

    1. That is what I was thinking! I had to go to the Woocommerce help and they had a little subtitle for the functions.php.

    2. That is because there is a ton of different ways to do this. Commonly, people put code like this in their (child) themes functions.php or in a separate plugin, made just for each snippet.

Comments are closed.