Gmail blocking small embedded inline images in email template

Question

I\'m sending emails to my members and it looks like Gmail is blocking the images I place in the email. These are embedded as a base 64 encoded string in an

Answer 1

Google refuses to show images with data url in Gmail's web interface. It's a known problem (in Google's view a security measure) for a long time highly criticized.

The good news is that you have another option except for using external images.

Using an inline attachment with a Content-ID works with Gmail.

After adding your images as inline attachments you'll need to point CID URLs instead of Data URLs in the html body.

There are plenty of modern libraries that will allow you to send emails with inline attachments easily. But I wrote a sample script in VBScript with CDO library, ready to use if you have a box Windows 2000+ installed.

Let's prepare the test environment.

Put the files in a directory as in the screenshot below.

tpl.html is the template file you gave. You'll need to make some changes in this file.

Replace both img elements with the following respectively. Note that data urls gone. image1 and image2 are the Content IDs specified for each inline attachments in the script. Nothing associated with file names here.

<img src="cid:image1" alt="SpaceImage" title="Space Image" style="display: block" width="225" height="126" />
<img src="cid:image2" alt="HostImage" title="Host Image" style="display: block" width="225" height="225" />

Embedded.vbs:

MsgBox "Wait while your email is being sent.", vbOKOnly Or vbInformation

'************ CONFIGURATION *************
Const smtpUsername = "..."
Const smtpPassword = "..."
Const smtpHost = "smtp.sendgrid.net"
Const smtpPort = 587
Const senderEmail = "...@..."
Const recipientEmail = "...@gmail.com"
'************ CONFIGURATION *************

Const cdoRefTypeId = 0

Set Fso = CreateObject("Scripting.FileSystemObject")

Set objMail = CreateObject("CDO.Message")
With objMail.Configuration
    .Fields("http://schemas.microsoft.com/cdo/configuration/smtpauthenticate") = 1
    .Fields("http://schemas.microsoft.com/cdo/configuration/sendusername") = smtpUsername
    .Fields("http://schemas.microsoft.com/cdo/configuration/sendpassword") = smtpPassword
    .Fields("http://schemas.microsoft.com/cdo/configuration/smtpserver") = smtpHost
    .Fields("http://schemas.microsoft.com/cdo/configuration/smtpserverport")  = smtpPort
    .Fields("http://schemas.microsoft.com/cdo/configuration/sendusing") = 2
    .Fields("http://schemas.microsoft.com/cdo/configuration/smtpconnectiontimeout") = 20 'secs
    .Fields.Update
End With

With objMail
    .AutoGenerateTextBody = False
    .From = senderEmail
    .To = recipientEmail
    .Subject = "Inline Image Test"
    .BodyPart.ContentTransferEncoding = "quoted-printable"
    .BodyPart.Charset = "utf-8"
    
    ' Adding images as inline attachments with Content IDs which is used with image sources. e.g. <img src="cid:image1" .. >
    .AddRelatedBodyPart Fso.GetAbsolutePathName("image1.jpg"), "image1", cdoRefTypeId
    .AddRelatedBodyPart Fso.GetAbsolutePathName("image2.jpg"), "image2", cdoRefTypeId
    
    'append html body from file
    .HTMLBody = Fso.OpenTextFile("tpl.html").ReadAll
    .Send
End With

MsgBox "Email successfully sent! Check your inbox.", vbOKOnly Or vbInformation

Double click and wait for instructions.

See also https://stackoverflow.com/search?q=is%3Aquestion+%5Bemail%5D+inline+image

Answer 2

tl;dr

Gmail and certain other clients don't like base64 encoded images.

Full Story

The very first thing I did was view "Show Original" in Gmail. To my surprise, raw content still has your embedded image data:

That tells me right away that gmail is simply choosing to filter this content out. I was not able to find the reason. Some guesses point out the length of encoded data itself. Others talk about the general way in which Gmail filters out images. There are even records of this technique functioning a number of years back.

In addition, when viewing the same exact email in a third party client such as Newton(formerly Cloud Magic), I do see images properly rendered.

All of that points to a simple, however sad, fact that gmail doesn't like inline encoded images. Not in the browser and not in their mobile apps.

In fact, at the very end I did discover a post from 2013 by Campaign Monitor blog that concludes with the same results.

Don't use inline embedded images.