How to send WordPress HTML Email

Send Wordpress HTML Email
Send WordPress HTML Email

In this Article you will learn to send WordPress HTML Email. In WordPress emails are sent to the users to keep the users informed. These Emails can be for the registration, comment, product purchase, deals etc. To send users the email you must know how to use the WordPress wp_mail() function of WordPress.

The wp_mail expects three parameters:

  1. The email recipient(s)
  2.  Subject
  3. Message

When using the wp_mail function the message sent to the user is simply plain text. The email might not look fancy but it is quite useful. But what if you want to send a more beautiful message including logo, header, footer instead of simply plain text.

The problem here is when you are creating an email with html tags and inline styling, you may expect your email to render the HTML. But instead of that it will show html tags as plain text. So how to solve this problem and tell wordpress to render the html styling in the email.

Method 1: WordPress HTML email using wp_mail_content_type filter

WordPress provides a filter wp_mail_content_type to set email content type to text/html. This filter will automatically render all the html tags and the inline styling in the email content.

To use this filter :

Navigate to Dashboard >> Appearance >> Themes → functions.php,

And paste the below code

add_filter( ‘wp_mail_content_type’, function( $content_type ) {

    return ‘text/html’;

} );

Now the email sent through the application are the html emails, it solves the problem of custom email but breaks the formatting of wordpress core emails like forget password, reset password etc.

WordPress uses the line break in its core emails but after using the wp_mail_content_type filter the line breaks will not appear in the email.

For example: You have added wp_mail_content_type filter to your functions.php file, then the core email sent to the admin/author will not show any line break.

Method 2: WordPress HTML email using wp_mail filter:

If you want that the core email formatting should not break, you have to use the wp_mail filter instead of the wp_mail_content_type filter.

wp_mail filter has the parameter $header and this will solve our problem.

You just need to use the $header parameter in your custom code, and it will send the custom HTML email. This parameter has to be sent explicitly in your code.

Your code for Custom email will look like:

<?php

$message = ‘<h1>Email Heading</h1><p>Email Content</p>’;

$headers = array(‘Content-Type: text/html; charset=UTF-8’);

$to = get_option(‘admin_email’);

$subject = “My Email Subject”;

$mail = wp_mail($to, $subject, $message, $headers);

?>

For the $header parameter you have to set the value to text/html, this will be for your custom HTML email.

Method 3: Using templates:

Assuming you have already created a template design and save it in the templates/email-templates.php file like this:

<!DOCTYPE html PUBLIC “…”>

<html xmlns=”https://www.w3.org/1999/xhtml”>

<head>

  <title><?php echo esc_html( $title ); ?></title>

  <style>…</style>

</head>

<body>

  <p><?php echo $html; ?></p>

  …

</body>

</html>

You can use the template for Custom email like this:

function send_email($test) {

$email = ‘user@domain.com’;

$title = “Here is the title’;

$html = ‘Here is the content’;

$content = include ‘./templates/templates.php’;

wp_mail($email, $title, $content); }

Extras:

Custom email using Plugins:
  1. Email Template
  2. WordPress Email Template designer

These are some of the plugins that can help you to create an outline of your template.

Share This Post...
Table of Contents

Add a Comment

Share This Post...

Country Code For Tel Field

By including the country code, it helps to standardize the formatting of telephone numbers, reducing errors in data entry.

Delivery Request Form