Branded Email Notifications

By default, WordPress has its own email template for sending notifications to both Admin and User roles. These templates are used for various notifications such as new user registration, password reset, comment moderation etc. The default emails are simple in design, consisting of plain text and basic formatting. They include necessary information and links relevant to the notification type. They looked so generic so we will change it.

Custom Snippet or Plugin?

We can modify WordPress default Email template in any way. Wheter it is via custom snippet or plugin. However to make our life easy and stress free, we will do it via plugin.

What plugin?

The best plugin that can achieve our goal for me is the Better Notifications for WP. it is a simple but powerful plugin for that allows you to customise the email notifications that WordPress sends using a WYSIWYG editor and shortcodes. All of the default WordPress email notifications are available to customise as well as lots of new ones.

Here’s the list of default WordPress email notification that i dont want to receive.

For Admin

• New User Registration – For Admin
• User Lost Password – For Admin
• Password Changed – For Admin
• User Email Changed – For Admin
• User Role Changed – For Admin
• User Logged In – For Admin
• WordPress Core Automatic Background Updates
• Privacy – Confirm Action: Export Data Request – For Admin
• Privacy – Confirm Action: Erase Data Request – For Admin

Other

• Privacy Data Erased – For User
• Privacy Data Export – For User
• Privacy – Confirm Action: Erase Data Request – For User
• Privacy – Confirm Action: Export Data Request – For User

Here’s the list of WordPress email notification that i want to modify or create custom email template.

Enabled User Notifications with custom template

• User Lost Password – For User
• Password Changed – For User
• User Email Changed Confirmation – For User
• User Email Changed Confirmation – For User
• New Comment on Post

Here is my example custom email template for my WordPress Notifications

New User Registration – For User

Note: Just change the img source url into your logo url and button color based in your website theme.

<div class="container" style="font-family: Arial, sans-serif;max-width: 600px;margin: 0 auto;padding: 20px;border: 1px solid #ddd">
  <div class="logo" style="text-align: center;margin-bottom: 20px">
    <img src="" alt="Your Logo" width="150" />
  </div>
  <div class="content" style="padding: 20px;background-color: #f9f9f9;border-radius: 8px">
    <h2 style="color: #333">Welcome to [global_site_title]!</h2>
    <p>Hi [user_login],</p>
    <p>Thank you for registering on our website. We're excited to have you!</p>
    <p>Here are your registration details:</p>
    <p><strong>Username:</strong> [user_login]</p>
    <p><strong>To set your password, click the button below:</strong></p>
    <p style="text-align: left;margin: 30px 0">
      <a href="[password_url]" style="padding: 15px 30px;font-size: 16px;color: #fff;background-color: #134561;text-decoration: none;border-radius: 5px">Set Password</a>
    </p>
    <p>Feel free to explore our site and make the most out of the resources and features available to you.</p>
    <p>If you have any questions or need assistance, don't hesitate to reach out to our support team.</p>
    <p>Welcome aboard!</p>
    <p>Best regards,<br />The [global_site_title] Team</p>
  </div>
  <div class="footer" style="text-align: center;margin-top: 20px;font-size: 12px;color: #777">
    © [global_site_title]. All rights reserved.
  </div>
</div>

Here’s how it looked now. So nice!