How to customize WooCommerce Emails

WordPress is a great e-commerce platform and WooCommerce is the best WordPress e-commerce plugin so far. Nearly 30% of online stores all over the world are now using WooCommerce. However, the WooCommerce transactional emails which store owners use to communicate with their customers are so underdeveloped and does not offer much in terms of customization of design.

There is a high demand that comes to customizing these emails because store owners would want to customize these default emails to match with their store designs and styles. If you find yourself as one of these store owners, you came in the right place.

A lot of tools had been developed to help resolve this issue. In this article, I’ll take you through the easiest way you need to know about customizing your WooCommerce email templates in order to match your brand, so you can break away from the vague template that are defaults for WooCommerce.

Why Customize Email Templates?

There are lots of advantages that comes with customizing the WooCommerce Emails, some of these include the following:

1. Unlike the regular WooCommerce’s mail template which would show the same or very similar mail concepts from different stores to a customer and make it difficult for them to easily identify a specific store, an Email customizer would help have a specific brand design concept for your Emails that could be easily recognized by most customers.
2. There is an advantage of more flexibilities in terms of additional elements that could be used in your templates to spice up your designs since WooCommerce’s default is a ‘take-as-is’ kind of design.
3. You have the ability to include several information in the Emails you send out to your customers and add more values in term of personalization etc.

The Default WooCommerce Email Templates

WooCommerce have different default mail templates that comes with it. You can not customize these template designs at default but we will guide you how to do it below. They can be branded with your colors, logos, fonts etc.

These templates include:

• New Order – Notifies the store admin that a new order has been placed on the website.
• Cancelled Order – Notifies the store admin of an order that has been cancelled.
• Failed Order – Notifies the store admin of a failed order.
• Order On-Hold – Sends to the customer and contains details of the order. Triggered when the order status is changed to “On-Hold”.
• Order Processing – Sends to the customer and contains details of the order.  Triggered when the order status is changed to “Order Processing”.
• Order Completed – Sends to the customer and contains details of the order. Triggered when the order status is changed to “Order Complete”.
• Order Refunded – Sends to the customer when an order is refunded.
• Customer Invoice – Sends to the customer and contains order information and payment links.
• Customer Note – Sends to a customer. Triggered when a store owner adds a note to the order.
• Password Reset – Sends to a customer when they request a new password via the store.
• New Account – Sends to a customer when they create a new account in the store.

How to Customize WooCommerce Email Templates

This job could be done easily with the help of a free plugin called YayMail. In your WordPress plugin dashboard, search for YayMail and install it.

Then navigate to WooCommerce > Email Customizer, you’ll see all WooCommerce emails are displayed in YayMail interface.

With predesigned elements, you can drag and drop them to design your email templates.

Common Design Customizations

Some of the common Design Customizations you can change include:

Header Image – An image that you’d like to display at the top of all emails. You might want to use your logo or other brand imagery here.

Footer Text – Information found at the bottom of each email. Include a link to your website and contact information to make it easy for your customers to get in touch.

Base Color – The color used for headings, links, and the background of your email title.

Background Color – The color used for the background of the email.

Body Background Color – The color of your email content background.

Body Text Color – The color for all written email content.

Basically, it’s the same method you would use if you want to customize any WooCommerce email template, but as an example, we will explain how to customize the ‘New Order’ email template.

You can customize the ‘New Order’ email template via your WordPress admin dashboard > WooCommerce > Email Customizer > New Order.

Here is a screenshot that shows the default WooCommerce design for this template:

Now, we can follow these easy steps to make a better design:

Change the Logo:

You can change the Logo by clicking on the default WooCommerce Logo and change it or simply by clicking on the “Element” tab and then drag and drop the Logo element to the top layer of the design.

Set the Heading color:

This is the color of your Order Title background and it is better to set this based on your website’s color scheme and color consistency.

Change the Title text:

This is the title of the email and you can design it by clicking on the title then change the shortcode, font type, font color etc.

Add a Heading text: 

You can add a header texts, something nice to motivate your customers by clicking on the “Elements” tab and dragging and dropping the “Text” element to the canvas.

Personalize some parts of the Email content:

This is a very cool way to win the hearts of your customers with a touchy and personal email, you can add or edit a “Text” element, then click on the “shortcode” options to see available name shortcodes to add in the text, so as to call each customers name in the email.

Change the Order Details, Billing and Shipping Details header color:

You can add these elements via the “Elements” tab and even create two columns for the Billing and Shipping details.

You can click to edit them if already existing in the design canvas and then adjust the colors and fonts etc.

Add a Button at the bottom and change its color for consistency

You can add a button by dragging and dropping to the working canvas via the basic “Elements” tab and a button is a good way to add special discounted products or offers.

Add a nice footer text:

A footer text is not so necessary but in fact, if well used it might add some spice to your designs and it might just be a great way to add watermarks, special link, unsubscribe link etc. You can click to edit the existing one or add a new footer text via the basic elements from the “Elements” tab.

What next after customizing Email template?

1. Send test email: One-click to send a test message to any email address to see how your designed email would look like in the inbox.
2. Preview: Instantly view your customized email in a pop-up at full-screen mode. You can see how it looks on desktop and mobile devices.
3. Save: Save your edits at any point in time.

Here is a screenshot that shows our new design for this template with YayMail:

Moreover, there are so many available shortcodes for you to customize WooCommerce email content at ease.

More infomation about YayMail plugin

YayMail – WooCommerce Email Customizer is a WordPress plugin that gives you the opportunity to customize all the different emails sent out by WooCommerce.
Its drag and drop editor makes it super easy to edit the emails to the desired state that suits your business. For instance, you can add images, use different fonts, icons, colours, and so on.

The plugin comes in two forms including:

YayMail Free: A free plugin to help you fully customize 11 standard WooCommerce email templates

YayMail Pro: A paid plugin including all the free features, and includes advanced features for WPML, order tracking, etc.

YayMail Addons: There are also a lot of plugins out there which generate additional emails for WooCommerce, luckily YayMail have addons for them. You can see more details on their YayMail documentation page.

Wrapping Up

In conclusion, we discussed how to customize WooCommerce messages with an easy to use plugin. Having an incredible email format for WooCommerce is the ideal method of connecting with your clients.

Moreover, a great deal of clients anticipate seeing a well-structured email in their inbox when they have bought a thing on your site. Having a plain email with just messages will put them off and make them buy from other sites.

YayMail is an Email Customizer for WooCommerce that is accessible in both free and premium variants. The free form is presumably enough in the event that you are simply beginning and making your first layout. Nonetheless, as you progress you might discover the need to move up to the premium version and its additional addons.