When you test an email, you may see that the content doesn't show up as you intended it to. This could be text, personalisation, images, or other media. This problem is separate from an email not being delivered or being delivered too many times.
While incorrect content could also occur in other types of outbound communications or portal pages, email clients are generally stricter regarding the configured HTML. This increases the risk that something which looks as intended in Agillic might not look the same when sending it to your recipient's mailbox.
In this article, you'll find information about:
How to Investigate Incorrect Content in Email
Since the HTML controls the email's content layout, you can usually locate the cause of the incorrect content in two places:
- The HTML of the specific email.
- The HTML of the email template.
If you see the incorrect content in multiple emails using the same email template, it's commonly caused by the HTML in the email template.
Below, you'll find a list of the most frequent reasons why an email can have incorrect content.
Unwanted Styling
When you create an email, you might start by writing the text in some other text editing software such as Microsoft Word. Having your text in a processor like Microsoft Word before inserting the text into an Agillic email means you run the risk of inserting unwanted styling from the document into your email.
Ideally, none of the content in your email should have any styling as the email template will define the styling itself. This makes sure that your styling is consistent across multiple emails and makes it easy to change the styling at a later time in the email template, without having to worry about the styling of each individual email.
If you still have an issue with incorrect styling in an email, click the content field and have a look at the 'HTML' panel. If you see a lot of HTML code surrounding your text, it might indicate unwanted styling which you will have to remove.
The following HTML is an example of two lines of text with a lot of styling from Microsoft Word:
<div style="mso-element:para-border-div;border:none;
border-bottom:solid #73B632 2.25pt; padding:0cm 0cm 3.0pt 0cm"> <h1><span lang="DA">Headline from word<o:p></o:p></span></h1> </div> <p class="MsoNormal"><span lang="DA"> </span></p> <p class="MsoNormal">This text is copy/pasted from Word<o:p></o:p></p>
You should ideally see this content with the following HTML:
<h1>Headline from word</h1> <p>This text is copy/pasted from Word</p>
To avoid adding unwanted styling to your email, we recommend you always insert your pre-configured text as 'plain text'. This is possible with the following shortcut keys:
- Windows: Ctrl + Shift + V
- Mac: Shift + Alt + Command + V
An example of text with Microsoft Word formatting and the same text without the Word formatting
<div> Tags in Chrome
Text with multiple lines will insert text with <div> tags when you use Chrome rather than a normal line break <br>. Normally, this won't cause any issues. However, for special email template layouts, it can force lines of text to break the width of the email.
In these cases, we recommend you paste the text you want to display directly into the 'HTML' panel and add the line breaks manually. By adding line breaks manually, they should appear correctly as <br> in the 'HMTL' panel.
Three lines of text with div tags rather than the normal breaker tags
Blue Text Links
When creating text links with no added styling, the link will appear as blue text with an underline.
You can add the HTML styling 'style="text-decoration:none"' to hide the blue text link. Here, you see an example of a complete text link with no blue text:
<a style="text-decoration:none" href="http://agilliccandy.com">Shown Text for link</a>
If needed, the text can be styled with a different colour or font to highlight the text as a link.
A text link on a call-to-action button with and without styling to hide the standard formatting
Suggested Next Steps