Draac.Com's HTML For MSNTV E-Mails

• MSNTV Center
• Copy & Paste
• Html Test Bed

MSNTV Html Emails

Add Some Graphics, Sound
And Colored Text To Your Emails.

• Html For MSNTV Emails

Hi MSNTV users,
I hope this information will help beginners get started using HTML in MSNTV emails. This information will also be useful when you start your own webpage !

***IMPORTANT***
Please Read Carefully

ONLY ONE SET OF HTML TAGS IS NEEDED
Use <html> at the beginning of your code and </html> at the end. Never put more than one set of these tags in your Html coding.
ALL IMAGE, TEXT AND SOUND CODES GO BETWEEN THESE TWO HTML TAGS.
Where do I put the code for my emails ?
On MSNTV, you can write html coding in the text area of your email. However, the code will ONLY apply to that particular email.
The best place for your code is in the SIGNATURE BOX. Which is located within the "settings" in your MSNTV email program. The html coding will remain there and be added to each new email that you send.
Note: To link to images and sounds in your MSNTV email you must find images and sounds that can be remotely linked to or they WILL NOT WORK. Many of the free web page hosts like, Tripod, Geocities, Angelfire, etc, have now blocked all remote linking to images and sound due to the high cost of bandwidth.
To read more on remote linking CLICK HERE.

Lesson # 1:
TEXT SIZE AND COLOR:
To SIZE and COLOR your TEXT, try this sample code.
Note: make sure you add the text !
The sample text is "This Is Too Easy Draac !".
<html>

This Is Too Easy Draac !

</html>
You can change the codes within the text, resulting in different FONT SIZES and COLORS for each line!
Try this sample code:
<html>

This Is Too Easy Draac !


I Can't Believe It !!


It's Working For Me !!

</html>
You can switch the FONT SIZE from 2 through 7.
There is a WIDE RANGE OF COLOR available.
CLICK on the charts below to sample them !
Hex Color Chart
Draas' Rainbow Color Chart

Lesson # 2:
BOLD, ITALIC, UNDERLINE, TYPEWRITER TEXT:
These are the tags for bold: and 
These are the tags for italics: and 
These are the tags for underline: and 
These are the tags for typewriter: <tt> and </tt>
Try this sample code:
Note: You can use these tags together or separately. I will use them together.
<html>




<tt>
Are you sure it's this easy Draac ?
</tt>




</html>
Note: MSNTV has messed up the using of multiple tags around text in their latest version of their software. So let's say you use the "bold" and "italics" on the same text, it will only pick up the tags closest to the text and ignore the other tags. Let's hope MSNTV fixes this soon.

Lesson # 3:
BACKGROUND COLORS:
These are the tags for adding COLOR to your background BEHIND the text, gifs and pics.
<body bgcolor="color" text="color"> and </body>
Try This Sample Code:
<html>
<body bgcolor="white" text="#00008b">



I'm Amazed Draac ! I Can Do This ! It's Easy !



</body>
</html>

Lesson # 4:
LINE BREAKS:
There are TWO TYPES of LINE BREAKS.
One is used to BREAK the text into the next line.
The other is used to ADD a BLANK line between things.

This is the tag for a text line break: 
Multiples of this tag can be used to achieve the desired spacing.
This is the tag for A paragraph break: 
The tag will create one blank line.
This tag can only be used once between images or text.
Try This Sample Code:
<html>
<body bgcolor="white" text="#00008b">



I'm Amazed Draac !
 
I Can Do This !
 
It's Easy !

I Am The Best !!



</body>
</html>

Lesson #5:
ADDING AN IMAGE:
The tag for ADDING AN IMAGE is:
<img src="http://The Image URL Here">
Try this sample code:
<html>
<body bgcolor="white" text="#00008b">



I'm Amazed Draac !
 
I Can Do This !
 
It's Easy !




<img src="http://www.draac.com/ape.gif">
</body>
</html>
IN THIS LESSON YOU CAN RESIZE YOUR IMAGE.
All you need to do is REPLACE the IMAGE CODE (above) with HEIGHT, WIDTH and BORDER codes (shown below).
SEE?....all I added was the HEIGHT, WIDTH and BORDER codes.
<img src="http://www.draac.com/ape.gif"
height="75" width="100" border="0">

You can experiment with the numbers to get your desired IMAGE SIZE. Even if you do not know the proportions, all you need do is CHANGE THE NUMBER ON THE HEIGHT OR WIDTH and the program will compensate so that there will be NO distortion in the image.
You can also check the HEIGHT and WIDTH of an image HERE
The BORDER is a shadowbox.
The IMAGE sits within the shadowbox.
The LARGER the border number, the DEEPER the box !

Lesson #6:
ALIGNING IMAGES:
These are the centering tags:
<center> and </center>
Note 1: The align="right" tag and align="left" tag are placed within the image address AFTER the final quote mark of that address.
Note 2: The center tags are placed on either side of an image or text to center it.
Note 3: The tag align="left" is not used that often, since images will default to the left anyhow.
Try this sample code:
<html>
<body bgcolor="white" text="#00008b">
<center>

I'm Amazed Draac !
 
I Can Do This !
 
It's Easy !


