YeeMail – Email Customizer for WordPress

The Email Customizer plugin for WordPress allows you to customize the design and content of emails sent from your WordPress site. This includes core emails for password resets, new user registrations, comment notifications,…

Table of contents:

1. Plugin Installation

2. Getting Started

After you install and activate the plugin, you will see the YeeMail section on the admin bar.

Click on this, you will see a list of email templates that we build for you: You can choose any template to modify, or click the “New Template” button to make a whole new one.

  • Default template: This is the default template for all core emails WordPress below. 

For Default template: site owners can customize the layout and appearance of the emails like the header, footer, colors, and fonts,… but the actual email content itself is still sent natively from WordPress. The Content Email part is designed to preserve the actual email content and formatting coming from WordPress so that we can not make any changes while allowing site owners to style and brand the overall email template.

  • Core templates: includes common WordPress email types like password resets, new user notifications, password change notifications, and comment notifications….

In these templates, we have predefined content and formatting structure. So you can customize the specific look, add or remove text, images…you can do anything on them to make them lively and match your brand colors.

3. How To Customize Email Template?

3.1 Appearance

3.1.1 Background

Click on the Background button on the page editor to edit the overall background email:

3.1.2 Elements

To use these elements, you would typically drag and drop the desired element into the email template layout.

  • Text: Add text content to the template and customize the font color, font size, alignment, border width, insert/edit link, shortcodes, info icons, social icons, border style, border color, background color, text padding, and text margin…

  • HTML: By tapping into the full capabilities of HTML, the site owner can craft visually engaging, functionally robust email templates that elevate their brand’s messaging and user experience.

  • Image: Add an image to the email template by uploading it from the media library, on your computer or image ALT and adjust its size and alignment, border style, border color, background color, text padding, and text margin.

  • Video: add video, and adjust the padding.

  • Button: Add and customize the button: name, the URL of a button, size button, color text, alignment, background, and padding.

  • Divider: Add a single line divider to the template, and change the width and height, color, alignment, margin, and padding of the divider.

  • Menu: Add a menu bar and name the navigation bar that includes links to the most important sections of the site: Home, Shop, and Contact…adjust the padding, border, and border radius, and change the color border and background.

  • Spacer: Add a space between other elements or components and customize its height, background color, and padding.

  • Social: Add social icons to the email template, and enter your ULRs in the placeholder including Facebook, Twitter, Instagram, Linkedin, Whatsapp, Youtube, and Skype. Moreover, you can modify the width, padding, alignment, and background.

  • Content Email: This section is designed to preserve the actual email content and formatting coming from WordPress.

3.1.3 Column

The layout is divided into multiple columns, with different widths and configurations presented. This interface is likely part of a web design or layout tool that allows site owners to easily arrange content by dragging and dropping elements into different column configurations.

3.1.4 Templates

To use these templates, you typically drag and drop them into the email template layout.

  • Header: This template component is likely used to display the main title, logo, or branding elements at the top of the email.

  • Footer: The footer template is used to include information such as contact details, social media links, or any other content that should appear at the bottom of the email.

  • Title: This template allows the user to add a prominent title or heading within the email content.

  • Image Box: The image box template provides a designated area to insert and display a single, prominent image.

  • Image list: This template enables the user to include a collection or gallery of multiple images, potentially with captions or other contextual information.

  • Text list: The text list template is useful for presenting information in a structured, bulleted or numbered list format.

3.2 Shortcodes

It lists various dynamic placeholders that can be used to insert personalized information into the email templates.

or you can click here:

You can see an example:

4. How To Use

4.1 Preview Email Template

Click on the Preview button at the top of the page editor.

You can see how the email would look on both desktop and mobile views.

4.2 Send Test Email

Click on the Email button at the top of the page editor. Then enter your email address, and click the “Send email” button.

Open your email and see the result:

4.3 Import/ Export PDF Template

Choose the Import or Export button.

then drop down or choose a file from your computer or media library.

4.4 Choose a blank template or Customize an available template

Click on this button at the top page editor.

4.5 Reset the template

Click on this button at the top page editor.

4.6 Enable or Disable email template

Each template has a Title field and a Status column, where users can control whether the template is enabled or disabled.

When these templates are enabled, all emails are sent from the WordPress site as in these template formats. If not enabled, it will be sent in the default template format.

5. Email Customizer for Contact Form 7

It allows users to create and manage custom contact forms on their website. It provides a robust email notification system that can be further customized.

The goal would be to allow you to fully brand and personalize the email notifications according to your website’s requirements. This helps create a more polished and professional email communication that aligns with your brand and provides a better experience for the user.

You can further enhance the email by adding your company’s logo, a signature, or other branding elements to make it more visually appealing and recognizable.

5.1 Access the YeeMail Email Customizer

Log into your WordPress admin dashboard and navigate to the YeeMail section.

5.2 Create and Customize a New Template

Step 1: Click on New Template on the top page

Step 2: Choose the Contac form 7

On the page editor – Navigate to Settings – Select the form that you want to make an email template.

Save and you will see all the fields of the form at Shortcodes. It helps you create a template with essential information.

Step 3: Customize the email template

  • Subject Line: Update the email subject line to something more relevant, such as “New message from your website”.
  • Recipient Email: Ensure the recipient email address is set correctly to receive the messages from the contact form.
  • Sender Name and Email: Update the sender name and email to match your business branding.
  • Email Body: Customize the email body content to include a greeting, the user’s submitted information (name, email, message), and a closing message.
  • Email Design: Adjust the email design elements, such as font, colors, and layout, to match your brand’s visual identity.
  • ……

You can see our email template:

Step 4: Save and Have a preview

To see how the customized email will look. Make any necessary adjustments until you’re satisfied with the final result.

5.3 Integrate the Email Template with Contact Form 7

In your Contact Form 7, locate the “Email Template” tab and choose the email customized template from YeeMail.

You can see here you can choose 2 email templates for this form. 

If you choose 2 templates, you should go to the Mail tab to set who the recipients are. With this approach, you can have two distinct email templates – one for the recipient and one for the user – that work together to provide a comprehensive communication flow for your Contact Form 7 submissions.

5.4 Test the form

Save and go to fill out the form

Open the email to see what the customized email template looks like:

6. Email Customizer for WooCommerce

6.1 Access the Email Customizer

Navigate to WooCommerce Settings – Click on the Emails tab.

You’ll see a list of all WooCommerce emails (e.g., New Order, Completed Order, Processing Order, Reset Password,… etc.) that are classified by recipients to the site owners or administrators, and the others are going to be sent to the customers.

If you want to customize any email, click the Customize with YeeMail button.

Click on the Manage button next to the email you want to customize.

You can enable or disable this notification, change and add more recipients, or change the subject, email heading, or additional content… And if you go back click this arrow button.

6.2 Customize the Email Template

6.3 Test Your Emails