How to Embed HTML Into Email

By Brandy Alexander

Updated April 09, 2018

i Jupiterimages/Photos.com/Getty Images

You can insert HyperText Markup Language (HTML) inside your email messages so that it is not just attached to the email body, but instead becomes part of the message. Oftentimes, HTML may not show up as intended inside the message, or it will be displayed at the very bottom where recipients can miss it. By using your HTML text editor in conjunction with your email program, you can embed your HTML to create the display that you want.

Launch your HTML text editor and begin a new page.

Add a table by typing in the code to create a one column, one row table as follows:

<table> <tr> <td></td> </tr> </table>

Type the desired HTML in between the “<td></td>” table data tags so that it is displayed within the table and viewable inside an email message. For example, if you want to create a bold greeting type the content within the “<b></b>” tags as such:

<td><b>Hello, this is my embedded HTML</b></td>

Create a hyperlink by placing your cursor before the word(s) that you want to make a link out of and then enter an opening “anchor” tag with the destination Web address. Place a closing "</a>" element after the term(s) to complete the link that takes the recipient to to the intended site when clicked. For instance:

<td><a href=”http://www.destination.com”>Link</a></td>

Save your file and place it on your Web host in the same directory that you keep your other files in. Note the location of this document so you can embed it in the next step.

Start your email application and begin a new message. For most email programs, click the “Insert” option to choose the file and embed it into the message. If you are using Mac OS X Mail, launch your Safari browser, type in the location of your file and click the “Command” and “I” buttons at the same time to insert the HTML into your message.

Items you will need

  • HTML text editor

  • Web host

  • Email application

Tips

If you have an advanced HTML text editor, such as Dreamweaver or CoffeeCup, you can use the tools to automatically generate the code for your table. See your application's “Help” files if you need assistance locating these features.

×