Here is how to create a custom CSS file

bredowmax
Explorer
57 1 67

This works great but I'm finding one problem, where my CSS would rely on colors defined in the theme. For example this wouldn't work anymore in the new CSS file:

 

background: {{ input_bg_col }};

 

How to fix this?

0 Likes
kalyan_chakri
Excursionist
20 0 3

Please explain how you are trying to override?

0 Likes
pierre_co
New Member
1 0 1

Hello,

To add a custom css file to your Shopify shop, you can use this free application https://apps.shopify.com/css-editor.

It will automatically create the css file, which you can edit from an editor in the application.

There is also a checkbox to compress the code in order to have better loading times of your pages.

Erikaarevalo
New Member
3 0 0

Hello, I’m trying to follow the steps but it’s not working for me.

If I add the following code directly to the default theme.css it works perfectly.

.Button--primary::before, .shopify-payment-button__button--unbranded::before, #shopify-product-reviews .spr-summary-actions-newreview::before, #shopify-product-reviews .spr-button-primary:not(input)::before {

 background-color: #af8da5!important;

}


I want to add this code to a separate css file. I went ahead to create the following file under Assets.

I will greatly appreciate any help!

1C93525B-BDFF-477E-A06F-D45E90BF9868.jpeg

The I went into my theme.liquid and added the following:

B821E542-9934-4631-8E71-9455297CF646.jpeg

0 Likes
the90sshop
New Member
2 0 1

You're awesome, thank you for this!

0 Likes