</center>
<img src="http://www.draac.com/ape.gif" align="right">
</body>
</html>
TEXT ALIGNMENT:
Here are the tags to center align text:
<center> and </center>
The same as you would do an image.
To align text to the right use a paragraph break aligned to the right.
 with 
Text and images will default align to the left.
Try this sample code:
<html>
<body bgcolor="white" text="#00008b">


I'm Amazed Draac !

I Can Do This !


 
<center>
<img src="http://www.draac.com/ape.gif">
</center>
</body>
</html>

Lesson #7:
SOUND:
There are TWO ways to put BACKGROUND SOUND in your email. By using either one of these codes, the music will start to play AUTOMATICALLY.
Note: MSNTV supports BOTH SOUND codes.
Try these sample codes:
This code is the Internet Explorer sound code:
<html>
<bgsound src="http://www.draac.com/sample.mid">
</html>
This code is the Netscape sound code:
<html>
<embed src="http://www.draac.com/sample.mid" autostart="true">
</html>
This code will automatically generate a clickable sound button in your MSNTV emails.
<html>
<embed src="http://www.draac.com/sample.mid">
</html>
To have the sound play repeatedly, you can LOOP the sound by adding a simple command to your code.
Note: Either of the codes will work with MSNTV.
Try these sample codes:
<html>
<bgsound src="http://www.draac.com/sample.mid" loop="-1">
</html>
Note: The loop="-1" will loop bgsound sound continuously, loop="infinite" will not work.
<html>
<embed src="http://www.draac.com/sample.mid" autostart="true" loop="true">
</html>
Note: You can also use a number value to loop the sound a specific amount of times, for example loop="3" will play the background sound three times, then stop.

Lesson #8:
GIF OR JPG BACKGROUND:
If you would like to add a BACKGROUND PATTERN and COLOR the TEXT of your email use this code.
<body background="http://Your Background URL Here" text="color">
Close with this tag </body> right before </html>.
Sample code of a starfield background with text and an image.
<html>
<body background="http://www.draac.com/starb.gif" text="aqua">

Nice Stars Draac !
 
They Look Good With
 
The Draac Ape


<img src="http://www.draac.com/ape.gif">
</body>
</html>

Lesson #9:
SCROLLING TEXT:
To make your text scroll across the screen.
Use these tags:
<marquee> and </marquee>
Try this sample code:
<html>

<marquee>
This Is So Cool Draac !
</marquee>

</html>
Controls for for marquee are:
Speed:
scrollamount="any number goes here"
Directions:
direction="left"
direction="right"
Behaviors:
behavior="slide"
behavior="alternate"
Let's try two of them in a sample code:
<html>

<marquee scrollamount="50" behavior="alternate">
This Is So Cool Draac !
</marquee>

</html>
For more on the <marquee> tag Click Here.

Lesson #10:
AN IMAGE AS A CLICKABLE LINK:
To make an image a clickable link, you must use this code before your image:
<a href="http://The Address You Wish To Link To">
Be sure you add the closing tag </a> after the image.
Try this sample code:
<html>
<a href="http://gifs123.tripod.com">
<img src="http://www.draac.com/ape.gif"></a>
</html>

Lesson #11:
TEXT AS A CLICKABLE LINK:
To make text a clickable link, you must use this code before your text:
<a href="http://The Address You Wish To Link To">
Be sure you add the closing tag </a> after the text.
Try this sample code:
<html>
<a href="http://gifs123.tripod.com">

Draac's Gifs 123
</a>
</html>
If in an email your font color will be determined by your browser. Or you can add a color to your text link like this to color the text link any color that you would like.

Lesson #12:
TEXT AS A CLICKABLE SOUND LINK:
To make text a clickable sound link, You must use this code before your text:
<a href="http://The Address Of Your Sound File To">
Be sure you add the closing tag </a> after the text.
Try this sample code:
<html>
<a href="http://www.draac.com/sample.mid">

Click To Play Some Sound
</a>
</html>
Again, if in an email your font color will be determined by your browser. Or you can add a color to text link like this to color the text link any color that you would like.

Lesson #13:
AN IMAGE AS A CLICKABLE SOUND LINK:
To make image a clickable sound link, you must use this code before your image:
<a href="http://The Address Of Your Sound File To">
Be sure you add the closing tag </a> after the image.
Try this sample code:
<html>
<a href="http://www.draac.com/sample.mid">
<img src="http://www.draac.com/ape.gif"></a>
</html>

Lesson #14 :
LET'S PUT IT ALL TOGETHER !
Try this sample code:
This is a sample code with a background, text, a clickable image and sound.
Try this sample in your signature box:
<html>
<body background="http://www.draac.com/starb.gif" text="aqua">
<bgsound src="http://www.draac.com/sample.mid">
<center>


<marquee behavior="alternate">
I'm Amazed Draac !
</marquee>


 

I Can Do This !
 
I See The Background !
 
I Hear The Sound !


<a href="http://gifs123.tripod.com">
<img src="http://www.draac.com/ape.gif"></a>
</center>
</body>
</html>
For some FAQs about MSNTV emails Click Here.
For a complete beginners course in Html Click Here.

Good Luck in your creations ! --- Draac

Draac.Com Is Hosted By ValueWeb
Register UK domain names at Domain Names UK