0

I got very strange issue with Magento 2 and custom css files. I'm trying to add custom css to the head

<head>
    <link src="js/bundle.js"/>
    <css src="css/main.css" />
</head>

After I flush cache, do deploy and than I see all css files in

pub\static\frontend\Sleepz\md\en_US\css

except of main.css

I tried to deploy in developer/default mode, did Di compile, guess everything. What I do wrong?

2 Answers 2

0

I am sharing my cutom module files , it working

Link your css file using xml in your theme/module

custom_module/view/frontend/layout/cms_index_index.xml or ( default.xml )

In head of your layout xml put relative path like below

<head>
        <css src="Custom_Module::css/hb_vertical_reviewrating.css"/>
</head> 

Put your custom css files at this location

/view/frontend/web/css/hb_vertical_reviewrating.css
6
  • Nope, it's also not working Refused to apply style from 'site.com/pub/static/frontend/Sleepz/md/en_US/Magento_Theme/css/main.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.
    – Oleg
    May 31, 2018 at 7:32
  • please check .htaccess file in the pub/static
    – inrsaurabh
    May 31, 2018 at 9:03
  • @Oleg Is your problem solved
    – inrsaurabh
    Jun 1, 2018 at 14:15
  • sorry for the delay. Yes now it's solved. I just reinstalled Magento again and this time everything works like a charm. I have no clue what was wrong at first time
    – Oleg
    Jun 2, 2018 at 19:54
  • Did you checked the . htaccess file ?
    – inrsaurabh
    Jun 3, 2018 at 1:59
0

Add the your custom css in your theme folder

app/design/frontend/theme_name/package_name/Magento_Theme/layout/default_head_blocks.xml

In default_head_blocks.xml file

    <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <head>
      <!--  Add local resources -->

        <css src="css/main.css" />

    <!--  The following two ways to add local JavaScript files are equal     --> 
       <link src="js/bundle.js"/>

   <!-- Add external resources ->
   <css src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css" src_type="url" />

 </head>
 </page>
2
  • well, will try in now. But does it really matter default_head_blocks.xml or default.xml?
    – Oleg
    May 30, 2018 at 15:47
  • it didn't help, same issue
    – Oleg
    May 30, 2018 at 15:50

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.