22960

how to make images in html mail presented in outlook client?

Question:

I've this html which i'm sending as a mail (see fiddle) in which i use 2 external images (one for the company logo and one for the table background) : :

<a href="http://jsfiddle.net/UTSnK/" rel="nofollow">http://jsfiddle.net/UTSnK/</a>

<img src="http://www.hawkaviation.com/assets/static-header.jpg" alt="Hawk Aviation""/></a> <table border="0" cellspacing="0" cellpadding="0" style="background:rgba(55, 20, 240, 0.99) url('http://www.hisplaceautorepair.com/images/auto/Primary_Images/napa_bg.jpg'); padding: 38px">

I send it from code to many email clients : gmail, yahoo, ios. Only in outlook client the pictures are not presented: <img alt="enter image description here" class="b-lazy" data-src="https://i.stack.imgur.com/UwGA6.jpg" data-original="https://i.stack.imgur.com/UwGA6.jpg" src="https://etrip.eimg.top/images/2019/05/07/timg.gif" />

How can I overcome it? Is this related to the way I'm sending it (via c# code) or the way the images are linked to the html?

I'd appreciate a step by step answer. Regards, Omer.

Answer1:

This is how I got this working in Outlook

private MailMessage report = new MailMessage(); ... if (this.report.IsBodyHtml) { AlternateView htmlView = AlternateView.CreateAlternateViewFromString(this.bodyText.ToString(), this.report.BodyEncoding, "text/html"); LinkedResource headerImageLink = new LinkedResource(ConfigReader.GetConfigValue("ImageLocation") + "\\MyBanner.gif", "image/gif"); headerImageLink.ContentId = "headerImageId"; headerImageLink.TransferEncoding = System.Net.Mime.TransferEncoding.Base64; LinkedResource footerImageLink = new LinkedResource(ConfigReader.GetConfigValue("ImageLocation") + "\\horizontal_c.gif", "image/gif"); footerImageLink.ContentId = "footerImageId"; footerImageLink.TransferEncoding = System.Net.Mime.TransferEncoding.Base64; htmlView.LinkedResources.Add(headerImageLink); htmlView.LinkedResources.Add(footerImageLink); this.report.AlternateViews.Add(htmlView); }

The HTML to reference the above image is:

<IMG src=\"cid:headerImageId\"/>

the <strong>headerImageId</strong> refers to the ContentId of the LinkedResource.

Basically you're converting the image to text for transfer which gets re-constituted as an image on arrival at the client.

Answer2:

You are having this problem because outlook isn't rendering the external images without the user clicking download on the images or they don't have option to automatically download external images selected.

The way you fix this is that you have to embed the images into the email message.

To embed an image you have to use and AlternatView object and a LinkedResource object.

You can find example code on how to do this at: <a href="https://stackoverflow.com/questions/7048758/how-to-embed-multiple-images-in-email-body-using-net" rel="nofollow">How to embed multiple images in email body using .NET</a>

Recommend

  • ValidateUserName is undefined
  • XPath expression to add to code that already finds cities, that might also retrieve nearby zip codes
  • JQuery not applying on JSF Dynamic UI Component
  • get selected value from selectOnemenu using javascript in primefaces and open a dialog box
  • Linking Jquery mobile pages. One with user input and another with results
  • Export DataTable to Excel asp
  • HTML rendering in Outlook 2010 and Gmail
  • Matching specific table within HTML, BeautifulSoup
  • Using jquery ajax json format, How do you output a query from a .cfm page to the calling html page?
  • width of column in rich:datatable
  • displaying space padded records in asp.net gridview
  • Can't send file with ajax to php file
  • How to vertically and horizontally center a div of unknown height
  • css calendar - td background diagonal split - two colors
  • Selectively hide background elements when overlayed with transparent div
  • is it possible to insert a line break in this tooltip?
  • Cut the background to expose the layer below
  • How Lists (specifically, RecyclerView with CardViews) in Android work
  • How do I access an unhandled exception in an MVC Error view?
  • Custom validator control occupying space even though display set to dynamic
  • Email verification using google app script and google forms
  • How do I alternate colors in Flat List (React Native)
  • Listbox within Listbox and scrolling trouble in Windows Phone 7 Silverlight
  • Change multiple background-images with jQuery
  • Email format validation in mvc3 view
  • Insert into database using onclick function
  • Encrypt data by using a public key in c# and decrypt data by using a private key in php
  • C# - Is there a limit to the size of an httpWebRequest stream?
  • Why doesn't :active or :focus work on text links in webkit? (safari & chrome)
  • Updating server-side rendering client-side
  • sending/ receiving email in Java
  • Change an a tag attribute in JavaScript based on screen width
  • jquery mobile loadPage not working
  • How to pass list parameters for each object using Spring MVC?
  • Unanticipated behavior
  • Acquiring multiple attributes from .xml file in c#
  • How to CLICK on IE download dialog box i.e.(Open, Save, Save As…)
  • How can I remove ASP.NET Designer.cs files?
  • sending mail using smtp is too slow
  • java string with new operator and a literal