View Product Page

Email settings

From the tab Settings > General options, you can add a default logo and enable the use of mini-icons for social media links.

Settings

Furthermore, you can select a different template for all of the following email types listed below:

  • New order
  • Cancelled order
  • Failed order
  • Order on-hold
  • Processing order
  • Completed order
  • Refunded order
  • Customer invoice / Order details
  • Customer note
  • Reset password
  • New account
  • WordPress emails

Email templates

Social network

Here you will find all social network sites included in the plugin. You can add a link to each one of them and the social network icon will be visible in the email template. You also have the possibility to upload a custom icon for every social network available. Customers will be redirected to the website you fill in by clicking on that icon.

Social network options

We recommend adding the link without “http://” (e.g., www.facebook.com).
The supported social network sites are:

  • Facebook
  • Twitter
  • LinkedIn
  • Instagram
  • Flickr
  • Pinterest
  • Youtube

Layout

When you set up a new email, you will have to assign a template to it. Either choose one of the included ones or create your own.

To create a new template, click on the menu entry Email Templates > Add new email template.

Add new email template

Now, you can configure the template as explained below.

Template style

You can choose the layout you want to assign to the template you are configuring. You can choose from “default”, “elegant”, “informal”, and “casual”.

Default

Default template

Informal

Informal template

Elegant

Elegant template

Casual

Casual template

Header

You can set up the logo you want to show in the header of your email. Upload your customized logo or click on “My default logo” to use the logo configured in YITH -> Email Templates -> Settings. With the position option, you can set the place where you want your logo to appear. You can also set its height in the specific option field.

Finally, you can enter the values for the header padding.

Email template header

Appearance

In the Appearance section, you can find the complete list of the options that let you change the colors of the WooCommerce-generated emails.

Appearance

  • Page Width: the width (in px) of the email box.
  • Page Border Radius: border radius (in px).
  • Base Color: default color of the layout.
  • Body Color: background color of the email body.
  • Background Color: background color of the main box of the email.
  • Text Color: text color of the email body.
  • Link Color: the color of links in the emails.
  • Header Color: text color of the email header.
  • Footer Text Color: text color of the email footer.

Typography

In the Typography section, you can set the font size of the email heading and the general font of the email body. You can also define the body line height.

Typography settings

Custom Links

To add a new entry, click on “Add Custom Link” and add the name of the link and the related URL. The created entry will show ahead of the email body.

Custom links

Order detail table

Order details table

The options included in this section refer to the product table that is added in some of the WooCommerce emails.
These are the available options.

  • Border Width: width of the border of the table (in pixels).
  • Border Color: color of the border of the table.
  • Background Color: background color of the table.
  • Price Title Background Color: background color of the price title.
  • Show product thumbnails: show/hide the products of the order related to the sent email.

Order details table - example

Social network sites

The social network sites you can add to the WooCommerce-generated emails have to be configured from the options panel of the plugin, as shown on this page.
On the contrary, in this section of the configuration panel of the template, you can change the following options:

Social Network

  • Social network buttons in the header: show/hide the social network buttons in the header of the email.
  • Social network buttons in the footer: show/hide the social network buttons in the footer of the email.
  • Social network buttons color: style to assign to the social network buttons (black/white).

Social network - example

Footer

Footer

You can set the logo and the text for the footer of your email.
With regards to the logo, you can decide to upload a custom image, use the default logo, or repeat the logo you have used in the “Header” section.

Footer example