0

I have used Magento 2 with luma Theme. I have custom design for theme. I want to add one custom.css file in site.

1

Create <your-theme-directory>/Magento_Theme/layout/default_head_blocks.xml

Add the following:

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <head>
        <css src="css/your-css-file.css" />
    </head>
</page>

See the dev docs for more info - https://devdocs.magento.com/guides/v2.2/frontend-dev-guide/css-topics/css-themes.html

| improve this answer | |
1

Go to your layout file in

magento/theme_forntend_luma/Magento_Theme/layout/default.xml

and add your css file in head section like

    <?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <head>
        <css src="css/custom.css"/>
    </head>
</page>

Then run

php bin/magento setup:static-content:deploy

command to deploy all the static content.

NOTE: Default.xml is used only when you want to apply your css changes in all the theme.

| improve this answer | |
  • Hi, what is the path of css/custom.css? I tried putting it in vendor/magento/theme-frontend-luma/Magento_Theme/web/css but it didn't work – Robert Sinclair Oct 14 '19 at 19:11
  • for that you have to create child theme on the same dir. – sudo55 Oct 15 '19 at 9:22
0

First create your css file for ex. custom.css

put this css at below path

app/design/frontend/Magento/Luma/web/css

After that specify the path of your css in below file:

app/design/frontend/Magento/Luma/Magento_Theme/layout/default_head_blocks.xml

add following in this file:

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <head>
        <css src="css/custom.css"/>
    </head>
</page>
| 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.