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?
asked Feb 25, 2018 at 15:05
Konstantin Patroev
3723 silver badges17 bronze badges
-
Why you just can't create a custom theme? It would make development a lot easier.Macas– Macas2018年02月25日 20:41:37 +00:00Commented 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– Konstantin Patroev2018年02月27日 09:57:12 +00:00Commented 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– Macas2018年02月28日 17:49:37 +00:00Commented Feb 28, 2018 at 17:49
2 Answers 2
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
answered Feb 25, 2018 at 15:46
-
Thank you for the response! Question: for xsi:noNamespaceSchemaLocation="should I put my path leading up to that file and shouldn't Vendor be with a lower case?Konstantin Patroev– Konstantin Patroev2018年02月25日 16:33:50 +00:00Commented Feb 25, 2018 at 16:33
-
Look my update please, more information about xml schema validation: devdocs.magento.com/guides/v2.0/extension-dev-guide/build/…2018年02月25日 22:28:28 +00:00Commented Feb 25, 2018 at 22:28
- 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:
php bin/magento setup:upgradephp bin/magento setup:static-content:deploy -fphp bin/magento cache:flush
answered Apr 25, 2019 at 11:10
Ansar Husain
3,4791 gold badge15 silver badges32 bronze badges
default