HTML Newsletter

J

jason500

New Member
Hello,

I work for a small company as the marketing assistant and would like to make HTML newsletters to send out monthly to our client database.

I know a little about web design from tutorials.

I have made a quick test which I have been sending to myself (by copying the code to the text field - in HTML mode), but does not work, it displays just the code.

Here is what it should look like: Image

Here is the code:
Made in Adobe Golive. Images obviously need to be linked to an actual source on the internet.


Code: 
<html xmlns="http://www.w3.org/1999/xhtml">

 <head>
  <meta http-equiv="content-type" content="text/html;charset=utf-8" />
  <meta name="generator" content="Adobe GoLive" />
  <title>Newsletter test</title>
  <link href="SAP%20Newsletter/web-content/css/basic.css" rel="stylesheet" type="text/css" media="all" />
 </head>

 <body>
  <table width="748" border="0" cellspacing="0" cellpadding="1" bgcolor="#b00f14">
   <tr>
    <td>
     <table width="100%" border="0" cellspacing="0" cellpadding="0" bgcolor="white">
      <tr>
       <td>
        <table width="100%" border="0" cellspacing="0" cellpadding="5">
         <tr>
          <td>
           <table width="100%" border="0" cellspacing="0" cellpadding="0">
            <tr>
             <td width="736"><img src="SAP%20Newsletter/web-content/Newsletter-test_03.gif" alt="" width="736" height="34" border="0" /></td>
            </tr>
            <tr height="3">
             <td width="736" height="3"></td>
            </tr>
            <tr>
             <td width="736"><img src="SAP%20Newsletter/web-content/Newsletter-test_06.jpg" alt="" width="736" height="102" border="0" /></td>
            </tr>
            <tr>
             <td width="736">
              <p>This is a test.</p>
              <p></p>
             </td>
            </tr>
            <tr>
             <td width="736"><img src="SAP%20Newsletter/web-content/Newsletter-test_03.gif" alt="" width="736" height="34" border="0" /></td>
            </tr>
           </table>
          </td>
         </tr>
        </table>
       </td>
      </tr>
     </table>
    </td>
   </tr>
  </table>
  <p></p>
 </body>

</html>

I know emails only accept the <body> section of the code, but do I need anything from the rest of the code inside the body?

Also, I have been told to use inline CSS, not sure what this is exactly as I'm not really that familiar with HTML. Could someone please guide me in the right direction in relation to this code?

How can I make this display right in an email?
Would really appreciate someone's help. Thanks!
 
zkiller

zkiller

Super Moderator
Staff member
by inline they mean instead of linking to seperat file that contains the css, you just take that code and paste into the header of the html file.

what are you using to send this newsletter?
 
J

jason500

New Member
ah, yes, just noticed that my css link is linked to a file on my computer. This may be one of the problems.
Not sure how I can find the actual CSS code to replace the link, I will see if I can find it when I get home tomorrow.

I will be sending this newsletter using outlook. I have been pasting the HTML code where you type a message, is this right?. I have tried with hotmail and gmail also. No joy.

Oh, This Doctype should have gone above the code I posted, not sure if it makes much difference:
Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

The newsletter displays fine on my local web broser, so I think the code is ok.

Thanks for the reply zkiller. :)
 
zkiller

zkiller

Super Moderator
Staff member
jason500 said:
ah, yes, just noticed that my css link is linked to a file on my computer. This may be one of the problems.
Not sure how I can find the actual CSS code to replace the link, I will see if I can find it when I get home tomorrow.

I will be sending this newsletter using outlook. I have been pasting the HTML code where you type a message, is this right?. I have tried with hotmail and gmail also. No joy.

Oh, This Doctype should have gone above the code I posted, not sure if it makes much difference:
Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

The newsletter displays fine on my local web broser, so I think the code is ok.

Thanks for the reply zkiller. :)
Click to expand...
the doctype and meta tags are pointless in an email. all it can display is either plain text, html or mixture of both.

if i remember right, in outlook you can create html based templates for emails that you can later use to send your emails. pasting the code into the window, as it is a what you see is what you get type of deal, won't work. i don't use outlook, so i am not sure on the details, but i'll see if i can't find a tutorial for ya.

front page might have a built in feature for building such templates.
 
zkiller

zkiller

Super Moderator
Staff member
ok, i installed outlook and looked into it. here is what i would try...

1. save the html file you have created
2. open it with MS Word
3. click on to the little mail icon next to the save icon
4. you can now edit and send your newsletter

let me know how that works out for you. i am running office xp btw and this is the simplest way i found for using templates by just flying threw the program.

just make sure that you aren't linking to anything on your hard drive and that you aren't using any includes as these won't display on the recipients computer.

PS: you might want to give your users the option of receiving either a html or plain text version of the email. some users don't want to receive html emails by my experience.
 
Last edited:
J

jason500

New Member
Well, that now shows up as an HTML email which is great.

I have added a few things to the template.
I have been sending test to hotmail and gmail, and they don't seem to like table cells that are too small.
I have some that are 3 or 4 pixels to separate content, but these get resized to around 13px when received.

I think it's because MS Word changes the code a little and thinks you want to type something in each table cell. From looking at the source, each table cell say Times New Roman, etc.

Is there any other way of sending that HTML file without taking it into word?
 
J

jason500

New Member
Thank you zkiller for all the help and tips.

I have found the answer :D . For all who were following this thread and future users who will search for this, here is how to send an HTML Newsletter in Outlook:

1. After you have designed the newsletter using whatever method you choose and you have an html file saved,
2. In Outlook, go to tools > options > 'mail format' tab
3. Send in this message format: HTML
4. Click the Stationery picker and create a new one. Name it and pick your html file as a template.
5. Then send the email by going to actions > New mail message using...(your created stationery).
 
You must log in or register to reply here.
Top