Extra spaces in rendered email?

Highlighted
Level 1

Extra spaces in rendered email?

Hi, I'm not sure what's happening here, but I'm using Email Editor 2.0 to edit content of our emails, both through the WYSIWYG and via the HTML code editor in an editable text module.

Normally it works fine, but I have noticed that if you have two words next to each other, with no space, and with an HTML tag in between, Marketo will add an extra space to the rendered output in browsers and email clients.  This space is not represented in the code, and checking the WYSIWYG and code after sending a sample, there is no space character that has been added, so it seems that Marketo is adding this space when it processes the email before sending it out.

Example:

example(strong)text(/strong)

where the parentheses are greater than/less than and there is no space between any character

renders as:

example text

(note the extra space between "example" and "text")

So there is no space in the original code, or when it's rendered in the email editor, but for some reason it's being added in ALL clients and ALL browsers when viewing the sample/test email.  This happens with b/i tags, strong/em tags, span tags, basically any HTML tag that you would use to modify a piece of text inside a paragraph, div, or td.

I'm beyond frustrated with this stupid little error and I've tried everything I can think of to no avail.  Any help is greatly appreciated, thanks.

11 REPLIES 11
Highlighted
Level 7

Re: Extra spaces in rendered email?

I'm not able to replicate on my side, Email 2.0 is very buggy and bugs differ from instance to instance, it may be worth opening a support ticket to get Marketo to investigate.

Highlighted
Level 1

Re: Extra spaces in rendered email?

Just following up, I did some more digging and found that it’s definitely the text/html editor (some form of MCE?) that’s causing the problem, not the mail preprocessor.  Emails that do not have editable text sections do not have this issue.

For some reason, the text/html editor ALWAYS adds a trailing space to the end of every line of code, no matter what you do.  In addition, any time a new HTML tag is opened, the editor starts a new line, which means the trailing space is added to the line above, where it should not be.  That is what’s causing the gap in front of the tags.

So this (think of parentheses as gt/lt):

lorem(span style="color:red;")ipsum(/span)

gets rewritten to:

lorem

(span style="color:red;")ipsum(/span)

To solve this, I have requested that Marketo’s text/html editor does NOT add trailing spaces to ANY line, and does NOT start a new line every time an HTML tag is opened.  I would also like more control over the editor itself because I know that there's code validation and rewriting happening but we don't currently have the ability to turn it off.

Highlighted
Level 7

Re: Extra spaces in rendered email?

Great work Nicholas, I think Marketo use's TinyMCE as the WYSIWYG editor and I find that some bugs or settings can be traced to that. Another fix can be if you add a Text Tokens, it should skip whatever the editor setting are and just push in the content, it's worth trying if you see other odd bugs.

Highlighted
Anonymous
Not applicable

Re: Extra spaces in rendered email?

We have started running into this issue intermittently.

Even within a sentence which has no code-break, though it seems to be punctuation.

Headline:

Going to Event? Join us the conference sessions...

Looks fine until you send a sample, then shows as:

"Going To Event ? Join us in the conference sessions..."

Highlighted
Level 7

Re: Extra spaces in rendered email?

That's odd. There's not a " or " in the HTML right there?

Highlighted
Anonymous
Not applicable

Re: Extra spaces in rendered email?

I am having the same issue with a space being added right before the registered mark. It just started happening. It only happens when the registered mark is made superscript. I would leave the registered mark as is, but it has been requested to make them always superscript. Any solutions or workarounds to this issue? I made it a token, but in some mobile versions it doesn't show as superscript.

Screen Shot 2017-06-23 at 10.28.48 AM.png

Highlighted
Level 10 - Community Moderator

Re: Extra spaces in rendered email?

Please post

  • the HTML as entered in Marketo
  • the rendered HTML (in a received email)

for that fragment. Not a screenshot, but the actual HTML. (Using the Advanced Editor >> Syntax Highlighting feature here on the Nation will make it easier to read.)

Highlighted
Level 2

Re: Extra spaces in rendered email?

If I add class="mktoText" to a <td> then Marketo editor adds a space wherever there's a beginning parenthesis. If I take mktoText out, no added spaces.

HTML Before mktoText:

<br />

      The 2016 General Conference approved the celebration of United Methodist Volunteers in Mission Awareness Sunday (<a href="http://www.umcmission.org/volunteer" target="_blank">UMVIM Awareness Sunday</a>).

HTML after mktoText:

{{lead.greeting}}

                <br />

                <br /> The 2016 General Conference approved the celebration of United Methodist Volunteers in Mission Awareness Sunday (

                <a href="http://www.umcmission.org/volunteer" target="_blank">UMVIM Awareness Sunday</a>).

So it's like Nick mentioned. The editor is adding a trailing space on the new line that's added, but only in certain instances. Not sure what all those instances are, but it's annoying.

Highlighted
Level 2

Re: Extra spaces in rendered email?

Marketo support got back and said:

The extra whitespace shows up before in certain cases because the email is split into separate lines before we send it out (to avoid problems with max line length problems https://tools.ietf.org/html/rfc2822#section-2.1.1). HTML then presents that linefeed as a space.

There is a workaround for this behavior. In the case of your example in the Community article, by surrounding the text with <span></span> you can force the entire element to be rendered as one continuous line. To do that, you need to click on the HTML button in the richtext editor and add <span> tags around the block of text that contains the <a>.