How to modify logo and css style for emails templates in magento 2?
I need to set a new logo and make some css adjustments for emails like "password-reset" in magento 2.
magento2 css email-templates
edited Dec 23 '16 at 9:30
Rakesh Jesadiya
28.6k1571119
asked Mar 18 '16 at 12:45
Philipp SanderPhilipp Sander
3661319
bumped to the homepage by Community♦ yesterday
This question has answers that may be good or bad; the system has marked it active so that they can be reviewed.
add a comment |
I need to set a new logo and make some css adjustments for emails like "password-reset" in magento 2.
magento2 css email-templates
edited Dec 23 '16 at 9:30
Rakesh Jesadiya
28.6k1571119
asked Mar 18 '16 at 12:45
Philipp SanderPhilipp Sander
3661319
bumped to the homepage by Community♦ yesterday
This question has answers that may be good or bad; the system has marked it active so that they can be reviewed.
add a comment |
I need to set a new logo and make some css adjustments for emails like "password-reset" in magento 2.
magento2 css email-templates
edited Dec 23 '16 at 9:30
Rakesh Jesadiya
28.6k1571119
asked Mar 18 '16 at 12:45
Philipp SanderPhilipp Sander
3661319
I need to set a new logo and make some css adjustments for emails like "password-reset" in magento 2.
magento2 css email-templates
magento2 css email-templates
edited Dec 23 '16 at 9:30
Rakesh Jesadiya
28.6k1571119
asked Mar 18 '16 at 12:45
Philipp SanderPhilipp Sander
3661319
edited Dec 23 '16 at 9:30
Rakesh Jesadiya
28.6k1571119
asked Mar 18 '16 at 12:45
Philipp SanderPhilipp Sander
3661319
edited Dec 23 '16 at 9:30
Rakesh Jesadiya
28.6k1571119
edited Dec 23 '16 at 9:30
Rakesh Jesadiya
28.6k1571119
edited Dec 23 '16 at 9:30
Rakesh Jesadiya
28.6k1571119
28.6k1571119
asked Mar 18 '16 at 12:45
Philipp SanderPhilipp Sander
3661319
asked Mar 18 '16 at 12:45
Philipp SanderPhilipp Sander
3661319
asked Mar 18 '16 at 12:45
Philipp SanderPhilipp Sander
3661319
3661319
bumped to the homepage by Community♦ yesterday
This question has answers that may be good or bad; the system has marked it active so that they can be reviewed.
bumped to the homepage by Community♦ yesterday
This question has answers that may be good or bad; the system has marked it active so that they can be reviewed.
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
For setting up your custom logo:
Stores -> Configuration -> Design -> Email -> Logo Image
There you can upload your custom logo image and then, also in
Stores -> Configuration -> Design -> Email
You can set up your logo width and height.
You can also modify your password-reset email trhough Magento Admin in
Marketing -> Email Templates
And Add your custom Email template for Password Reset as it is explained here.
If you want to avoid using your common header and calling your logo "as is" and then inline-styling it, this is the var you need to put as "src" attribute.
{{var logo_url}}
EDIT:
If what you want to do is to edit your email template using your theme you can look here it shows you how to use the template fallback to achieve it. Should be something like copying and editing
app/code/Magento/Customer/view/frontend/email/password_reset.html
in your
app/design/frontend/vendor/theme/Magento_Customer/email/password_reset.html
(I didn't try this yet, but according to the documentation it should work)
answered Mar 18 '16 at 13:39
Fernando CarrascosaFernando Carrascosa
114
I don't want to do it in the backend. I need to solve this based on code. that's why I asked what files I have to modify
– Philipp Sander
Mar 18 '16 at 13:41
I just updated the info with what I think it's the way to do it.
– Fernando Carrascosa
Mar 18 '16 at 15:00
1
But where are the LESS files?!?!? and which one exactly??!?!?! you are not answering my question
– Philipp Sander
Mar 18 '16 at 15:14
Anyway, you can place your LESS files in app/design/frontend/vendor/theme/web/css/email-inline.less and base it on [this template] (github.com/magento/magento2/blob/develop/app/design/frontend/…) of magento core files.
– Fernando Carrascosa
Mar 18 '16 at 15:34
add a comment |
Your Answer
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "479"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: false,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: null,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fmagento.stackexchange.com%2fquestions%2f106922%2fhow-to-modify-logo-and-css-style-for-emails-templates-in-magento-2%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
For setting up your custom logo:
Stores -> Configuration -> Design -> Email -> Logo Image
There you can upload your custom logo image and then, also in
Stores -> Configuration -> Design -> Email
You can set up your logo width and height.
You can also modify your password-reset email trhough Magento Admin in
Marketing -> Email Templates
And Add your custom Email template for Password Reset as it is explained here.
If you want to avoid using your common header and calling your logo "as is" and then inline-styling it, this is the var you need to put as "src" attribute.
{{var logo_url}}
EDIT:
If what you want to do is to edit your email template using your theme you can look here it shows you how to use the template fallback to achieve it. Should be something like copying and editing
app/code/Magento/Customer/view/frontend/email/password_reset.html
in your
app/design/frontend/vendor/theme/Magento_Customer/email/password_reset.html
(I didn't try this yet, but according to the documentation it should work)
answered Mar 18 '16 at 13:39
Fernando CarrascosaFernando Carrascosa
114
I don't want to do it in the backend. I need to solve this based on code. that's why I asked what files I have to modify
– Philipp Sander
Mar 18 '16 at 13:41
I just updated the info with what I think it's the way to do it.
– Fernando Carrascosa
Mar 18 '16 at 15:00
1
But where are the LESS files?!?!? and which one exactly??!?!?! you are not answering my question
– Philipp Sander
Mar 18 '16 at 15:14
Anyway, you can place your LESS files in app/design/frontend/vendor/theme/web/css/email-inline.less and base it on [this template] (github.com/magento/magento2/blob/develop/app/design/frontend/…) of magento core files.
– Fernando Carrascosa
Mar 18 '16 at 15:34
add a comment |
For setting up your custom logo:
Stores -> Configuration -> Design -> Email -> Logo Image
There you can upload your custom logo image and then, also in
Stores -> Configuration -> Design -> Email
You can set up your logo width and height.
You can also modify your password-reset email trhough Magento Admin in
Marketing -> Email Templates
And Add your custom Email template for Password Reset as it is explained here.
If you want to avoid using your common header and calling your logo "as is" and then inline-styling it, this is the var you need to put as "src" attribute.
{{var logo_url}}
EDIT:
If what you want to do is to edit your email template using your theme you can look here it shows you how to use the template fallback to achieve it. Should be something like copying and editing
app/code/Magento/Customer/view/frontend/email/password_reset.html
in your
app/design/frontend/vendor/theme/Magento_Customer/email/password_reset.html
(I didn't try this yet, but according to the documentation it should work)
answered Mar 18 '16 at 13:39
Fernando CarrascosaFernando Carrascosa
114
I don't want to do it in the backend. I need to solve this based on code. that's why I asked what files I have to modify
– Philipp Sander
Mar 18 '16 at 13:41
I just updated the info with what I think it's the way to do it.
– Fernando Carrascosa
Mar 18 '16 at 15:00
1
But where are the LESS files?!?!? and which one exactly??!?!?! you are not answering my question
– Philipp Sander
Mar 18 '16 at 15:14
Anyway, you can place your LESS files in app/design/frontend/vendor/theme/web/css/email-inline.less and base it on [this template] (github.com/magento/magento2/blob/develop/app/design/frontend/…) of magento core files.
– Fernando Carrascosa
Mar 18 '16 at 15:34
add a comment |
For setting up your custom logo:
Stores -> Configuration -> Design -> Email -> Logo Image
There you can upload your custom logo image and then, also in
Stores -> Configuration -> Design -> Email
You can set up your logo width and height.
You can also modify your password-reset email trhough Magento Admin in
Marketing -> Email Templates
And Add your custom Email template for Password Reset as it is explained here.
If you want to avoid using your common header and calling your logo "as is" and then inline-styling it, this is the var you need to put as "src" attribute.
{{var logo_url}}
EDIT:
If what you want to do is to edit your email template using your theme you can look here it shows you how to use the template fallback to achieve it. Should be something like copying and editing
app/code/Magento/Customer/view/frontend/email/password_reset.html
in your
app/design/frontend/vendor/theme/Magento_Customer/email/password_reset.html
(I didn't try this yet, but according to the documentation it should work)
answered Mar 18 '16 at 13:39
Fernando CarrascosaFernando Carrascosa
114
For setting up your custom logo:
Stores -> Configuration -> Design -> Email -> Logo Image
There you can upload your custom logo image and then, also in
Stores -> Configuration -> Design -> Email
You can set up your logo width and height.
You can also modify your password-reset email trhough Magento Admin in
Marketing -> Email Templates
And Add your custom Email template for Password Reset as it is explained here.
If you want to avoid using your common header and calling your logo "as is" and then inline-styling it, this is the var you need to put as "src" attribute.
{{var logo_url}}
EDIT:
If what you want to do is to edit your email template using your theme you can look here it shows you how to use the template fallback to achieve it. Should be something like copying and editing
app/code/Magento/Customer/view/frontend/email/password_reset.html
in your
app/design/frontend/vendor/theme/Magento_Customer/email/password_reset.html
(I didn't try this yet, but according to the documentation it should work)
answered Mar 18 '16 at 13:39
Fernando CarrascosaFernando Carrascosa
114
edited Mar 18 '16 at 14:59
answered Mar 18 '16 at 13:39
Fernando CarrascosaFernando Carrascosa
114
answered Mar 18 '16 at 13:39
Fernando CarrascosaFernando Carrascosa
114
answered Mar 18 '16 at 13:39
Fernando CarrascosaFernando Carrascosa
114
114
I don't want to do it in the backend. I need to solve this based on code. that's why I asked what files I have to modify
– Philipp Sander
Mar 18 '16 at 13:41
I just updated the info with what I think it's the way to do it.
– Fernando Carrascosa
Mar 18 '16 at 15:00
1
But where are the LESS files?!?!? and which one exactly??!?!?! you are not answering my question
– Philipp Sander
Mar 18 '16 at 15:14
Anyway, you can place your LESS files in app/design/frontend/vendor/theme/web/css/email-inline.less and base it on [this template] (github.com/magento/magento2/blob/develop/app/design/frontend/…) of magento core files.
– Fernando Carrascosa
Mar 18 '16 at 15:34
add a comment |
I don't want to do it in the backend. I need to solve this based on code. that's why I asked what files I have to modify
– Philipp Sander
Mar 18 '16 at 13:41
I just updated the info with what I think it's the way to do it.
– Fernando Carrascosa
Mar 18 '16 at 15:00
1
But where are the LESS files?!?!? and which one exactly??!?!?! you are not answering my question
– Philipp Sander
Mar 18 '16 at 15:14
Anyway, you can place your LESS files in app/design/frontend/vendor/theme/web/css/email-inline.less and base it on [this template] (github.com/magento/magento2/blob/develop/app/design/frontend/…) of magento core files.
– Fernando Carrascosa
Mar 18 '16 at 15:34
I don't want to do it in the backend. I need to solve this based on code. that's why I asked what files I have to modify
– Philipp Sander
Mar 18 '16 at 13:41
I don't want to do it in the backend. I need to solve this based on code. that's why I asked what files I have to modify
– Philipp Sander
Mar 18 '16 at 13:41
I just updated the info with what I think it's the way to do it.
– Fernando Carrascosa
Mar 18 '16 at 15:00
I just updated the info with what I think it's the way to do it.
– Fernando Carrascosa
Mar 18 '16 at 15:00
1
1
But where are the LESS files?!?!? and which one exactly??!?!?! you are not answering my question
– Philipp Sander
Mar 18 '16 at 15:14
But where are the LESS files?!?!? and which one exactly??!?!?! you are not answering my question
– Philipp Sander
Mar 18 '16 at 15:14
Anyway, you can place your LESS files in app/design/frontend/vendor/theme/web/css/email-inline.less and base it on [this template] (github.com/magento/magento2/blob/develop/app/design/frontend/…) of magento core files.
– Fernando Carrascosa
Mar 18 '16 at 15:34
Anyway, you can place your LESS files in app/design/frontend/vendor/theme/web/css/email-inline.less and base it on [this template] (github.com/magento/magento2/blob/develop/app/design/frontend/…) of magento core files.
– Fernando Carrascosa
Mar 18 '16 at 15:34
add a comment |
Thanks for contributing an answer to Magento Stack Exchange!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Some of your past answers have not been well-received, and you're in danger of being blocked from answering.
Please pay close attention to the following guidance:
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fmagento.stackexchange.com%2fquestions%2f106922%2fhow-to-modify-logo-and-css-style-for-emails-templates-in-magento-2%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
