WebToffee Logo
  • Home
  • Plugins
  • Shopify apps
  • Bundles
  • Blog
  • Documentation
  • Support
Login
cart 0

Decorator – WooCommerce Email Customizer Plugin – Setup Guide

Last updated on April 27, 2023

This is a complete documentation for the Decorator – WooCommerce email customizer plugin, which helps you customize WooCommerce order emails to fit your business requirements.

Overview of the plugin

Decorator – WooCommerce Email Customizer Plugin (User Guide)

The plugin allows customizing WooCommerce transactional emails in a number of different ways.

  • Customize the email container/header/footer/content of the WooCommerce emails.
  • Ability to edit email text/content.
  • Customize all WooCommerce email types.
  • Heading specific customizations.
  • Option to add custom styles to emails using CSS.
  • Real-time preview of changes.
  • Provision to add images in the email.
  • Link social media icons or title in the emails.
  • Option to schedule changes to go live.
  • Option to send test email to view changes.

Installation of the plugin

Install the plugin either from the WordPress plugin directory or as a zip downloaded from the WordPress.org website. You can learn more about the installation procedure by reading the article How to Install a Free Plugin from WordPress.

Getting started with the plugin

You can get to the plugin in any one of the following ways:

  • Go to WooCommerce > Decorator from your WordPress dashboard.
Decorator - Menu location
Decorator – Menu location

Some other ways to get to the plugin are:

  • From the plugin installer page, click on Customize email beneath the plugin name.
  • From WooCommerce > Settings > Emails, towards the end of the page, you will see a button ‘Open Decorator’ under the subtitle ‘Decorator’. Click the button Open Decorator to open the customizer.

Customization of WooCommerce Emails

This plugin allows customizing each element of the WooCommerce mail. You can customize the header, content, and footer sections of your emails as per your requirements.

Decorator - Email Customization
Decorator – Email Customization

The left side of the page contains each section of emails that you could customize. The right side of the window displays a live preview of the email template as you make changes on the left.

Select email type

The plugins give provision to customize and edit all the default WooCommerce emails based on each order status. You can easily choose an email type and customize it on the go.

Decorator - Select email type
Decorator – Select email type

Email text customization

Email content such as subject, heading, subtitle, and body text can be edited or modified based on preference. You can use sliders and color pickers for designing email backgrounds, containers, headers, footers, texts, and everything. Also, add shortcodes/placeholders within the email templates to change the content and appearance. There are also options to add images (company logo), social media links, and many more in the email templates.

Email text customization
Decorator – Email text customization

The plugin allows controlling the following email elements:

  • Subject text
  • Heading text
  • Subtitle text
  • Body text
  • Additional content
  • Shortcodes

Container customization

You can control the padding, container width, border-radius, shadow etc from this option.

Decorator - Container customization
Decorator – Container customization
  • Background color – Allows for choosing a background color for the outer email body.
  • Padding – Set padding to display the email.
  • Container width – Set width of the email container.
  • Border radius – Fix border radius for the container.
  • Shadow – Give a shadow effect to the email container.
  • Border color: Choose a border color for the email container.
  • Container border width: Adjust the width of the border.

Header Customization

The header section has been further divided into three subsections.

Header Style

  • Background color – Select a background color.
  • Text align – Choose the alignment (right, left, center, justify) for header text from the drop-down.
  • Padding top/bottom – Adjust the top/bottom padding for header text.
  • Padding left/right – Adjust the right/left padding for header text.

Header Image

Decorator - Header Style
Decorator – Header Style

Header image – Upload an image to be displayed on the header.

  • Alignment: Position the image to left, right, center or justified.
  • Max width: Adjust the width of the image.
  • Background color: Set a color for the image background.
  • Padding top/bottom: Move the image padding to top and bottom.
  • Add link to the website on header image: Redirect to your website on click

Heading and subtitle

You can customize the heading and subtitle of the header.

Decorator - Heading and subtitle
Decorator – Heading and subtitle

Footer Customization

From this section, you can customize both the footer style and footer content for WooCommerce emails. Also, you can add social media links at the footer.

Footer style

Decorator - Footer style
Decorator – Footer style
  • Padding – Adjust padding for footer text.
  • Text align – Choose a suitable alignment for footer text from the given options.
  • Font size – Select a suitable font size.
  • Font family – Choose a font type of your choice.
  • Font weight – Adjust the boldness of the footer text.
  • Text color – Choose a suitable color for the footer text.

