cancel
Showing results for 
Search instead for 
Did you mean: 

Updates to CSS file not showing in front-end

Updates to CSS file not showing in front-end

I need to remove the background image on a website. I've used my web browsers 'Inspect Element' tool to find out where it's pulling the CSS from and then gone into that CSS file via FTP and amended it. However the updates haven't been reflected on the live site and the background image is still showing. When I 'Inspect Element' again I can't see my changes to the code, but I can see them in the CSS file. I've tried flushing the CSS cache but to no avail. 

 

I'm new to Magento so any help greatly appreciated! 

 

 

 

Tags (1)
11 REPLIES

Re: Updates to CSS file not showing in front-end

Your steps seem correct. Maybe your browser cache got in the way. If you use google chrome, hold down the refresh button and use Hard Reload.

 

A CDN (Content Delivery Network) can sometimes hold old files as well.

 

If still no look, load the CSS in your bowser driectly. If you use merge CSS - delete your merge files in /media/css/

Re: Updates to CSS file not showing in front-end

Thanks for your quick response. 

 

I've done a hard reload and still no luck! 

The site doesn't appear to use merged CSS files.

 

What do you mean by 'load the CSS in your browser directly'? 

Re: Updates to CSS file not showing in front-end

I just meant load the CSS by opetning the Address in your browser e.g. yourstore.com/skin/package/theme/css/test.css and then make sure that is the one added  in your html.

 

and then compare your changes, sometimes reveals basic errors like loading CSS into the woring theme folder etc.

 

Changing the CSS is not a big thing, but there are little mistakes that can happen all the time which can cause the frustration, then its best to try narrowing down the problem.

 

Hard to tell the exact problem, but comman issues are:

 

  • Magento Cache (CSS merge enabled)
  • Browser Cache
  • CDN cache
  • Wrong package/theme folder

Re: Updates to CSS file not showing in front-end

I've loaded the CSS file directly into the browser and can't see my changes. However when downloading the same CSS file via FTP they are there. It's really frustrating! 

 

 

Re: Updates to CSS file not showing in front-end

Am having the same problems.

 

Updating via FTP and saving.

 

Refreshing on Google Chrome - being served old css.

 

Directly access the URL of the css, seeing no changes, however when downloading via ftp to edit again,  i can see the changes i've made.

 

Tried disabling / enabling merged css, flushing cache, removing media/css files... 

 

Using a custom theme under rwd/customtheme - i can see the css is pointing to the correct file, but issue remains..

 

anyone solve this with any luck ? 

 

Thank you.

Re: Updates to CSS file not showing in front-end

hy.

you found a solution ?

Re: Updates to CSS file not showing in front-end

I ran into the same problem and found a solution for my situation.

If your hosting company uses CPanel, there's a big chance that a caching function is enabled (i.e. SuperCacher).

In my case I did a flush and disabled the function and the CSS was updated. Hope this helps other people out Smiley Happy

Re: Updates to CSS file not showing in front-end

Also I've noticed that sometimes people do not bother to check which css files are loaded and from where. This "from where" part is important, because sometimes people do not update those files that are actually loaded and make changes to base/default or whatever css files. Check your page source and make sure that all those paths are right.

Tanel Raja

Re: Updates to CSS file not showing in front-end

I had this problem also. The solution for me was to disable CSS Merge in the Configuration > Developer > CSS Settings > Merge  CSS files > NO.