Including Code Snippets for Display / Copy and paste?


Has anyone ever put code for display on an email?
We're developing a widget that we would like to include the code into the email so that our subscribers can copy and paste into their own sites.  We can easily get the code to display by converting all the html entities for display.

The problem that we're running into, is that the widget code is javascript and includes a very long link in it. So, it either blows out the side of the email, or it's broken when we try to wrap it.

Our first thought was to just include the code into a textarea element... so it would be something like:

HTML code to be placed here

However, we've ran into a problem with gmail and a few other online email clients that seems to add an odd <WBR> tags into the content of the textarea.

Has anyone worked with something like this before?

Mathew Mathew, 9 years ago

Hi Troy,

That's not something we've tried - I suspect you might also run into spam filter problems with javascript inside an email, even with encoded entities.

Form elements in emails are also not always reliable. It's an interesting question, and we'd also like to know if anyone has tried this before.

Get in touch with us on Twitter:
We're also on Facebook:
vince, 9 years ago

Javascript and forms are a definate no no.
I have tried many times, and it seriously affects your deliverability.

tpeterson, 9 years ago

I think I solved the problem... (hopefully)
This appears to be working on all major email providers and email clients.  We still have to try it on Outlook 2007 and AOL Mail, but so far no problems.

1. I used  the php function htmlentities($widgetScript, ENT_NOQUOTES) to encode the javascript for display (prior to deployment). 
2. I wrapped the code in a paragraph tag, and applied the following CSS to it:

"white-space: -moz-pre-wrap; white-space: -pre-wrap; white-space: -o-pre-wrap; word-wrap: break-word; white-space: pre-wrap; overflow:auto;"

In theory, by converting the widget code to html entities, it turns the javascript from an executable script, to a group of html symbols.  So, when the subscriber views the html, it shows the full script they need to copy and paste.
In our testing so far, we haven't seen any problems with the spam filters catching it (since it's not an actual script at this point)
Second, I've included all available wrap CSS tags to account for IE, Firefox, Mozilla, etc, etc.  This seems to wrap the code around so it doesn't break the javascript or blow out and expand the email horizontally.  If the wrap doesn't work, then I've included the "overflow: auto" css script.  This creates a scrolling box out of the paragraph tag to keep the display in check.

We're also providing a full text version of the email as well as a link to an online version if they're having problems.

Hope this might help someone else if they're having a similar problem.

travisbell travisbell, 9 years ago

Did you try wrapping your text in <pre> and <code> tags? This is an HTML standard for displaying code inline, but I have no idea what email clients or spam filters think of this... You can use them just like a <p> tag.

<pre><code>This is code</code></pre>

Travis Bell
Stormy Stormy, 9 years ago

I'd definitely second Travis' point - pre/code tags are very widely used for displaying code snippets, and even Outlook 2007 reports that it supports them fully.

No-one expects the Spanish Inquisition!
Rubious, 8 years ago

Has anyone solved TEXTAREA in Outlook 2007 problems?

We are trying to add a block of text for copy-and-paste, it works fine in everything apart from Outlook. We would use the PRE solution but the client wants textareas.

Currently, the content of the textarea just fills the email making it look awful and unprofessional.

Any ideas?

See why 200,000 companies worldwide love Campaign Monitor.

From Australia to Zimbabwe, and everywhere in between, companies count on Campaign Monitor for email campaigns that boost the bottom line.

Get started for free