Welcome to WebmasterWorld Guest from 54.197.171.28

Forum Moderators: incrediBILL

Message Too Old, No Replies

How to put graphic over link in email

email graphic

   
4:47 am on Aug 13, 2010 (gmt 0)



HTML Newbie working in C# to create and send a little from email with a link behind a graphic. I have poked around enough to create a simple HTML email with the required links and send it, from my program, between select email accounts. I am lost on putting a graphic over the link. All the info I have found is aimed more at creating websites and says to upload the jpg to a directory on the web host. What do I do for just an email?

Thanks in advance.
10:50 am on Aug 13, 2010 (gmt 0)

WebmasterWorld Senior Member kaled is a WebmasterWorld Top Contributor of All Time 10+ Year Member



If I understand you correctly, you are using C# to create the text source of a multi-part html email but are unsure how to embed an image to use as a link.

If that's correct, I suggest you create such an email using a client such as Outlook or Thunderbird and view the source code to see how it's done. The image itself will be encoded (Base64/uuencode I think) so you'll have to figure that part out.

Kaled.
10:51 am on Aug 13, 2010 (gmt 0)

WebmasterWorld Senior Member tangor is a WebmasterWorld Top Contributor of All Time 5+ Year Member Top Contributors Of The Month



It sometimes works, sometimes doesn't... HOWEVER, most major mail systems BLOCK images in email... And newer email programs (Thunderbird 2x and up, for example) BLOCK images by default.
10:56 am on Aug 13, 2010 (gmt 0)

WebmasterWorld Senior Member kaled is a WebmasterWorld Top Contributor of All Time 10+ Year Member



Normally, only external images are blocked. The reason for this is that the image url can include a recipient identifier so that it's possible to work out who has opened and read an email.

Some clients may also block embedded images since viruses have been spread in the past by exploiting faults in image rendering code, however I believe that most do not (but I could be wrong). It would certainly be wise to include "alt" text for the image in case the image is blocked.

Kaled.
1:10 pm on Aug 13, 2010 (gmt 0)



Wow thanks for all the responses.
Yes I am using C# to create the text source based on info on the recipient’s name and location. Then my C# program sends the email to the recipient and CCs the salesman for the recipient’s location.
We currently have the same image, more like a icon, and link in the Outlook signature of most of our company emails and it seems to be going through. I have been studying those emails to figure out how this works. In looking at that source code the lines are long but there are line breaks of some sort, do I need them in my Html text? The link works I just can’t get it to show the image not the alt.
Below is the entire body for my current tests:
message.Body = "<html><body><p>The image, with link, should show below.</p><br><br> <p class=MsoNormal><a href=\"http://www.#*$!.com/blog\"><span style='color:windowtext;text-decoration:none'><img border=0 width=198 height=115 id=\"Picture_x0020_1\" src=\"cid:image001.jpg@01CB2371.B4BFDAE0\" alt=\"Blog Graphic -1\"></span></a><o:p></o:p></p></body></html>";


What does the ‘@01CB2371.B4BFDAE0’ do?

Thanks again
5:59 pm on Aug 13, 2010 (gmt 0)

WebmasterWorld Senior Member kaled is a WebmasterWorld Top Contributor of All Time 10+ Year Member



src="cid:some_random_but_identifying_string"

If you scroll down you'll find

Content-ID: <some_random_but_identifying_string>

Kaled.
9:30 pm on Aug 13, 2010 (gmt 0)



I looked at the source code for an email with the graphic I am trying to duplicate and I could not find any other instance of some_random_but_identifying_string nor could I find the text ‘Content-ID:’.

Would it matter that is part of an Outlook signature? I notice that the name in the HTML source does not match what the original file name most likely was. Does Outlook somehow vett the graphic then store a vetted copy for attachment to emails?

Thanks again for the responses. I feel like I am so close but no cigar. Yet!
11:53 pm on Aug 13, 2010 (gmt 0)

WebmasterWorld Senior Member kaled is a WebmasterWorld Top Contributor of All Time 10+ Year Member



I've cut off the initial headers and most of the image but this is the source code of the quick test I tried ...

Content-Type: multipart/alternative;
boundary="------------090905090801080203090902"
X-Envelope-To: ## deleted by Kaled ##

This is a multi-part message in MIME format.
--------------090905090801080203090902
Content-Type: text/plain; charset=ISO-8859-1; format=flowed
Content-Transfer-Encoding: 7bit

_gggg_ <http:// ## deleted by Kaled ##>

--------------090905090801080203090902
Content-Type: multipart/related;
boundary="------------030702090509040404020303"


--------------030702090509040404020303
Content-Type: text/html; charset=ISO-8859-1
Content-Transfer-Encoding: 7bit

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
</head>
<body bgcolor="#ffffff" text="#000000">
<a href="http:// ## deleted by Kaled ## "><img
src="cid:part1.05040402.02070702@ntlworld.com" alt="" border="0"
height="32" width="128"><u>gggg</u></a>

</body>
</html>

--------------030702090509040404020303
Content-Type: image/png;
name="button_0.png"
Content-Transfer-Encoding: base64
Content-ID: <part1.05040402.02070702@ntlworld.com>
Content-Disposition: inline;
filename="button_0.png"

iVBORw0KGgoAAAANSUhEUgAAAIAAAAAgCAIAAABVQOdyAAAACXBIWXMAAABIAAAASABGyWs+
AAAFVElEQVR42u2a3W8bRRfGn3Nmdtf2xjbEahtoolBAVQtBiD+Dv5kLrstFxRXio22aVq3A
NNgO8cfuzpznvRiHJtVLaSwgqtifrNVqd3blOc/OmTlnjpAEABIi63MAgIhYVXE+B2mTCc0g
gnMNWl6DiNBMh0MpCsky3dp6xbbJ4ACE5HnrC0AgjsfxyRPGiKYBydWqNf3lSCYuCnEOInDO
7ez4vT3xfm3nMw0kfdp/XI2zWfjhB4jo9raORsgyJIVaNkMVTWPHx3E8Zl1nH3/sbt7EOQ2E

........ etc. ........

--------------030702090509040404020303--

--------------090905090801080203090902--



Hope this helps,

Kaled.
2:30 pm on Aug 14, 2010 (gmt 0)



Am I doing this the hard way?
If I am trying so hard to duplicate what Outlook is already doing should I just use Outlook with command line switches, OLE or some other ‘hook’ to send the emails?

The Outlook /c message class command line switch look promising I just need to figure out how to pass a message class object.

Thanks Again