0

I am trying to add custom CSS without creating a theme and these are my steps.

Step 1 I create a mycss.css file

body{
 background-color:green;

 }

and this is the path

app/code/vendor/module/view/frontend/web/css/mycss.css

Step 2 I create a test_index_index.xml file with this content

?xml version="1.0"?>
     <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_layout.xsd">
       <head>
          <css src="vendor_Module::css/mycss.
     </head> 
       <body>
         <referenceContainer name="content">
              <block class="vendor\Module\Block\class" template="vendor_Module::class.phtml"/>
         </referenceContainer>  
     </body> 
    </page>

Which is located at

app/code/vendor/module/view/frontend/layout/test_index_index.xml

Reference Magento 2: How to add css and js in custom module in magento 2?

Unfortunately, on my frontend nothing changes. Does anybody know why?

Improve this question
3
  • Why you just can't create a custom theme? It would make development a lot easier.
    – Macas
    Feb 25, 2018 at 20:41
  • It was successful with the theme but I wanted to try to decrease the files and the complexity only to a css and a xml file because the only needed change is to margin a text field with 10 px.
    – Konstantin Patroev
    Feb 27, 2018 at 9:57
  • Sooner or later you will need to do some more changes. There is no project where all you need is 10px margin. Also in my opinion, themes adds some clarity not complexity.
    – Macas
    Feb 28, 2018 at 17:49

2 Answers 2

Reset to default
1

test_index_index.xml

<?xml version="1.0"?>
        <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_layout.xsd">
        <head>
            <css src="Vendor_Module::css/mycss.css"/>
        </head> 
        <body>
            <referenceContainer name="content">
                <block class="Vendor\Module\Block\Class" template="Vendor_Module::file.phtml"/>
            </referenceContainer>  
        </body> 
    </page>

php bin/magento cache:clean

php bin/magento setup:static-content:deploy -f

Improve this answer
2
1
  1. Create _module.less file inside Vendor\Module\view\frontend\web\css\source\ and write below code inside the file:
& when(@media-common = true) {
  // write here your css 
}

Then run below commands:

  1. php bin/magento setup:upgrade
  2. php bin/magento setup:static-content:deploy -f
  3. php bin/magento cache:flush
Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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