I am using Magento 2.2.1. I want to do changes in my CSS file. After inspecting on the website I am finding the source of CSS is from somewhere in pub/static folder. I tried editing the CSS in that folder and after that I ran the deploy command. But again my CSS is reverting back to the older one. Kindly help anyone. I have tried all the solutions provided in this website but am unable to get a correct way out of my problem.
1 Answer
You should not edit/modify files within pub/* or vendor/* directory.
The pub folder is for deployment only. Magento uses LESS CSS preprocessing for managing styles of themes and works in the following manner:
Instead of making changes in pub folder's css or js files or working directly in vendor folder, follow these steps:
- create a new theme inside app/design/frontend/{vendor}/{yourTheme}/. If you are already using some theme then skip this step.
- edit .less within your theme so the changes stay visible and don't get replaced when clearing the cache or upgrading the system.
- Use grunt to compile your .less into deployment files.
For more info, have a look at the following useful links:
-
Sir, I added my css the app folder as suggested by you, but still when I am doing any changes in that file my css is not getting changed. I have cleared the cache and even runned the deploy command.– supriyaDec 28, 2017 at 6:30
-
one more question. do i need to create .less file or .css file will do?? because i have created .css file.– supriyaDec 28, 2017 at 6:43
-
Are you able to see the changes now? As you have said that your query is resolved now. Dec 28, 2017 at 7:37
-
yes. but i am editing in a different file but using !important in every css.– supriyaDec 28, 2017 at 7:39
-
There is no need to use !important. Just follow the standards of LESS in Magento 2. Dec 28, 2017 at 7:42