Search
Close this search box.
Search

How to Fix Broken Image Links in Your Email From a Localhost?

Listen to this article

Setting up a local host is an integral part of being a web designer, as you have to frequently work on local installations for the development and tweaking of a website or plugin. The local host performs all the functions of a regular server and offers some significant advantages over remote server hosting.

However, one of the drawbacks of using a local server is that it does not let you send images in an email from the local server to a remote server. The embedded image links are broken and do not get displayed at the receiver’s end. This happens as the email service provider cannot resolve the path to the local server.

To overcome this problem, you can incorporate a simple function before you send the email, as follows:

Step 1: Before calling the ‘wp_mail’ function, add action (‘phpmailer_init’, ‘EmbedImageInMail’)

Step 2: This calls the function to embed all required images within the mail. The function name ‘EmbedImageInMail’ is customizable and can be altered as necessary.

Step 3: Remove the action (‘phpmailer_init’, ‘EmbedImageInMail’).

This step is important the open function may interfere with the working of some other plugin’s mail functionality, which is installed on the site.

Note that the function name has to be same in the add and remove action functions.

The complete code snippet for this is:

add_action(‘phpmailer_init’, ‘EmbedImageInMail’);

wp_mail($recipient, $subject, $content, $headers, $attachments);

remove_action(‘phpmailer_init’, ‘EmbedImageInMail’);

Code for the ‘EmbedImageInMail’ function:

function EmbedImageInMail()
{
    global $phpmailer;
    $body = $phpmailer->Body; //Email content send to mailer
    $uploadDir = wp_upload_dir(); //Wordpress upload directory
    $baseUploadUrl = $uploadDir['baseurl'];
    $baseUploadPath = $uploadDir['basedir'];
    // get all img tags
    preg_match_all('/<img.*?>/', $body, $matches);
    if (!isset($matches[0])) {
        return;
    }
    // foreach tag, create the cid and embed image
    $i = 1;
    foreach ($matches[0] as $img) {
    // make cid
    $id = 'img'.($i++);
    // replace image web path with local path
    preg_match('/src=\'(.*?)\'/', $img, $m);
    if (empty($m)) {
    preg_match('/src="(.*?)"/', $img, $m);
    }
    if (!isset($m[1])) {
    continue;
    }
    if (strpos($m[1], get_bloginfo('url')) === false) {
    continue;
    }
    // $m[1] holds the url of image
    $uploadPathSegment = str_ireplace($baseUploadUrl, '', $m[1]);
    $uploadPathSegment = rtrim($uploadPathSegment, '/');
    $completeImagePath = $baseUploadPath.$uploadPathSegment;
    // add
    $phpmailer->AddEmbeddedImage($completeImagePath, $id, 'attachment', 'base64');
    $body = str_replace($img, '<img class="prodImage" alt="Product Image" src="cid:'.$id.'" style="height:50px; width:50px;" />', $body);
    }
    $phpmailer->Body = $body;
}

This integrates the functionality of sending images from your local host server to any email address through any email service provider.

Akshay Jain

Akshay Jain

Leave a Reply

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

Get The Latest Updates

Subscribe to our Newsletter

A key to unlock the world of open-source. We promise not to spam your inbox.

Suggested Reads

WordPress Development

Custom WordPress Solutions, for You

LearnDash Development

Custom LearnDash Solutions, for You

WooCommerce Development

Custom WooCommerce Solutions, for You

WordPress Plugins

Scale your WordPress Business

WooCommerce Plugins

Scale your WooCommerce Business

LearnDash Plugins

Scale your LearnDash Business

Label

Title

Subtext

Label

Title

Subtext

Join our 55,000+ Subscribers

    The Wisdm Digest delivers all the latest news, and resources from the world of open-source businesses to your inbox.

    Suggested Reads