WooCommerce: How to Hide a Cart Table Column

There are many reasons why you may want to do this. Sometimes you just want to make it easier for your customers. The less information you show the better 🙂

Some other times,  you may have specific requirements. Well, hiding a Cart Table column is actually very easy – and despite this can be done with PHP I believe the CSS way is way faster. Here’s how it’s done!

WooCommerce: hide a cart table column

CSS snippet: remove/hide one column from WooCommerce cart table

/* Change number 4 with number of column you want to remove */

.woocommerce table.cart td:nth-of-type(4), .woocommerce table.cart th:nth-of-type(4) {
display: none;
}

Where to add this snippet?

You can place PHP snippets at the bottom of your child theme functions.php file (delete "?>" if you have it there). CSS, on the other hand, goes in your child theme style.css file. Make sure you know what you are doing when editing such files - if you need more guidance, please take a look at my free video tutorial "Where to Place WooCommerce Customization?"

Does this snippet (still) work?

Please let me know in the comments if everything worked as expected. I would be happy to revise the snippet if you report otherwise (please provide screenshots). I have tested this code with Storefront theme, the WooCommerce version listed above and a WordPress-friendly hosting on PHP 7.3.

If you think this code saved you time & money, feel free to join 14,000+ WooCommerce Weekly subscribers for blog post updates or 250+ Business Bloomer supporters for 365 days of WooCommerce benefits. Thank you in advance :)

Need Help with WooCommerce?

Check out these free video tutorials. You can learn how to customize WooCommerce without unnecessary plugins, how to properly configure the WooCommerce plugin settings and even how to master WooCommerce troubleshooting in case of a bug!

Rodolfo Melogli

Business Bloomer Founder

Author, WooCommerce expert and WordCamp speaker, Rodolfo has worked as an independent WooCommerce freelancer since 2011. His goal is to help entrepreneurs and developers overcome their WooCommerce nightmares. Rodolfo loves travelling, chasing tennis & soccer balls and, of course, wood fired oven pizza.

