0

After edited CSS then run php bin/magento setup:static-content:deploy -f my changes revert, all my css workout removed.

CSS Path : pub/static/frontend/Codazon/fatest_grocery_gourmet/en_US/css/style-l.css

Best practice to edit CSS files?

2

You should not edit/modify files within pub/* or vendor/* directory. Pub is for deployment and vendor is for default structure, which you override via your template or custom modules. Instead:

  • Create a new theme inside app/design/frontend/{vendor}/{yourTheme}/. You can use Blank or Luma theme. You can also create new theme which inherites from Blank (inheritance is defined within theme.xml). 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.

  • You can also setup sourcemaps to pin point your styling within the theme .less files so you can be more productive.

Some useful references:

FYI: Magento2: Best practice to modify css files

| improve this answer | |
  • From your point " edit .less " where it is located? – zus Jul 10 at 8:18
  • Here "edit" is not a file name. it means if you need to edit and less file then you do in your theme/child theme. – Pushpendra Singh Jul 10 at 8:39
1

Did you changed the CSS in pup/static folder.If you did it is wrong. You need to change it's related less or css file in module/theme. After that run the required commands.

| improve this answer | |
1

Step 1: Create default_head_blocks.xml like below locations in your theme

app/design/frontend/Test/Theme/Magento_Theme/layout/default_head_blocks.xml and add the below code in it

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../../../vendor/magento/framework/Module/etc/module.xsd">
  <head>
    <css src="css/yourcustomstyle.css" />
  </head>
</page>

Step 2: create your css file at below locations

app/design/frontend/Test/Theme/web/css/yourcustomstyle.css

Step 3:- now go to pub/static/frontend and delete everything inside frontend folder.

now run below commands

<root>php bin/magento setup:upgrade

<root>php bin/magento setup:static-content:Deploy -f

<root>php bin/magento cache:Clean
| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.