Branding your WooCommerce email template

woocommerce email template

WooCommerce email template

With the base install of WooCommerce, the available features to customise the WordPress email template is very basic.  The options available are Header ImageFooter Text and Text and Background colour options. There is no real way of changing the template without getting into some coding.  Lucky, as always with WordPress there is a plugin to the address this issue. Let’s run through how we can customise the email template of your WordPress emails so you can add you branding and colour scheme.

Installing the Email Templates plugin

To start with install the Email Templates plugin, by navigating to Plugins > Add New and search for Email Templates in the plugin search field on the right hand side. The first plugin that should appear in the results list is Email Templates by Damian Logghe.  Not only is this plugin highly rated with an average 5 star rating, but with 4000+ active installs, we know that this is a reputable plugin to add to our WordPress install. Click the the install button and then activate button.

WordPress Email Template

Once installed, the plugin will add a new menu item to Appearance > Email Templates, and this is where all the magic happens. What is really cool about this plugin is that it uses the WordPress Customiser interface for customising your WordPress email templates.  This offers many benefits, however to me the main benefit is the ability to play around with the settings and options and seeing the changes being made in real time without the need to commit to them.

The Email Template options

Navigating to Appearance > Email Templates, we can run through the options available with this plugin. When Customiser screen is loaded, you will notice that there are 5 different setting panels on the left hand side, which are – Settings, Template, Email Header, Email Body and Footer.  The last panel is Send test email, which allows you to send a test email to yourself to view how your newly designed email template will look in your email reader.

WooCommerce Email Template Customiser

Starting from the top let’s down our way down the options to configure our template.

Settings

This panel allows you to configure the From name and From email, it is recommended to use the default settings which uses the site title for the From Name and the site email for the From email.

Template

This panel allows you to configure the HTML structure of the email template, including whether the content will be contained in boxed area, or will it be full width, the email body width (in pixels) and the background colour of the template. The recommended settings would be Boxed for structure and 680px for email width, the background can be any colour that is neutral and non distracting.

Email Header

This email header panel allows you to configure the header section of the email template, here you can choose to upload your business logo or a header image, add custom text, for example business name, select logo/text alignment, background colour, Text Size and colour. Don’t be afraid to have a play around, remember nothing is committed until you Save & Publish.

Email Body

Under the email body panel you will be alter the body background colour, text size and colour. As the the body area contain the most text, it is recommended that there is a viewable difference between the background colour and text colour for easy reading by your customers.

Footer

This email header panel allows you to configure the footer section of the email template.  Here you can enter custom footer text, including html for links to your website or your social media channels, select the text alignment, size and colour and the background colour.

And that’s it! What we really like about the Email Templates plugin, is that it offers enough options to customise your email templates, but not too many that you get over whelmed, so it is perfect no matter what yo user level is.

Reader Interactions

Leave a Reply

Your email address will not be published. Required fields are marked *