34 thoughts on “WooCommerce: How to Hide a Cart Table Column

  1. Hello,
    This is working perfectly on my cart page, now I’m trying to figure out how to make it happen on my “Checkout” page, I want to hide product-total column, need your instruction @Rodolfo, thanks so much!

    1. Hello Jian, thanks so much for your comment! Yes, this is definitely possible, but I’m afraid it’s custom work. If you’d like to get a quote, feel free to contact me here. Thanks a lot for your understanding!

  2. Thank you! It worked perfect!

    1. Super!

  3. He’s working. Thank you so much. However, I have to change the value of “4” to “3”.
    However, this code does not work on the mobile version. What can I do for it ?
    Thank you for your interest and understanding.
    Best regards.

    1. Hi Ali, thanks so much for your comment! Yes, this is definitely possible, but I’m afraid it’s custom work. If you’d like to get a quote, feel free to contact me here. Thanks a lot for your understanding!

  4. On the same principle, what will be the ideal way to remove the entire “update cart” row from the cart table?

    Thanks!

    1. Hey Hong, thanks so much for your comment! Yes, this is definitely possible, but I’m afraid it’s custom work. If you’d like to get a quote, feel free to contact me here. Thanks a lot for your understanding!

  5. Hi there,
    Yes your CSS work great.
    Do you know How Can I resize the product colum?
    I mean, make it bigger… that way all product description is good.

    1. Hi Isabel, thanks so much for your comment! Yes, this is definitely possible, but I’m afraid it’s custom work. If you’d like to get a quote, feel free to contact me here. Thanks a lot for your understanding!

  6. Thank You! worked perfectly

    1. Yay!

      1. Your CSS worked perfectly but when I changed the 4 to 1 for what I believed was the thumbnail column, it also removed the product summary. They must be joined somehow.

        I globally removed all product images and thumbnails but cart form left blank column left of product summary. I thought by deleting that first column for the thumbnail, product summary would move left. Instead it removed the product summary entirely. I also removed tr and th for thumbnail in cart.php to no avail.

        It’s most obvious on the landing page where there’s a full cart occupying 1/3 of page. It looks horrendous and I’ve searched your site and others with little luck.

        Any thoughts?

        1. Hey Tina 🙂 Did you change both 4s? Also the thumb columns should be #2

          1. Great Code Rodolfo, just what I needed almost, but Im having the same issue, my product images have been effected by the changes also, they became tiny. I haven’t added any code with respect to the product images column. Any ideas? Thanks in advance.

            1. You might need additional CSS

  7. This css snippet worked beautifully on desktop, but the changes were not made on mobile devices.

    1. Hey there, thanks for your comment! Yes, that’s possible, and also depends on your theme. You can simply “Inspect” via Google Chrome to see which is the CSS class that you should target on mobile also. Hope this helps!

      1. Same problem….

        Could you explain ?
        i couldn’t found 🙁

        Thanks in advance

        1. I can’t explain because this is custom to your theme. Sorry

  8. It worked like a charm for me. Thank you so much.

    1. Brilliant!

  9. Hi Rodolfo
    I’ve been struggling with a silly little thing, but I have not been able to solve anything, maybe you could help me. I’m working on a WoocCommerce website where I will sell products for a monthly fee and a one-time installation fee. I just want to hide the “recurring total rows” on my website checkout Page. I already managed to hide the subtotal row of the product totals section with this CSS code
    .cart-subtotal { display:none; }
    I’m trying to do the same with the recurring totals rows but is not working.

    1. Hola Rafael, thanks so much for your comment! Yes, this is possible – but unfortunately this is custom work and I cannot provide a complementary solution here via the blog comments. Thanks a lot for your understanding! ~R

  10. Hi I want to remove the “Gift Cards in Cart” section of the Cart which lists the Reload information. My gift cards are one time use only and I have marked it as so when I created the product. However, it keeps coming up. I’m thinking its a glitch in the system, unless I’m missing something. If it is a glitch, I was thing some Simple CSS coding would assist me with removing it just like the Simple CSS coding that can remove a column (in the example given in one of the “WooCommerce: how to hide a column from the Cart Table” clip.

    1. Michael, thanks so much for your comment! Unfortunately this is custom work and I cannot provide a complementary solution here on the blog. Thanks a lot for your understanding! ~R

  11. It’s easier to address the class directly (certainly less counting involved and less ambiguity when debugging.

    for instance: .product-quantity { display: none; } or, for yours, .product-price { display: none; }

    1. Thanks for your feedback Chris!

  12. Hi Rodolfo, It looks like this code is not working anymore… maybe there’s been an update? great tutorials by the way, love youw website! kind regards Saskia

    1. Hey Saskia, thanks for your comment & feedback!

      The code works perfectly – make sure to remove the comment line (“// bla bla bla”) which was not correctly written in CSS (fixed now).

      If this does not work, then your WP theme is overriding the default Cart CSS classes and you’ll need to play a little with the part that says “.woocommerce table.cart”

      Hope this helps!

      1. Hello,
        need your help to add a new column in the Cart Table
        kind regards

        1. Hello Hamadi, thanks so much for your comment! Yes, this is possible – but unfortunately this is custom work and I cannot provide a complementary solution here on the blog. Thanks a lot for your understanding! ~R

  13. Hello,

    Can anyone let me know what is remove_action for remove price and quantity from cart page. like it remove from the product summary page remove_action( ‘woocommerce_single_product_summary’, ‘woocommerce_template_single_add_to_cart’, 30 );

    i need to remove price and quantity from cart page.

    Thanks

    1. Hey Bilal, I don’t think there is an add_action for that. I think in this case you’ll need to either use a filter or override the Cart template. Hope this helps!

Questions? Feedback? Support? Leave your Comment Now!
_____

If you are writing code, please wrap it between shortcodes: [php]code_here[/php]. Failure to complying with this (as well as going off topic, not writing in English, etc.) will result in comment deletion. You should expect a reply in about 2 weeks - this is a popular blog but I need to get paid work done first. Please consider joining BloomerArmada to get blog comment reply priority, ask me 1-to-1 WooCommerce questions and enjoy many more perks. Thank you :)

Your email address will not be published.