0

I created a header.html located in the

app/design/frontend/{VENDOR}/{MODULE}/Magento_Email/email/header.html

not within this header.html I added a div tag that has a class of custom-border.

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="initial-scale=1.0, width=device-width" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <style type="text/css">
        {{var template_styles|raw}}
        {{css file="css/email.css"}}
    </style>
</head>
<body>
    {{inlinecss file="css/email-inline.css"}}
    <h1 class="custom-border">Custom Border div here</h1> <!-- newly added -->
    <!-- Begin wrapper table -->

Now I also have an email-inline.less located in

app/design/frontend/{VENDOR}/{MODULE}/Magento_Email/web/css/email-inline.css

Within this file I have defined the code as shown below

.custom-border {
    border: 10px solid green;
    color: red;
}

Now I went to the Magento Admin under Marketing->Communication->Email Templates and I added a new header by selecting my Custom Header as my Load Default Template. After I load the template it indeed show the header.html that I created. Now when I save this new header template I created in the admin then clicking the preview button the style that has a selector of .custom-border is not taking effect.

What am I missing? I already cleared cache, deleted generated and pub/static folder. Deploy static-content. But still the email-inline.less changes does not take effect.

Any idea guys?

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.