email styles

10 posts from 3 voices

• Started 2 months ago by Hazral
• Latest reply from Devin
• This topic is closed
• This topic is not a support question

Tags:

No tags yet.

1. 

   Hazral
   Member

   Hi,

   i want to change the styles of the woocommerce mail templates.
   i checked the code of the mails but i cant find a clear part for the css attributes.

   Can anyone tell me where/how i can set the css attributes for "h2" for example?

   And another thing.... Is it possible to set an attachment? We want to attache the "terms and conditions" as an pdf file.

   Greets,
   Daniel

   PS: I read the article on envato about the 2 million milestone.... Congrats Kriesi and Team!! ;D

   Posted 2 months ago #
2. 

   Devin
   Moderator

   Hi Daniel,

   You can edit each email individually with the new woocommerce 2.0 settings. Go to WooCommerce>Settings>Emails.

   Under the tab is each email type that can be clicked on. At the bottom you'll see "HTML template with some basic instructions:
   To override and edit this email template copy woocommerce/templates/emails/admin-new-order.php to your theme folder: yourtheme/woocommerce/emails/admin-new-order.php.

   You'll need to do that for each of the email types to customize them.

   Regards,

   Devin

   Posted 2 months ago #
3. 

   Hazral
   Member

   i did that, but where should i set the css styles?

   Posted 2 months ago #
4. 

   Dude
   Dude

   Hi!

   The styles are hard coded in email-header.php - compare the code of the original template here: https://github.com/woothemes/woocommerce/blob/master/templates/emails/email-header.php

   Best regards,
   Peter

   Posted 2 months ago #
5. 

   Hazral
   Member

   Hey,

   I already found them and changed the styles of the h2 heading, but it didn´t change anything.
   I can make a child theme of the mail header, can´t i?

   And I think the styles in e-mail header are a bit sparsely or?

   Greets,
   Daniel

   Posted 2 months ago #
6. 

   Devin
   Moderator

   Hi Daniel,

   What you need to do is add the styling *into* the actual file. Emails are done like websites were 10 or so years ago where everything was done with inline styling.

   For example in the file Peter linked about there is this line:
   <p style="margin-top:0;">
   That makes that specific text line have no margin on top. You need to go through and edit the copy of the template you have put into yourtheme/woocommerce/emails/admin-new-order.php.

   Regards,

   Devin

   Posted 2 months ago #
7. 

   Hazral
   Member

   Hi,

   ok if it´s not possible otherways i´ll do it with the inline styling :) Thank you.

   And, Is it possible to set an attachment? We want to attache the "terms and conditions" and an other file as pdf´s.

   Greets,
   Daniel

   Posted 2 months ago #
8. 

   Devin
   Moderator

   Email styling is a whole sub industry of its own. MailChimp and some of the other big emailing companies have some good resources on how to format mail and get it working right with all of the various email clients which is what you'll want to look at if you are coding it all yourself.

   As for attachments, you would be better off linking to the them on your site. I don't know if woocommerce has the capability to add them but also you are just generally more likely to have people not open them/mark the item as spam if it has an attachment.

   Regards,

   Devin

   Posted 2 months ago #
9. 

   Hazral
   Member

   Yes the spam filter would be a problem, but the german law says we have to send our terms to the customer.

   We solved it with a woocommerce plugin :)

   Posted 2 months ago #
10. 

    Devin
    Moderator

    Glad you were able to find a workable solution :)

    Let us know if you have any other questions or issues.

    Regards,

    Devin

    Posted 2 months ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.