WooCommerce Email Customizer

Email Customizer Plugin Settings

  1. General Settings
  2. Add/Edit Templates
  3. Plugin License

General Settings

Rows, Columns and Elements

Basic Elements:

  1. Text: Add a text anywhere using this element. In the element settings, the text box height, width, padding, etc. can be defined. Also set the properties for the text, background and border.
  • Placeholders:
  1. For email templates which need any dynamic data to be displayed in addition to that is available, these can be included in the text as dynamic placeholders. Following are the placeholders for specific email data: {th_customer_name} — Get customer name {th_billing_phone} — Phone number from billing address {th_order_id} — Order ID {th_order_url} — Order URL {th_billing_email} — Email from billing address {th_site_url} — Site URL {th_site_name} — Site name {th_order_completed_date} — Order Completed Date {th_order_created_date} — Order Created Date {th_checkout_payment_url} — Checkout payment URL in case of pending payment {th_payment_method} — Payment Method {th_customer_note} — Customer note {th_user_login} — Username {th_user_pass} — User password {th_account_area_url} — Account area URL {th_reset_password_url} — Reset password link for the Account Note: Some of these placeholders may not work if they are placed illogically in any template. For ex: The Order Completed Date will not be displayed if it is included in any email sent before completing the order.
  2. Image: Add an image to the email with this element. Always take care to input the width and height of the image correctly in the element settings.
  3. Social: Add social media to the emails. If any social media URL field is left blank in the element settings, it will be omitted from the icon list.
  4. Buttons: Add a link button to the WooCommerce emails. In the button settings, the user can add a URL, title, etc. for the button and apply various stylings for the button, button text, and border.
  5. Divider: With this element, add a dividing line anywhere in the email template. Suppose if it is needed to split the template into two different sections, a divider line can be used to do so.
  6. GIF: Add a GIF image to the emails. Always take care to input the width and height of the GIF correctly in the element settings.
  7. Gap: Provide a gap in the email template at any row using this element.
  1. Edit: Go to Edit to access the settings of the row/column/element.
  2. Clone: Choose this option to create a duplicate of the row/column/element just beneath.
  3. Delete: Choose this option to delete the added row/column/element.
  1. Applying unit percentage as height to the elements doesn’t work until it’s parent has a fixed height value. For example, the height of an element inside a table column in percentage works only if the height of the table column is a fixed value.
  2. In the padding settings of an element, the fields are arranged as top, right, bottom, and left respectively. These values should be inputted in px. Similarly, background image size should be inputted as two values (for width and height) separated by a space. If only one size is inputted, this will be considered for both width and height.

WooCommerce Elements:

  1. Header: This is the normal title for the email normally displayed on top of the email template. It can be rearranged to display anywhere as preferred.
  2. Customer: This element displays the customer details related to the order. There are options to customize the properties of text, details, background, and border of the customer details.
  3. Order: The Order element displays all details related to the purchase, as provided by WooCommerce. Other than the total background and title details, there are options to separately customize the table details, border and background.
  4. Billing: The billing details of the order are displayed by this element. There are options to customize the properties of text, details, background, and border of the billing details.
  5. Shipping: The shipping details of the order are displayed by this element. Customize the properties of text, details, background, and border of the shipping details from the element settings.
  6. Downloadable Product: The table for downloadable products can be included in the email with this feature.

WooCommerce Hooks:

These elements help to add existing WooCommerce hooks into the email template. Following are the hooks available in the Email Customizer:

  1. Email Header: With this hook, the default email header of the WooCommerce emails can be displayed.
  2. Email Order Details: This hook displays the default order details in a WooCommerce email.
  3. Before Order Table: Display the ‘Before Order’ table with this hook.
  4. After Order Table: Display the ‘After Order’ table with this hook.
  5. Order Meta: The default Order Meta details can be included in the template with this hook.
  6. Customer Details: This hook displays the default customer details in a WooCommerce email.
  7. Email Footer: With this hook, the default email footer of the WooCommerce emails can be displayed.

Preview, Clear and Save

Add/Edit Templates

--

--

--

ThemeHigh develops plugins to customize the product and checkout pages of a WooCommerce Online Store.https://www.themehigh.com/

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

Your Art is SPAM. Androidcentral.com $UCK$

Balanced Parentheses

Flutter Kisumu 2021 Events Highlights

Portainer — The easy way to manage Docker

The Fundamentals of Cloud Computing

How to manage a portfolio with Liu

how I have Build Android Application for clothing designers On Android Studio

Resources to Learn Front-end Basics

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
ThemeHigh

ThemeHigh

ThemeHigh develops plugins to customize the product and checkout pages of a WooCommerce Online Store.https://www.themehigh.com/

More from Medium

Samsung Galaxy S22 First Impressions

7 Tips for Enhancing Your Client Experience

Have Fun with Motivation

How to add domain to new Lightsail instance