2

sorry if this is obvious or has been answered. I tried looking around and didn't see it. Also I'm getting around Magento okay but by no means an expert.

I have a Magento 2 theme that it was recommended I purchase for work. I have created my own theme that extended that purchased theme and it works and seems properly set up.

I then tried to create less files to extend the styling but none of them worked. I did all the necessary steps and my changes just never showed up. Finally I found that the issue was that the purchased theme does NOT extend Magento Blank or Luma. It's a top level theme. None of the basic extending mechanisms (_extend.less, _widgets.less etc) work. When I updated the theme table to have the custom theme extend Magento/blank, my css changes do appear but then the theme itself is a bit wrecked, presumably because it's including a bunch of Magento stuff that it hadn't before.

So, I don't know where to go from here. First of all, does that diagnosis sound right? It's completely possible that there's some way to do it after all that I haven't thought of. Then, is this normal? Should a purchased theme extend Blank? (and really the question is, if I dropped it and purchased another will I have the same problem).

How can I make my own style changes to this purchased theme? Or should I abandon it and start over?

Improve this question
3
  • What did you end up doing? If you changed themes which one?
    – J. M. Becker
    Commented Jan 8, 2019 at 18:51
  • I don't have a happy answer for this unfortunately. I asked the theme provider and they told me to include my css in the default_head_blocks.xml (in other words, modify their code to include my css inline). I knew I could do that but I was hoping I wouldn't have to. I've done it because I wasn't getting any other answers and I have to get work done. I'd still like to know if this is normal.
    – S Adamson
    Commented Jan 9, 2019 at 0:46
  • It isn't normal for any other platform, but magento 2, has so many crippling design flaws that it's essentially the only way to do things. You end up working around the platform for almost any changes, that's what I've seen also. No it isn't normal though, the project needs a fork, the leadership is still as crooked and incompetent as it was before. It needs to be developed by its user base, the priorities are completely backwards.
    – J. M. Becker
    Commented Jan 17, 2019 at 15:27

1 Answer 1

Reset to default
0

Okay, so I finally have a detailed answer to this question over a month later. Their theme does not have the built-in include to _extend.less that Luma does. In fact the theme that I purchased uses sass not less. However the same layout overrides still work and less is still built into Magento.

I did NOT need to edit their code I just needed to extend their layout.

Here's what I did:

app/design/frontend/MyVendor/MyTheme/Magento_Theme/layout/default_head_blocks.xml

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../../../../../lib/internal/Magento/Framework/View/Layout/etc/page_configuration.xsd">
    <head>
        <css src="css/source/custom.css" /><!-- My theme -->
    </head>
</page>

app/design/frontend/MyVendor/MyTheme/web/css/source/custom.less

@import "./file1.less";
@import "./file2.less";
[ ... etc ...]
  • Yes I called it as custom.css but the file is custom.less and is a less file. Magento does that automagically.
  • You don't have to logically separate your less files-- you can include all your custom styling in custom.less-- but when you have a lot of styles it's easier to read. In practice file1 and file2 will have names like header.less or catalog.less or checkout.less and will live in the same folder (css/source/) as the custom.less file.
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.