3

I am working on windows application for email sending. For text formatting i used tinymce editor for email body.

Used tinymce insert image functionality for adding image in email body but when email is sent to user. Images does not appear in user email body.

Then i tried to add base64 image manually as below:

<img src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAOYAAABLCAYAAABk6PuLAAAACXBIWXMAASdHAAEnRwEEDs /'>

Which is failed to load images.

Can we use linked resources and alternate view in tiny mce?

How to load images in email body?

Michael Fromin
  • 13,131
  • 2
  • 20
  • 31
Shridhar Salunkhe
  • 162
  • 1
  • 1
  • 21
  • Looking at that data, the png file is _obviously_ cut off. The decoded Base64 data is only 53 bytes long, and doesn't contain an `IEND` ending chunk. It doesn't display because your data is corrupted. – Nyerguds Mar 25 '18 at 10:26

4 Answers4

5

Tiny MCE is just an HTML editor and not a tool which can be used for creating alternate views for email.

Moreover, all email clients don't support inline images (with data URL).

Alternate view is the only way to ensure that all email clients will be able to show your content in the intended manner.

Create a dictionary of linked resources:

Dictionary<string, byte[]> linkedResources = new Dictionary<string, byte[]>();
linkedResources.Add("img1", byte[]);

Create a common method to send email:

public bool SendEmail(Dictionary<string, byte[]> linkedResources)
{
 using (SmtpClient mailSender = new SmtpClient("SmtpHost", 22))
 {
    MailMessage emailMessage = new MailMessage()
    {
        Subject = "Subject",
        SubjectEncoding = Encoding.ASCII,
        IsBodyHtml = true,
        Body = "Message",
        BodyEncoding = Encoding.ASCII,
        From = new MailAddress("Sender@domain.com")
    };

    emailMessage.BodyEncoding = Encoding.ASCII;
    emailMessage.IsBodyHtml = true;
    AlternateView av = AlternateView.CreateAlternateViewFromString(emailMessage.Body, null, MediaTypeNames.Text.Html);

    foreach (var item in linkedResources)
    {
        MemoryStream streamBitmap = new MemoryStream(item.Value);
        var linkedResource = new LinkedResource(streamBitmap, MediaTypeNames.Image.Jpeg);
        linkedResource.ContentId = item.Key;
        av.LinkedResources.Add(linkedResource);
    }
    emailMessage.AlternateViews.Add(av);
    mailSender.Send(emailMessage);

    return true;
 }
}
Sunil
  • 3,404
  • 10
  • 23
  • 31
  • I tried alternative view. I want add images while editing in HTML editor tools. is there any way like creating custom button in tinymce for adding alternate view for where i want to add images in body content? – Shridhar Salunkhe Mar 19 '18 at 06:25
  • TinyMCE doesn't support custom buttons. What you can do is, once the HTML is created by the user. Parse it and extract images (data URL) using your C# code, convert them to `byte[]` and store them in the dictionary. Then use the above method to send the mail. – Sunil Mar 19 '18 at 06:34
4

The real question you need to answer is "what is the best way to insert an image in an email". This is a very broad topic that has been answered many times - a little research should lead you to the most common approaches and their pros/cons:

https://sendgrid.com/blog/embedding-images-emails-facts/ https://www.campaignmonitor.com/blog/how-to/2008/08/embedding-images-in-email/ https://www.quora.com/Whats-the-best-practices-for-embedding-images-into-HTML-emails

Michael Fromin
  • 13,131
  • 2
  • 20
  • 31
0

there is no best solution for that, you can embed the images or attach them as files or just send them as links.

it depends on your requirements. it actually making image tags and link them to my server to get more analytics like the user had opened the email by loading the image throw a handler and the handler receive logs when the user opened the email and I can know how many users opened that email and so on.

Send grid is great for sending emails and getting analytics out of them because it tracks almost everything related to your email, and you should use Send grid to avoid Spam filters

Binary
  • 112
  • 4
0

In my experience the only way to solve this is to store that image on the server where it's publicly accessible and then point the img tag src attribute to that url. You have to understand that the HTML that's used in email is severely restricted to regular HTML.

Toni Kostelac
  • 351
  • 3
  • 17