In this post, I will show you how to make use of usemap attribute of img HTML element in HTML emails programmatically. For this, I used Outlook 2010 VBA & Outlook Object Model. You can design the application with C# or VB.Net with Outlook Object Model library as per your wish.

We will do this exercise in two steps:

First, we need to set the Bodyformat of the message as olFormatHTML
Second, at the Message body we need to include the usemap attribute with img HTML element.

Here is the code snippet that I tried:

   1: ...
   2: Dim str As String
   3: Dim newMSG As Outlook.MailItem
   4:  
   5: Set newMSG = Application.CreateItem(0)
   6: newMSG.To = Session.CreateRecipient("test@testexchange.com")
   7: newMSG.Subject = "Test message"
   8: newMSG.BodyFormat = olFormatHTML
   9: newMSG.Body = "start Body here.  "
  10: newMSG.Body = newMSG.Body & "  Add more text."
  11:  
  12: str = "<html> <body> <p>Click the logo:</p>"
  13: str = str & " <img src='http://www.microsoft.com/presspass/imagegallery/images/products/office/office2010/MS_Office_w_2010_vertical_web.jpg' width=200 height=200 alt='Sites' usemap='#sitesmap' />"
  14: str = str & " <map name='sitesmap'> <area shape='rect' coords='0,0,82,126' alt='Bing' href='http://www.bing.com'/>"
  15: str = str & " <area shape='circle' coords='0,90,58,3' href='www.microsoft.com' alt='Microsoft'/>"
  16: str = str & "</map> </body> </html>"
  17:  
  18: newMSG.HTMLBody = str
  19: newMSG.Save
  20: 'newMSG.Send
  21: newMSG.Display
  22: ...

Once you’re done, try run the above sample – you’ll see the below results whenever you move to cursor to the above co-ordinates.

clip_image001

clip_image002

Happy programming!!