1

When extending Magento Luma less files in one children theme, what exactly is the name and the complete structure of the "parent" folder (mentioned at https://developer.adobe.com/commerce/frontend-core/guide/css/quickstart/customize-styles/#extend-parent-styles) ?

I find the documentation very fuzzy here and I need help with this. I only can assume at this point we don't want to add the new file _extend-child.less on core parent theme folder.

Thank you very much in advance! See below the diagram from the documentation link.

app/design/frontend/Vendor/
├── parent
│   └── web
│       └── css
│           └── source
│               ├── _extend-child.less (keep this file empty)
│               └── _extend.less
└── child
    └── web
        └── css
            └── source
                └── _extend-child.less
...

1 Answer 1

1

Since the Luma theme does not have <luma theme dir>/web/css/source/_extend.less, you don't need to do anything with Luma's theme folder, just create <your theme dir>/web/css/source/_extend.less, then your theme will extend Luma theme (and Blank theme which is the parent of Luma theme) properly.

The diagram and the case mentioned in the documentation you are mentioning are for the parent theme (called theme A) that extends theme Blank and has web/css/source/_extend.less + the child theme (called theme B) that extends theme A and has web/css/source/_extend.less

6
  • I did exactly as you said and I only get an empty var/view_preprocessed/pub/static/frontend/mynamespace/mytheme/en_US/css/source/_extend.less file. Plus, in my case my theme is the theme A (extending blank) per the case described in documentation. I remove preprocessed files then I compile the less files at server with bin/magento setup:di:compile under developer mode. Evertyhing I do is by the book and not working (my installation is mint magento 2.4.6 on php 8.2).
    – steve
    Apr 1, 2023 at 3:05
  • In the original description, you mentioned that you extending Luma theme, but now you say your theme extending theme Blank, so it does not clear. I thought you are working with theme A which extends theme Blank, and does not relate to them Luma, isn't it? Anyway, you don't need to recompile code (bin/magento setup:di:compile) but remove static view files (in both var/view_preprocessed and pub/static) and re-deploy them: rm -rf var/view_preprocessed/pub/static/frontend/ && rm -rf pub/static/frontend/*/* && bin/magento s:s:d -f en_US --area frontend --theme yournamespace/yourtheme --no-parent
    – Tu Van
    Apr 1, 2023 at 4:14
  • I've tested and confirmed it works on 2.4.6. i.imgur.com/EM3buYj.png
    – Tu Van
    Apr 1, 2023 at 4:14
  • My theme is extending Luma (which Luma extends blank I mean). So my theme is B, extending A (Luma) which extends in its turn blank. My case is exactly the case I posted the link to. (my first comment was incorrect in this regard). You only added your new less code on newtheme/web/css/sources/_extend.less file and it works on frontend for you?
    – steve
    Apr 1, 2023 at 4:29
  • @steve got it. Yep, that's it, as I said before, Luma (your parent theme) does not have web/css/source/_extend.less, so you don't need to do anything with Luma's theme folder, just create <your theme dir>/web/css/source/_extend.less. One thing need to remember is you need to remove static view files in both var/view_preprocessed and pub/static. You can run the command I mentioned above to achieve that.
    – Tu Van
    Apr 1, 2023 at 5:53

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.