Do you have a problem with the default WooCommerce email template?
I do.
After having taken so much trouble to set up the store, to select a good theme, adding each awesome product, to create an engaging user experience, I want every detail added, to go perfectly with rest of the store. And as for the emails sent to your customers are concerned, why should they be any different.
Okay, I accept WooCommerce has managed to keep the email template generic. But is that enough?
More often than not, clients ask us to customize Woocommerce order emails as well, to go along with the rest of their shop. They either want to add their site logo, or change the header, add additional links, to share offers or promote products, etc.
[space]
WooCommerce Email Settings
WooCommerce offers settings options, to change some basic look of the email templates, under WooCommerce -> Settings -> Emails-> Email Options. You can change the header image, title text, font color, footer text, etc.
But, if you were comfortable with a little coding, you could go beyond just changing the styling of the email, to changing the contents as well. Since WooCommerce provides several options for you to change the email template, you can do so without having to change anything in the core plugin.
[space]
Creating Custom Templates
WooCommerce sends out emails to customers on order creation, completion, for a payment invoice and for any changes made to an order. If you go to a particular option in WooCommerce Email Settings, for example ‘Processing Order’, you will notice a message.
To override and edit this email template copy {file-path} to your theme folder: {theme/file-path}. This method allows you a more advanced option to customize WooCommerce order emails. Because by doing this, you can directly override the email template file.
[space]
WooCommerce Email Templates
Every email sent out by WooCommerce is a combination of templates. This allows you more modular control over the customization. Thus, you only need to copy the required template file to your theme folder and then edit it. For example,
- If you wanted to change anything in the header, you will have to edit email-header.php
- For changes in the footer, you have to change, email-footer.php.
- And for the contents in the body, you will have to edit the particular order template, such as, customer-invoice.php or customer-processing-order.php, etc.
Changing the Email Template
Before assigning an email template to the order email, WooCommerce searches your theme’s folders, for the email template files. Thus, to change the email sent, all you have to do, is select the template file you want to change, and add it to your theme. For example, say you want to change the footer text color,
- By default the footer text color is set to a lighter shade of the base email color you select. To change this to say black, you have to change email-footer.php.
- You have to locate the file wp-content/plugins/woocommerce/templates/emails/email-footer.php
- Copy this to wp-content/themes/your-theme/woocommerce/emails/. If you do not have the directories woocommerce/emails, you will have to create those.
- Next is simple, open and edit the email-footer.php, and edit the following:
$credit = " border: 0; color: black; font-family: Arial; font-size: 12px; line-height:125%; text-align: center; ";
[space]
Another example we will take a look at, is to add say ‘Order Notes’, to a completed order email. For this, you’ll have to similarly copy, customer-completed-order.php, to your theme’s woocommerce/emails/ directory.
Open the file, and add the following:
<h2><?php _e( 'Order Notes', 'woocommerce' ); ?></h2> <?php $args = array( 'status' => 'approve', 'post_id' => $order->id ); $comments = get_comments($args); foreach($comments as $comment) : echo $comment->comment_content . '<br />'; endforeach; ?>
You’ll have to place the code, depending on where you want it displayed, in the email. Let’s say you can add it after ‘Order’ and before ‘Customer Details’.
[space]
Using Action Hooks and Filters
For more control over the content sent in the email, you will have to delve in a little deeper into actions and filters, which WooCommerce provides. For example, say you wanted to add the Shipping method chosen, in the order email. You could use the ‘woocommerce_email_after_order_table‘, or ‘woocommerce_email_before_order_table‘, to add the content.
add_action( 'woocommerce_email_after_order_table', 'wdm_add_shipping_method_to_order_email', 10, 2 ); function wdm_add_shipping_method_to_order_email( $order, $is_admin_email ) { echo '<p><h4>Shipping:</h4> ' . $order->get_shipping_method() . '</p>'; }
Remember, these methods are tightly linked to the theme you choose. Hence when you change your theme, you will have to move your modified template files, or the added actions, to the new theme as well.
[space]
Coming to the end of this article, I hope you found it useful, and it helped you customize your WooCommerce order emails. If you had any doubts or questions, or had more useful methods you’d like to share with our users, do remember to leave your comments, in the comment section below.
You might also like: FREE Cheat-Sheet of 23 Tips & Tricks to effectively manage large orders in your Woo store
19 Responses
Hi —
I was able to change the email template thanks to your explanation. Really clear. Thanks!
However, I wonder if you know what it would take to add in a 2nd email template for admin-new-order that gets used only when a customer orders Product “Hair On Fire” rather than “Product “Relax, dude”. This would be to put in some sort of condition of
If x = HOF then template 2. If x = RD then template 1. But where would all that go?
Also — you state this:
If I merely update the theme that I’m using, will I also have to update the mod template files?
Thanks!
Hi Sheila,
Thank-you for your comment. You can set two different email templates for the two products. You will have to make the changes in admin-new-order.php. Since you have access to $order, you can use this to check which product is being purchased (assuming of course that customer can purchase either of the products and not both).
$items = $order->get_items();
foreach ( $items as $item ) {
$product_name = $item[‘name’];
// check for your product and apply a different style
}
For any changes you want to make in a theme, (even the addition of these template files), the best way to do this, is to create a child theme and make any changes there. So that your changes do not get overridden when you update your theme.
Hope this helps.
We have launched a plugin called Email Control for WooCommerce (on CodeCanyon) that does what some of you are discussing in this thread – it allows you to customize the styling, colors, logo, and what the text says in the emails sent from your WooCommerce store, using the familiar WordPress Customizer interface. We created the plugin for our store as we needed more control over what the text in our emails said and wanted their design to look more professional and unique. We think the plugin could be a solution for some of you here.
Hi,
If someone is interested, here is a link to my latest work on CodeCanyon :
http://codecanyon.net/item/woocommerce-pretty-emails/9005845
Should respond to all basic needs regarding email customization.
Have a good day.
Hi,
I also want to change the email templates but my problem is the following:
I have two payment options, Paypal and cash in advance. The default email text content for “processing order” and “order completed” can stay the way they are for when a customer is paying via Paypal, but when someone chooses to pay cash in advance, I need the “processing order” email to have a completely differnt content. It should just say “Thank you for your order, with this email we are confirming to have received it.” There should NOT be any details about the purchased item. Then, the second email should basically have the content that is usually in the “processing order” email (product details, we are processing your order, please pay the amount to the following account). How can I achieve this? I am very new to WordPress but have installed a child theme.
Thank you for your help!
Hi Andrea,
I’ve understood your requirement, I think the $order->payment_method_title attribute can help you verify the payment method used. I haven’t tried out a solution, but here’s what I think can help you. You will have to customize the customer-processing-order.php template. Copy woocommerce/templates/emails/customer-processing-order.php to /your-child-theme/woocommerce/emails/customer-processing-order.php
In that file, add a condition to check the payment method using $order->payment_method_title attribute before Order Details are displayed (i.e., after do_action(‘woocommerce_email_header’, $email_heading);). So here if payment method is PayPal, you can print order details as usual, else if payment method is Cash in Advance, you can send across the text you need.
Regarding the second e-mail, I’m not very sure when you would want that e-mail sent. Should it be sent immediately after the first e-mail?
Hi, great article! Could you help me figure out why WooCommerce is sending only plain text emails – I have only plain email option – i.e., under WooCommerce -> Settings -> Emails-> New Order –> Email Type – “Plain text ” option ONLY!
This is so helpful! Thank you! I’m wondering if it’s possible to send a custom email based on product category. For instance, for products in digital downloads category, customer get Email A and for products in physical product category, customer gets Email B. My developer says this isn’t possible, but it seems like it shouldn’t be so hard. Is he right? Is this impossible to do? Thank you in advance!
Hi Davina,
Your requirement is definitely doable. The customization will require approximately 50 hrs of customization effort.
Hi i want to change the text “date” to “starting date” in email (ie conformed, processing order )..how can i do that..and i want to show booking id instead of order id in the email …pls help me out
Thanks Aparna Gawade, you made my day
😀
Thank you so much for the detailed tutorial! It’s not easy finding out how to customize emails without being an experienced coder. I was able to add in the order notes, but I was thinking this option would only add the most recent manual note, not all the order notes woocommerce adds such “Order status changed from Pending Payment to Processing” and “Processing order email notification manually sent”. Is it possible to only add the latest note? My guess is this line would have to be changed > “foreach($comments as $comment) :”
Appreciate your assistance!
Hi there. I was able to add the Shipping Method to the Order Email… but I can’t seem to add the Shipping Zone to the Order Email, which I need to do. Can you help me out with this please?
Hi, The WordPress plugin Email Customizer for WooCommerce will help your resolve your email customization needs. You can create product / product category based email templates for woocommerce new order mails. And can edit all the woocommerce order templates. Please refer this http://www.smackcoders.com/email-customizer-woocommerce-pro.html
HI Aparna
I am trying to add a column in my New Order email so that it shows the ID in the first column after the product name. I did manage to add a column but could not then get the data to be included. Can you help guide me?
Hi Aparna
Thank you for the great post. We tried the steps and most part, it worked. However, our day to day staff are finding it difficult if they want to add any up-sell products in the transactions emails.
So we have used this plugin which allows you to edit the WooCommerce emails using a drag and drop builder and customize it totally – WooCommerce Email Customizer with Drag and Drop page builder
Hope this helps someone 🙂
Hi, this is great code, I used hooks. But does anyone know, how I can set certain changes for specific email typesa, e.g. for only the new order email? Thanks for help.
Hello,
Do you know of a way to delete or edit the “view your product” link that is present when a customer receives an order. I have a completely customized product, so when you click on that, it takes you to the base product, not the customized one, so it’s actually not reflecting the actual product that the customer designed.
Thank you!
Karina