enable_css_minification is causing my website to break

VendaVini
New Member
2 0 0

Hi,

A couple of days ago my store: HTTP://www.vendavini.nl broke. It looked like the stylesheet was not loading.

I did not make any changes for the past months so I was surprised that it happened. The other odd thing was that if you looked at the theme in 'customize' mode it worked like a charm.

After some research I found out that removing the enable_css_minification=1 from the css file's URL (//cdn.shopify.com/s/files/1/0267/6303/4798/t/3/assets/theme.css?enable_css_minification=1&v=8547204824228651604) it worked again.

The "enable_css_minification=1" is added automatically if you use: 

{{ 'theme.css' | asset_url | stylesheet_tag }}

In your liquid file.

So I had to change this to 

<link href="//cdn.shopify.com/s/files/1/0267/6303/4798/t/3/assets/theme.css&v=8547204824228651604" rel="stylesheet" type="text/css" media="all" />

Which feels like a hack, but it did the trick.

I guess something has changed in that script causing problems. 

 

0 Likes

Hi,

 

I can't really tell what causes the problem without being able to see your shop's code, but I'm replying because the CSS of your store seems to be broken!

It's possible that it looks fine on your machine, because the CSS file is still in the browser cache.

I'd definitely recommend to try to find a way without using the hard-coded version identifier in the URL (the &v=8547204824228651604 part), since this will be a fixed old version of your store's CSS and the file might not even exist anymore after updating the CSS.

Without seeing your code, a slightly more stable, yet far from ideal, approach would be if you change the manual reference to:

<link href="//cdn.shopify.com/s/files/1/0267/6303/4798/t/3/assets/theme.css" rel="stylesheet" type="text/css" media="all" />

 

All the best

Manuel

Freelance Developer.
I customize themes, optimize stores and develop apps.
www.manuelkruisz.com
0 Likes
VendaVini
New Member
2 0 0

I was switching between the old and new implementation when I was testing. (had my theme watch still on) this so you must have looked when I was doing that.

I published the final version online now.

I placed this is the code and it works

 

<link href="//cdn.shopify.com/s/files/1/0267/6303/4798/t/3/assets/theme.css" rel="stylesheet" type="text/css" media="all" />

 

And when I place:

 

{{ 'theme.css' | asset_url | stylesheet_tag }}

 

it breaks.

 

Feel free to copy my theme and test it for yourself. The code is located in 'include_css.liquid'

 

EDIT: To double test it: I tried:

 

<link href="//cdn.shopify.com/s/files/1/0267/6303/4798/t/3/assets/theme.css" rel="stylesheet" type="text/css" media="all" />

 

and:

 

<link href="//cdn.shopify.com/s/files/1/0267/6303/4798/t/3/assets/theme.css?enable_css_minification=1" rel="stylesheet" type="text/css" media="all" />

 

 

The "enable_css_minification=1" is breaking it.

0 Likes
dannyvargas23
New Member
2 0 0

I would recommend you change it to the below code to prevent hardcoding the URL.

 

<link href="{{ 'theme.css' | asset_url }}" rel="stylesheet" type="text/css" media="all" />

 

 

0 Likes