Footer content

Decorator - Footer content
Decorator – Footer content

Here, you can add the desired footer content for WooCommerce emails.

Social media links

You can insert the social media links like Facebook, Twitter, Instagram, Youtube, LinkedIn, Vimeo into your email templates by using icons, URLs, titles etc.

Decorator - Social media links
Decorator – Social media links

Content Customization

This section allows to customize the content container of the email body.

Content Container

Decorator - Content Container
Decorator – Content Container
  • Background color – Select a background color for the email body.
  • Padding – Adjust it’s padding.

Text Style

Decorator - Text Style
Decorator – Text Style
  • Font size – Allows to adjust the font size for the email body content.
  • Font family – Select a font type for the body text.
  • Text color – Choose your preferred color for the text.
  • Link color – Select a link color of your choice.

Order Items

This section allows you to customize the table for order items.

Decorator - Order Items
Decorator – Order Items
  • Background – Allows adding a background color of your choice.
  • Padding – Adjust padding for the order table.
  • Border width – Adjust the border width for the table.
  • Border color – Select a border color of choice.
  • Totals separator width – Adjust the width of the total separator line.
  • Totals separator color – Select a specific color for the total separator line.

Order addresses

Adjust the appearance and style of the address detail in the email.

Decorator - Order addresses
Decorator – Order addresses

Button styles

Customize the appearance of buttons within the email body.

Note: You will have to turn the toggle on from the email text section to control the button styles.

Decorator - Button styles
Decorator – Button styles

Other Customizations

This section allows to individually customize heading 1 to 6 and also add custom styles using CSS.

Custom styles

You can add the CSS to the box for adding custom styling to the email. To learn more about custom styling using CSS, refer to this article.

For example, to center align order table contents in the email using CSS, enter the following CSS in the Custom CSS field:  #body_content_inner table.td tbody tr td { text-align: center !important; } as shown below:

Decorator - Custom styles
Decorator – Custom styles

Send test email

Use this feature to see how the changes would look live on your website before publishing them. Plus, you can share the preview with people who can’t access the customizer and get their feedback on it.

Note: Customization changes should be saved prior to sending the test email.

Decorator - Send test email
Decorator – Send test email

Publish or schedule the customizations

Click on the Publish button to reflect the changes made to your emails.

Other than publishing the changes right away, you have the option to either save them as a draft or schedule a date for the configured changes to go live on WooCommerce emails. You can also apply the changes to all email types by selecting the checkbox.

Decorator - Additional options
Decorator – Additional options

Schedule date and time for email Customizations to go live

By clicking on the Schedule, you will be able to schedule a date and time for the customizations to go live on your WooCommerce emails.

You can choose a date and time of your choice.

Decorator - Additional options
Decorator – Additional options
  • Was this article helpful?
  • Yes, thanks!Not really

Tagged WooCommerce email customizer, WooCommerce emails, WooCommerce order emails

Written by

Shesna

Shesna is a technical content writer for WebToffee. She is familiar in working closely with the SMEs to break down complex technical information into a concise, easy to understand manner.

