Add this code to the CSS, right after <style>
span.preheader {display: none !important; }Change the background color of the body to 'Space' as the fallback:
<body class="body" style="padding:0 !important; margin:0 !important; display:block !important; min-width:100% !important; width:100% !important; background:#141E23; -webkit-text-size-adjust:none">Immediately after the opening <body ....> tag, add a new <span> element, this is the preheader text.
<span class="preheader">PREHEADER TEXT GOES HERE</span>
Next, add a new <div> element, this is what will hold the background image, and falls back to 'Space' if it can't.
<div style="background-color:#141E23;">
NOTE: You need to add a closing div tag, </div> that matches this, and encloses the entire email.
- Scroll to the bottom of the HTML
- Find the closing body tag:
</body> - On the line above the closing body tag, add:
</div>
On an empty line after the new <div> from the previous step, add the following code:
NOTE: You need to change the src, located in the middle of the snippet. It should link to the URL of the space image.
I made an image here: http://i.imgur.com/KQ4mzuV.png but should probably get a better version from Ray and upload it into the .zip file. If you do this, the URL will be "images/FILE_NAME_OF_PICTURE"
<!--[if gte mso 9]>
<v:background xmlns:v="urn:schemas-microsoft-com:vml" fill="t">
<v:fill type="tile" src="URL TO THE IMAGE" color="#141E23"/>
</v:background>
<![endif]-->Find the first <table> tag under the code you just pasted and change the bgcolor from #ffffff to #000000
Two lines down from the first <table>, find the first <td...>.
It should already have align="center" valign="top". Change it to add the background image's URL:
<td align="center" valign="top" background="URL TO THE IMAGE">