Changing the Layout in WooCommerce Cart Page

  • Thanks to the many experts online, I’ve been able to make some changes to my WooCommerce Cart page. I’m not a developer so am needing a hand with the CSS code for the following changes to my Cart page. My theme is Customizr.

    1. In the order table, where the ordered items are displayed, how do I:
    – align the title of the item ordered column, which currently reads as “Product”, to the left hand side of its column?
    – align the price, quantity ordered and total columns to the right, including the column titles? Positioning of these columns is fine.

    2. In the Cart Totals table underneath, how do I:
    – reduce the width of the table, from the heading (“Cart Totals”) through to the width of the Proceed to Checkout button?
    – cut out some of the distance between the field labels (e.g. “Subtotal”) and the value assigned to each one?

    Thanks for your help.

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

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

  • Hello Frand001,

    I would recommend to inspect your pages and write some css rules in the custom css setting of the live customizer.

    Useful resources for WordPress site customization:?

    https://docs.presscustomizr.com/article/72-basics-of-css-and-html-for-wordpress-themes

    https://docs.presscustomizr.com/article/63-css-resources-for-wordpress-developers

    Have a good day!

    Thread Starter frand001

    (@frand001)

    Thank you emranemranx. FYI – I’m not a developer and I don’t want to become one (with all respect to the talent and magic those people do!). I’m a small business person who’s trying to address layout issues and hoping for the level of help that seems to be given reasonably regularly in this forum. If you or someone else could help me by advising the specific CSS code to address the issues I’ve listed above, I would be grateful. The impression received from researching your forum topics before posting my questions is that this is not an unreasonable request.
    Thanks in advance to you and anyone else who can help.

    Hi Frand001,

    Upon checking out the above links, it’s very easy to make those changes using chrome’s inspect element.

    Have a pleasant day!

    Thread Starter frand001

    (@frand001)

    I love it when people who are comfortable with code, etc say it’s easy. emranemranx, I looked at the pages you sent me before I wrote my last reply. It is not clear to me how to use what’s in those pages to address my question. If it was, I wouldn’t have written my last reply.
    In an ideal world, I would be able to do absolutely everything myself. I can’t. I spent two days researching code and help forums, including this one, before posting my questions. Not a long time but long enough in the world of small business. Can you or someone else who is also proficient with code please help me find the specific pieces of code in themselves.
    Thanks again.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Changing the Layout in WooCommerce Cart Page’ is closed to new replies.