1

I start building new theme from scratch and I add custom.css to mytheme->magento_theme->web->css

when i test new css with simple code website not working correctly

I already:

Add css to default.head.blocks.xml

Deploy static content

Improve this question
4
  • can you please share your coed in questions?
    – Abdul
    Commented Dec 30, 2017 at 13:03
  • You can import your custom css into theme's _extends.less and deploy and check
    – Purushotam Sharma
    Commented Dec 30, 2017 at 14:01
  • Check with private browser to see changes... Because it doesn't make cache.... Else delete your custom css in pub/static/yourtheme to check your changes
    – Ranganathan
    Commented Dec 30, 2017 at 14:15
  • working with me by add _extends.less to customer moduel
    – Magento
    Commented Dec 30, 2017 at 15:35

2 Answers 2

Reset to default
0

You need to add default_head_block.xl file in your custom theme in Magento_Theme directory.

Add your custom css file to app/design/frontend/namespace/theme/web/css/custom.css

app/design/frontend/namespace/theme/Magento_Theme/layout/default_head_blocks.xml

and copy this code

<?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>

After adding this, delete your pub/static/frontend/ directory and deploy static files.

Improve this answer
0

The file that you are using needs to be default_head_blocks.xml, not default.head.blocks.xml. This file can live in a lot of places, but i prefer to have it here:

app/design/frontend/{{your_namespace}}/{{your_theme}}/Magento_Theme/layout/default_head_blocks.xml

Make sure the css file is should up in the pub/static/frontend folder structure. The css might be in different places inside those fodlers depending on your set up, so i can say the exact path. But it needs to be in there for the browser to see it. This is easy to check as the browser will give you a 404 on the file if the xml is set up correctly.

Double check the syntax of your file. It should look something like this:

<?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>
        <!-- Google Fonts -->
        <!-- <link src="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800" src_type="url" rel="stylesheet" /> -->
        <css src="css/styles-m.css" />
    </head>
</page>

And inside that file, you need to make sure that your xml is valid, i can't count how many times i missed a closing tag that made the file invalid. Test it here:

https://www.w3schools.com/xml/xml_validator.asp

Improve this answer

Your Answer

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

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