How to convert theme.scss files to theme.css in Shopify themes?

Store Design
16

Thanks @Anonymous , it worked!

HOW TO:

  • Open Google Chrome : ‘yourstore.myshopify.com’ :

  • Right click (on the page) : click on ‘Inspect element’ : click the arrow on the left (it opens) the ‘’ section :

  • search for; ’ ’ in the head section/code :

  • Right click on the link : click on ‘open in new tab’ : a new tab with your website’s css will open up :

  • Select all text/code and copy (ctrl/cmd + c) it :

  • Go to the ‘Assets’ folder in your Shopify account (yourstore.myshopify.com : online store : edit store : ‘Assets’ folder) :

  • Click on ‘add a new asset’ and name it ‘theme.css’ :

  • Paste (ctrl/cmd + v) the text/code in ‘theme.css’ :

  • save it :

  • Go to ‘theme.liquid’ and search for ’ {{ ‘theme.scss.css’ | asset_url | stylesheet_tag }} ’ :

  • disable this line of code ( put the line between ’ ’ (or delete the whole line of code)) :

Add the line of code you copied at first, inside the section; ’ ’ (make shure you remove ‘.scss’ !)

Save it.

I guess you could delete the ‘old’ .scss files (I didn’t! ; because it’s unclear for me what Shopify want’s/is doing..and what works best)

Hope this is helpful (and a good/the right way)

Thank’s @Anonymous and everybody for the answers and info!

WE GOT THIS! :wink: (little messy, i know..)

6 Likes