Comments (22)

  1. David

    May 29, 2023

    Hello,
    One question, is it possible to add a custom field checkbox (for example vat number), in the mail, where is the billing address?
    Thank you.

    Reply
    • Arjun

      May 30, 2023

      Hi David,

      Thank you for getting in touch with us. We understand your requirement. But our plugin does not currently include the features you have specified.

      Reply
  2. B Ng

    May 7, 2023

    Is it possible to customize the emails of the custom order’s status in WooCommerce?

    Reply
    • Arjun

      May 8, 2023

      Hi B Ng,

      Thank you for getting in touch with us. We understand your requirement. But presently, the plugin does not offer the functionality to customize the custom order status emails.

      Reply
  3. George

    April 10, 2023

    Hello there,

    I’m looking to change the text of two items but I can’t seem to find any option to do so. First one is Button Text on “Customer New Account” where the button shows as “View account”, and the second is I guess body text “Your password has been automatically generated….”. I edited the body text but from this line and below, nothing changes.

    Thanks in advance

    Reply
    • Arjun

      April 25, 2023

      Hi George,

      Thank you for getting in touch with us. We understand your requirement. But our plugin does not currently include the features you have specified.

      Reply
  4. Soterios Kyprianou

    December 15, 2022

    Hi. I use now a standard woocommerce order email. I installed a Decorator but how can i disable woocommerce order email and activate a Decorator to send order emails?

    Thank you
    Soterios

    Reply
    • Mike

      December 16, 2022

      Hi Soterios,

      The Decorator plugin will not create or send any order emails. The plugin is designed to customize the default WooCommerce status emails. By using the plugin, you can customize the order emails according to your need.

      Reply
  5. zeven

    December 13, 2022

    hope could add tiktok icon, and could bigger icon, anyway, it’s best email custom plugin for me~thx for your creation

    Reply
    • Mike

      January 3, 2023

      Hi Zeven,

      Thanks for reaching out. We understand your requirement. Presently the plugin doesn’t offer any option to add the TikTok icon. Considering your request, we will add it to the plugin in our upcoming release.

      Reply
  6. Terri

    October 12, 2022

    Hi there, love the plugin but I’m confused as to why certain changes do not save. For instance, the header visibility is set to not show and the changes are published but the header still shows up. If I go back into edit the header, the header is set to be visible again. No matter how many times I hit publish, it doesn’t seem to save the changes because I go to exit the plugin and it asks me if I’m sure that I want to navigate away before saving changes…but I’ve already saved them. Any idea on what might be causing this?

    Reply
    • Mike

      October 22, 2022

      Hi Terri,

      Can you please reach out to us via support to check the issue?

      Reply
  7. Paweł

    September 29, 2022

    How do I add a message template generated from another plugin? I have installed the WooConvo – New Message Received plugin and I would like to be able to add a message template to the decorator, is this possible?

    Reply
    • Mike

      September 29, 2022

      Hi Paweł,

      Our plugin currently doesn’t provide compatibility/template customization for WooConvo.

      Reply
  8. Freddie

    September 16, 2022

    I posted a comment here yesterday, but it isn’t here today. Therefore I am posting it again and also sent the same inquiry at your SUPPORT LINK.

    Yesterday I tried your DECORATOR plug-in for customizing WooCom emails. At first I was more than happy with the results as I ventured through the settings. That is until I tried to get the SHIPPING ADDRESS TO SHOW in the emails.
    Even though I have selected ‘billing address visibility (ON)” and “shipping address visibility (ON)” settings AND also have both the “billing address title” and “shipping address title” areas filled with my choice of text, ONLY THE BILLING ADDRESS SHOWS ON ALL EMAIL TYPES.
    The SHIPPING ADDRESS refuses to comply—NO SHIPPING ADDRESS and NOT EVEN THE SHIPPING ADDRESS TITLE on any email even though the CUSTOMER SUPPLIED A SHIPPING ADDRESS.
    And there is NO SHIPPING ADDRESS OR ITS TITLE visible on the Previews when working within the plugin interface area.
    Could you please provide a solution and/or instructions on how to correct this problem?
    Thank you ever so much for creating this mostly satisfying plugin. No use to us though if the emails don’t provide BOTH A BILLING AND SHIPPING ADDRESS, for both our use and the customers.

    Reply
    • Mike

      September 26, 2022

      Hi Freddie,

      We understand your concern. However, it is the default functionality of WooCommerce when the “Shipping Address” is the same as the “Billing Address” checkbox is enabled during the checkout. The shipping address will display without any issues if you have entered the shipping address separately during checkout.

      Reply
  9. Brian

    June 7, 2022

    Is there a way to apply the header customization to all email templates?

    Reply
    • Shesna

      June 7, 2022

      Hi Brian,

      Yes. Open the drop-down next to the publish button and check the option ‘Apply the changes to all email templates’. The changes you have made in the active template will be reflected in all templates.

      Reply
  10. Kim H.

    May 16, 2022

    Hello,

    Is there a way to hide the “pick-up time”? We are using a different way to book in the orders and now our customers see two different pick-up times which is very confusing.

    Thank you.

    Reply
    • Mark

      May 27, 2022

      Hi Kim,

      Are you sure that this issue is related to the Decorator plugin? Kindly try deactivating it and see if the issue persists.

      Reply
  11. Kitty

    April 8, 2022

    I wish to deactivate an remove the plugin, it is not working wel with my track ant trace mail settings. Problem is, it won’t deactivate. When I try to remove it by using my FTP the folowing error messege is displayed: The decorator-woocommerce-email-customizer/decorator.php plugin has been disabled due to an error: Plugin file does not exist.
    How is dit posible after removing the plugin.
    Can you fix this so the plugin can be removed in the correct way without any error messeges?

    Reply
    • Alan

      April 8, 2022

      Hi Kitty,

      We’re sorry to hear that you are facing issues with our plugin. Please submit a ticket here so that our technical team can get in touch with you.

      Reply

