Magento2 – Cannot Load Custom CSS via default_head_blocks.xml

cssjavascriptlayoutmagento2xml

UPDATE

Seems that you cannot inherit Luma…. it works properly when inheriting from blank.

github magento source says luma wasn't meant to be inherited.

Challenge is, I really like luma, but need to customize some stuff… so is there a way to do this?

Original Question:

new to Magento 2, followed the directions to make my own theme, a child of luma theme.

now, I cannot figure out why my default head blocks modification is not working.

I have put developer mode on, cleared cache, and it's not loading my custom css or the external font awesome I tried to link to, this is my code inside default_head_blocks.xml

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<head>
    <!--Custom Styles-->
    <css src="css/cvpstyle.css" />
    
    <!--Before-After Script-->
    <link src="js/jquery.twentytwenty.js"/>
    <link src="js/jquery.event.move.js"/>
    
    <!--Font Awesome-->
    <css src="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css" src_type="url" />
    
</head>
</page>

and my folder structure:
my folder structure

have I structured something wrong? I cannot figure out why this won't work.
Thanks in advance for any help!

UPDATE

per suggestions below, I changed the directory structure…. still does not work, this is the new directory structure

enter image description here

my actual XML:
my actual xml

and here's the folder structure now:
folder structure

UPDATE – Jan 29

I have gotten closer to the solution I believe…
I tried making another theme, and inherited from blank instead of luma, and it seems to work, I can see my css and js loaded, but there's literally NO styling on the page of course from blank.

what I wish to do is start with luma, and add some of my custom css…
here is my current XML, is there something wrong with this?

<theme xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Config/etc/theme.xsd">
 <title>CVPStyle</title> 
 <parent>Magento/luma</parent> 
 <media>
     <preview_image>media/preview.jpg</preview_image> 
 </media>
</theme>

Best Answer

Have you try put layout inside layout dir

basicly theme folder structure is

<theme>
  <etc>
  <Vendor_Module>
     <layout>
     <templates>
  <web>
     <css>
     <js>

Remove cache and pub/static/area/Vendor/theme may helps you fix problem

Related Topic