Sending out emails to customers is an important step in the eCommerce process. You need to make sure everything is working and showing as expected.

WooCommerce doesn’t have a way of previewing order emails other then actually sending one out. Not the easiest way, nor does it allow you to view a email of a specific customer/order.

In this post I’ll show how you can add a preview option with a code snippet within your store’s orders so you can instantly view how a email would look like when send out (or has looked like when already sent).

Preview Order Email Actions

The first thing I’d like to do is add a nice way to add this in the User Interface of WooCommerce orders. The most intuitive location to add this for me would be in the ‘Order actions’ list, where you can also send the emails to customers. 

The following snippet adds all order related emails to the dropdown as a option to preview. 

This is how it should look like approximately, if you have additional plugins installed that add more emails it could show them accordingly there too.

Order action list with 'Preview {type} email' options

Previewing the Order Email

The next snippet is required to actually display the order email preview when you’ve selected one of the preview actions in the Order actions section.

With that in place and when performing one of the preview order email actions it’ll show the email preview accordingly right in your browser;

Order email preview in the browser

About the author: Jeroen Sormani is actively building WordPress, WooCommerce and Easy Digital Downloads plugins. Slightly obsessed by writing high quality code.
Follow Jeroen on Twitter

3 comments

Leave a Reply

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