Got any query? Please leave a comment or reach out to our support

Cancel reply

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

Decorator - WooCommerce Email Customizer

Get free plugin

On this page

  • Overview of the plugin
  • Installation of the plugin
  • Getting started with the plugin
  • Customization of WooCommerce Emails
  • Select email type
  • Email text customization
  • Container customization
  • Header Customization
  • Footer Customization
  • Content Customization
  • Other Customizations
  • Send test email
  • Publish or schedule the customizations
  • Schedule date and time for email Customizations to go live

Get started with your WebToffee plugin!

Your plugin will be downloaded in a few seconds...

All you need to do is add the plugin to your WordPress website.

To install and activate the plugin, view our installation guide.

download now
Webtoffee
Facebook
Twitter
Youtube
Linkedin
WordPress

We develop awesome WordPress plugins & WooCommerce extensions to help build successful online businesses.

Trustpilot

© 2023 WebToffee. All rights reserved.

Our plugins

  • GDPR Cookie Consent
  • PDF Invoices & Packings Slips
  • Product Import Export Plugin
  • User & Customer Import Export
  • Import Export Suite
  • Sequential Order Numbers
  • Smart Coupons for WooCommerce
  • URL Coupons for WooCommerce
  • PayPal Express Checkout
  • Stripe Payment Gateway
  • Subscriptions for Woocommerce
  • Product Catalog Sync for Facebook
  • PrintNode for PDF Invoices
  • Order, coupon, subscriptions for WooCommerce
  • WordPress Backup and Migration
View more +

Get Started

  • Plugins
  • Testimonials
  • Customer Stories
  • Affiliates
  • We're hiring

Help & Support

  • Installation Guides
  • Documentation
  • Documentation (Basic)
  • FAQ
  • Support

Company

  • About Us
  • Terms & Conditions
  • Privacy Policy
  • Cookie Policy
  • Refund Policy
  • Support Policy

© 2023 WebToffee. All rights reserved.

We use cookies on our website to give you the most relevant experience by remembering your preferences and repeat visits. By clicking “Accept”, you consent to the use of ALL the cookies. However you may visit Cookie Settings to provide a controlled consent.
Cookie settingsReject allAccept all
Privacy & Cookies Policy

Privacy Overview

This website uses cookies to improve your experience while you navigate through the website. Out of these cookies, the cookies that are categorized as necessary are stored on your browser as they are essential for the working of the basic functionalities of the website. We also use third-party cookies that help us analyze and understand how you use this website, to store user preferences and provide you with content and advertisements that are relevant. Such cookies will be stored on your browser but only upon procuring consent.

You will also have the option to opt-out of these cookies should you want to. But opting out of some of these cookies may have an effect on your browsing experience as per the descriptions elucidated against the respective categories below.

