I have done some minor changes in CSS, but it's not reflecting on my frontend even after flushing Magento cache. To see the changes I have to hard refresh my website everytime I reload.
-
Is enabling merging of CSS set to yes?– MagePal ExtensionsCommented Oct 9, 2014 at 17:45
-
Yes it is set to yes– farookCommented Oct 9, 2014 at 17:49
-
Don't forget to mark answer as accepted, both below answers seem so!– versediCommented Nov 7, 2014 at 19:54
-
1What version of magento are you running?– andy jonesCommented Apr 28, 2017 at 7:50
Add a comment
|
5 Answers
Take a look at How to force flush CSS cache on client side?
Assuming that merge css is enable in
System -> Configuration -> Developer -> CSS settings -> Merge CSS Files
To Flush css goto
System -> Configuration -> Cache Management -> Flush JavaScript/CSS Cache
Note : Depending on your server cache setting, you may need to clear your browser cache or reload in a private session. Also if you add, remove or change the name of your css files then you may need to clear the other caches.
answered Oct 9, 2014 at 17:52
To see the changes i have to hard refresh website everytime i reload.
This would be expected if you have set far future headers on your CSS.
If you are developing a store, the browser will naturally cache CSS as it is instructed, so if you set future expiry times, then the browser won't attempt to revalidate its cached content unless either this expiry time is hit, or if you hard refresh your browser cache (Ctrl + F5)
If your hosting using cPanel and SuperCacher enabled then you need to flush static cache and / or disable that functionality while you are developing.
Refresh your browser css file by clearing browser cache and your changes will be start reflecting. It worked for me.
I presume you're working on Magento 2 using the default LESS, and in a development environment in developer mode.
How to compile
The easiest (and slowest!) way to compile LESS is to enable client-side compilation, to enable this go navigate to STORES > Configuration > ADVANCED > Developer > Front-end development workflow > Workflow type and change it to client-side.
How to display your changes
If your CSS isn't updating you'll likely need to delete var/view_preprocessed and pub/static/frontend. Then clear your browser cache and refresh the page.
Yes this is a huge pain, and creating your own workflow will save you a lot of time and hassle.
answered Apr 28, 2017 at 8:47
