Website Building » WooCommerce » Where Do I Put CSS in WooCommerce?

Where Do I Put CSS in WooCommerce?

Last updated on January 22, 2023 @ 2:32 pm

There are a few different places that you can put your CSS when working with WooCommerce. In this article, we’ll go over a few of the most common places and how to properly add your CSS.

The first place you can add CSS is in the Additional CSS section of the Customizer. To get there, go to Appearance > Customize in your WordPress dashboard.

Then, click on the Additional CSS tab in the left-hand sidebar. You’ll see a text editor where you can add your CSS.

Be sure to click the Publish button when you’re done adding your CSS in order to save your changes.

Another place you can add WooCommerce CSS is in your child theme’s stylesheet. If you’re not familiar with child themes, they are themes that inherit the functionality of another theme (the “parent” theme).

The advantage of using a child theme is that if the parent theme is updated, your changes will not be overwritten. You can learn more about child themes in the WordPress documentation.

PRO TIP: Please be aware that adding CSS to your WooCommerce store can be risky and may result in unexpected changes or even break your store. If you are not comfortable with coding or are not sure what you are doing, we recommend seeking professional help.

To add WooCommerce CSS to your child theme’s stylesheet, first make sure you have a child theme activated. Then, go to Appearance > Editor.

In the right-hand sidebar, you’ll see a list of all the files in your theme. Find the stylesheet (it will usually be named style.css) and click on it to open it in the editor.

At the bottom of the stylesheet, you can start adding your WooCommerce CSS. Be sure to click the Update File button when you’re done making changes.

Conclusion 

Where Do I Put My WooCommerce CSS?

There are a few different places that you can put your CSS when working with WooCommerce:

  • In the Additional CSS section of the Customizer
  • In your child theme’s stylesheet
  • In a plugin
Madison Geldart

Madison Geldart

Cloud infrastructure engineer and tech mess solver.