If you are comfortable with HTML and CSS, you can create your email in an editor, display it using your browser, and then copy and paste that content from the browser display directly into your email. If you are not very comfortable with HTML, you can use the following steps.
Step 1: Create an email and place your cursor in the message body.
Step 2: Open the context menu (most often done by right clicking on the message body) and select Inspect. This will open the html editor in your browser.
Step 3: Locate the div that has aria-label=”Message Body” in it. Typically, if you opened the context menu from the message body, the correct div will be highlighted. If it is not, you can open Inspect again without closing the html editor and it will move the focus to the correct div.
Step 4: Open the context menu for the div (right click on the div) and select Edit as HTML. You should see the div expand and below it you will see some content. In this image, the content is a style tag.
Replace all the content below the div with html that displays what you want. You can modify the following text:
< table width=”100%” height=”100%” role=”presentation”>
<td width=”100%” height=”100%” bgcolor=”#17444E” padding=”3px”>
<td>Image Goes here </td>
<td>Content Goes here </td>
Step 5: Close the html editor in your browser. Your email should look something like this. The text may be black but you can change it to white using the Text Color button at the bottom of the email.
Step 6: Highlight the text “Image Goes Here” and replace it with the desired image using the Insert Photo button.
Step 7: Highlight the Content Goes Here and replace it with the desired content. Use the size, text color, align and other buttons to create the look you want.