Necessary
Always Enabled
The cookies defined under this category are absolutely essential for the website to function. Hence they are loaded by default irrespective if user consent.
CookieDescription
__cfruidCloudflare sets this cookie to identify trusted web traffic.
__stripe_midStripe sets this cookie cookie to process payments.
__stripe_sidStripe sets this cookie cookie to process payments.
cookielawinfo-checkbox-advertisementSet by the GDPR Cookie Consent plugin, this cookie is used to record the user consent for the cookies in the "Advertisement" category .
cookielawinfo-checkbox-analyticsSet by the GDPR Cookie Consent plugin, this cookie is used to record the user consent for the cookies in the "Analytics" category .
cookielawinfo-checkbox-necessarySet by the GDPR Cookie Consent plugin, this cookie is used to record the user consent for the cookies in the "Necessary" category .
cookielawinfo-checkbox-preferencesThis cookie is set by the GDPR Cookie Consent plugin to check if the user has given consent to use cookies under the "Preferences" category.
CookieLawInfoConsentRecords the default button state of the corresponding category & the status of CCPA. It works only in coordination with the primary cookie.
PHPSESSIDThis cookie is native to PHP applications. The cookie is used to store and identify a users' unique session ID for the purpose of managing user sessions on the website. The cookie is a session cookie and is deleted when all the browser windows are closed.
viewed_cookie_policyThe cookie is set by the GDPR Cookie Consent plugin and is used to store whether or not a user has consented to the use of cookies. It does not store any personal data.
Analytics
Analytics cookies help us understand how our visitors interact with the website. It helps us understand the number of visitors, where the visitors are coming from, and the pages they navigate. The cookies collect this data and are reported anonymously.
CookieDescription
_gaThis cookie is installed by Google Analytics. The cookie is used to calculate visitor, session, campaign data and keep track of site usage for the site's analytics report. The cookies store information anonymously and assigns a randomly generated number to identify unique visitors.
_ga_BQH8MSKD4MThis cookie is installed by Google Analytics.
_gat_gtagIdentification code of website for tracking visits.
_gidThis cookie is installed by Google Analytics. The cookie is used to store information on how visitors use a website and helps in creating an analytics report of how the website is doing. The data collected including the number visitors, the source where they have come from, and the pages visited in an anonymous form.
_hjAbsoluteSessionInProgressHotjar sets this cookie to detect the first pageview session of a user. This is a True/False flag set by the cookie.
_hjFirstSeenHotjar sets this cookie to identify a new user’s first session. It stores a true/false value, indicating whether it was the first time Hotjar saw this user.
_hjidHotjar cookie. This cookie is set when the customer first lands on a page with the Hotjar script. It is used to persist the random user ID, unique to that site on the browser. This ensures that behavior in subsequent visits to the same site will be attributed to the same user ID.
_hjIncludedInPageviewSampleHotjar sets this cookie to know whether a user is included in the data sampling defined by the site's pageview limit.
_hjIncludedInSampleThis cookie is set to let Hotjar know whether that visitor is included in the sample which is used to generate heatmaps, funnels, recordings, etc.
_hjIncludedInSessionSampleHotjar sets this cookie to know whether a user is included in the data sampling defined by the site's daily session limit.
_hjTLDTestTo determine the most generic cookie path that has to be used instead of the page hostname, Hotjar sets the _hjTLDTest cookie to store different URL substring alternatives until it fails.
CONSENTYouTube sets this cookie via embedded youtube-videos and registers anonymous statistical data.
has_recent_activityThis cookie is used to signal to the code repository website if the user has browsed other website resources during the current session.
tk_aiGathers information for our own first-party analytics tool about how our services are used. A collection of internal metrics for user activity and is used to improve user experience.
tk_lrThis cookie is set by the JetPack plugin on sites using WooCommerce. This is a referral cookie used for analyzing referrer behavior for Jetpack.
tk_orThis cookie is set by the JetPack plugin on sites using WooCommerce. This is a referral cookie used for analyzing referrer behavior for Jetpack.
tk_qsGathers information for our own first-party analytics tool about how our services are used. A collection of internal metrics for user activity and is used to improve user experience.
tk_r3dThe cookie is installed by JetPack. Used for the internal metrics for user activities to improve user experience.
Advertisement
Advertisement cookies help us provide our visitors with relevant ads and marketing campaigns.
CookieDescription
_fbpThis cookie is set by Facebook to deliver advertisements when they are on Facebook or on a digital platform powered by Facebook advertising after visiting this website.
frThe cookie is set by Facebook to show relevant advertisements to the users and measure and improve the advertisements. The cookie also tracks the behavior of the user across the web on sites that have Facebook Pixel or Facebook social plugin.
VISITOR_INFO1_LIVEA cookie set by YouTube to measure bandwidth that determines whether the user gets the new or old player interface.
YSCYSC cookie is set by Youtube and is used to track the views of embedded videos on Youtube pages.
yt-remote-connected-devicesYouTube sets this cookie to store the video preferences of the user using embedded YouTube video.
yt-remote-device-idYouTube sets this cookie to store the video preferences of the user using embedded YouTube video.
Preferences
Preference cookies are used to store user preferences to provide them with content that is customized accordingly. This includes the language of the website or the location of the visitor.
CookieDescription
_gh_sessThis cookie is used to preserve users' states across page requests.
Others
Other uncategorized cookies are those that are being analyzed and have not been classified into a category as yet.
CookieDurationDescription
_hjSession_137657130 minutesNo description
_hjSessionUser_13765711 yearNo description
_octo1 yearNo description available.
_zendesk_authenticatedpastNo description
_zendesk_sessionsessionNo description available.
_zendesk_shared_sessionsessionNo description available.
edd_wp_session12 hoursNo description available.
logged_in1 yearNo description available.
m2 yearsNo description available.