As before, If you haven't been to my site before please take the time to read everything. If you've been here before and want to review something, please feel free to use the box below.
NOTE Again this tute was made to help webtv/msntv user's put images and stuff in there emails. If your a webtv/msntv user, or PC user that came here to learn HTML for your webpages. Then all you have to remember is like on the previous page, YOU CAN PUT ANYTYHING YOU WANT AFTER THE BODY CODES. Besides the image codes shown here, you can add text, javascript, anything YOU want.
To put a background in your email, first you have to find a background you like. To view some click
here. The ones marked "Backgrounds" work best in emails and all are linkable.
1. Make sure you have the correct address! If you don't you will end up with a blank square like this.
2. Find a background you like, you can no longer link images from Tripod, Geocities, or Fortune City, if they come from there they won't work.
3. No get the address of a the background the same way you did with the music on the previous page. Click on goto, and then click on show last on the pop up screen. The address will appear, you can ccp it or write it down EXACTLY THE WAY IT IS WRITTEN!.
4. Now go to your "sig box" and type this in. Remember to put in the <html> and your </html> to close it after your code where I didn't put them in!
|
<body background="address" text="?"> </body> |
Replace the ? with the color of text you want the will show up best with the background. If you happen to get a line or bar in your background put a <noembed> before your <body background, and a </noembed> after your text="?">.
Sometimes when you put a background in you will see black lines where you usually type. Don't worry about them, there in there so you can see what your typing. If you picked black as your text color and can't see what your typing, add this code.
|
<html> <body background="address" bgcolor="?" text="?"> </body> </html> |
Replace the "?", mark after background with a color that will allow you to see what you type.
Computer user's just get familiar with these codes, you will probably be using them in your webpages.
1. Get the address of the gif the same way as you did with the music and the background.
2. Now type this in (If you just want to add the gif with out changing your background)
3. Now if you want to put it on a background color, type this in.
|
<html> <body bgcolor="?" text="?"> <img src="image address"> </body> </html> |
4. Now you can center your gif by using this code,
|
<html> <body bgcolor="?" text="?"> <center> <img src="address of images"> </center> </body> </html> |
5. Ok guy's here's where it start to look complicated, but if you take it slow and try it, it will work.
You can also add height and width by adding these codes, height="?" width="?", Just replace the ? with number's and play with them until you get the effect you want. Add them like this:
<img src="address of image" height="?" width="?">
6. Now you can align them right or left by adding this code. align="right" or align="left". Add this code like this. <img src="address of image" align="?" height="?" width="?">
Replace the ? with right or left.
You can also use <div align="?">, you can replace the ? mark with "left", "center", or "right". You close it with a </div>, it goes in the code like this
|
<div align="?"> <img src="address" height="?" width="?"> </div>. |
You can replace the ? mark in the div code to whatever direction you want, "left", "center", or "right". This works real well with the pagebuilder for webtv user's.
7. You can also add more than one gif by using all the codes.
|
<html> <body bgcolor="?" text="?"> <img src="address of image" align="left" height="?" width="?"> <center> <img src="address of image" height="?" width="?"> </center> <img src="address of image" align="right" height="?" width="?"> </body> </html> |
NOTE If you want you can leave out the align="left", it will go there by it's self (or default).
Or you can put them on top of each other.
|
<html> <body bgcolor="?" text="?"> <center> <img src="address of image" height="?" width="?"><BR> <img src="address of image" height="?" width="?"><BR> <img src="address of image" height="?" width="?"> </center> </body> </html> |
If you need a space inbetween the images put 2 <BR>'s The more of them you put in the more spaces you will have.
<img border="?" src="address of image"> Replace the ? with a number, usualy 10 will do the job. But you need to add a border="?" even if it's "0" to make it pc compatable or a box might show up around it if you use it as an image link.
Another way of adding an invisible border is by adding the HSPACE and VSPACE to the code. What that does is add a invisible border above and below, or on the sides, or both. Hspace="?" will add a border horizontally, or on top and bottom, vspace="?" will add a border vertically, or on the sides. There added to the code like this:
You can replace the ? mark with a number, the bigger the number the bigger the border.
Another thing you should get into the habit of doing, (This is optional) But you should get into the habit of adding alt= to your image codes. It helps show up on some browser's, when they can't see the image they will see the words, and works like this:
<img src="address of image" height="?" width="?" alt="?">. You usually replace the alt="?" with the name of the image. Like if your image is of a dove, you would put, alt="dove">. It is the proper way of doing
it.
8. Just remember, the more stuff you put in your sig box the slower it will load!
If you want to add music the codes are the same and still go after your background codes
|
<html> <body background="address" text="?"> <bgsound src="song address" loop="-1"> </body> </html> |
OR
|
<html> <body bgcolor="?" text="?"> <bgsound src="song address" loop="-1"> <center> <img src="image address"> </center> </body> </html> |
Ok, here's a sig code below for you to copy as a test and see what it will look like. Take it here to my sig tester. Don't forget to put the <html> at the top left of the testbed. For you PC user's take the code and go to my testbed here.
To add a link to your webpage or site to your emails use this code. <a href="address of webpage">visit my webpage</a>. You can change the (visit my webpage) to anything you want to.
To add a link to your webpage or site using an image, use this code. <a href="address of webpage"><img src="address of image"></a>. You can use center codes to center all of these.
To add color, or change the size of your links use the font codes inside the link code. Like this: <a href="address here"><font size="?" color="?">visit my site</a></font>. You can change the "visit my website" to anything you want.
Adding and email link. This is mostly used in webpages but can be used in emails. <a href="mailto:your name@webtv.net">EMAIL ME</a>, or if you want to use and
image like mine at the bottom of the page,
<a href="mailto:your name@webtv.net"><img src="image
address"></a>
<embed src="your webpage address" width="?">, replace the ? with a number, try anwhere from 400, to 423. You should use a compatable background too.
This can also be used to protect your emails from being (bounced).where somebody can look in and see your codes and addresses, and using addresses you have transloaded to link to there sig boxes, stealing your bandwidth. Make a web page, name it something like "Sig 1". Then put the codes in just like you would in your sig box, make sure you use height="?" and width="?" on your images to make them fit right. When your done, all you have to put in your sig box is <html><body bgcolor="?" text="?"><emded src="the web address of sig 1"></body></html>, replace the ? marks with the same colors you used in sig 1. You can make many sig pages this way and it makes it easier to change your sig box.
Ok, embeding your sig is not PC compatable! In other words PC user's will not be able to see them. But there is a way to make it PC compatable for some of them. Those people who use the Internet Explorer as there main browser can see what's called "iframes".
Iframes are essentially, "floating frames". The code is the same as the embed code mostly, here's an example.
2. Now your scrapbook should be activated, and ready for storing images, sorry no sounds can be put in the pagebuilder, just images. You can add images from the uploader above, or when you get a picture in your email it should appear on your sidebar, just click on it and it will be added to your scapbook
3.Now to get the addresses of the images you put in your scrapbook so you can use them in your email, or transload them. Go to the page you build for your images, click "add an item". Then cilck "Picture", then choose scrapbook, click on the picture you want.
4. Now take it to my tools page. Once there take the address of the page your images are on and put it in the first "Source Viewer". The one called "Expert HTML Source Viewer" and click the botton.
5.On the next page there will be a page with all the codes it takes to make your page, but at the bottom of the page there's a drop down, the first one which has, "imags@http://the address of your page". Click on that one, on the drop down you will see the name of all the images on your page.
6.Clike on the image you want the address of, and click the "view" button on the right. On the next page the image will be there with the address below it, you can click on the image, to view it and get the address by clicking your "goto" button, and then your "show last" button on the pop up. The address will be in the window on the pop up, you can ccp it or or copy it EXACTLY! You can use this address to transload or use it in your image code.
7.Or if you want, there's a box at the bottom of the page, the box has all the codes you need to put the image in your email or webpage, Just ccp it or copy it EXACTLY! That's all there is too it.
ONE THING TO REMBEMBER, YOU HAVE TO TAKE OUT THE -1, OR -2 AFTER COMMUNITY IN THE ADDRESS FOR IT TO WORK IN THE INSTRUCTIONS BELOW!
CHANGING _ TO DOTS TO GET THE ADDRESS
1. First, make a page just for your
images. Do this by going to "community" on the main homepage of webtv and clicking on it. Then click "Pagebuilder", it should be the second one down on the list. Then click "create" on the
side bar, name it anything you want. Then put
your title on if you wish, and pick a background.
2. Now your scrapbook should be activated, and ready for storing images, sorry no sounds can be put in the pagebuilder, just images. You can add images from the uploader above, or when you get a picture in your email it should appear on your sidebar, just click on it and it will be added to your scapbook
3.Now to get the addresses of the images you put in your scrapbook so you can use them in your email, or transload them. Go to the page you build for your images, click "add an item". Then cilck "Picture", then choose scrapbook, click on the picture you want.
4.This takes you to change picture and caption page. Here you will see your picture with change picture and view picture. There are 2 text boxes under the picture. Click on "View picture". Your pictuer should now load with either a "mailedD#?_gif". or mailed#_jpg", or "importD#?_gif" or improtD#_jpg".
5.Write this down so you don't forget it. This is a partial address to your picture. Now hit your "back" button, This takes you back to the "change picture and caption page".
6.In the small (caption) or text box, type in the picture address you were given with the "View this picture". Drop the _ and replace it with a . (DOT). In the large text box, type in the name of your picture so it is easily remembered later, click "Done". Follow the publishing process, you can repeat this process until all the images you need addresses to are in there. The address you put in your emai or transloader should look something like this.
"http://community.webtv.net/your user name/name of published image/scrapbookFiles/ with importD#jpg or gif, or mailedD#jpeg or mailedD#.jpg or mailedD#.gif".
Replace the # with the number you get when you viewed the picture in step 4.
|
|
Here's the code for you:
<center><audioscope bgcolor="black" height="60" width="200" gain="0" leftcolor="red"rightcolor="blue"></center>
Here my simple tutorial on making them is Here.
Ok these next 3 codes, although alot of people are using them, they do have a couple of draw backs. When you put them in, people who recieve your email will not be able to ccp anything from your email. You won't see the effect until after it's mailed, and won't see it in posts. Use it at your own risk
Here's the code for putting an image above the header of your email. Put this after your opening <html> tag. <html></table></td><br><br><center> <img src="address"></center><the rest of your codes></body></html>
Here's the code for your to put an image above the text, but below your header. The codes go between your closing </body>. To get this effect put this in, </body></table></tr></td><br><br> <center><img src="address></center></html> It looks wierd, but it works.
Ok, if you want an image both, above your header and text, here's the code. After your closing </body>, add this.
</body> -- after that,</table></tr></td><BR><BR><center><img src="address of image here" height="?" width="?" border="?" alt="?"></center>
</table></tr></td><BR><BR><center><img src="address of image here" height="?" width="?" border="?" alt="?"></center></html>
If you would like a clock like this in your email or wepages?
Put this in your sig box or webpage <clock></clock>, That's it! You can center it using the center codes. For more info on making them click here.
If you want to learn about making maquee's like this
These next codes are probably the some of the biggest you will put in your sig box, so if you don't know how to cut,copy,and paste. Make sure you WRITE DOWN THESE CODES EXACTLY!
If you want to put a weather bar on your email or webpage, Like this:
click here. Put your local info at the top of the page and click, and when the next page comes up, scroll down until you see, "add this sticker to your homepage". Click on that and pick the weather bar you want and it will give you the code. Again, You can ccp it or WRITE IT DOWN EXACTLY AS IT IS WRITTEN!
Just remember that the first thing in your sig box is <html> and the last thing to go in your sig box should be </html>. Or if your <body background the last thing in your sig box should be </body></html>. But if your not using a body code you don't need the </body>.
Here's an example of a clock you can put in your email or on a webpage.
|
|
To learn more about them click here.
And please sign the guestbook below and tell me what you think. If you want to go back to the homepage
click
here. Or if you want to visit my
"Tips for Webpages" click here. Or if you want to print this out
or use the cut,copy, and paste boxes for the codes
Click here. Thanks, Kid.
Please Sign My Guestbook
"I can't teach you, I
can only
help you find yourself"
"Bruce Lee"
This page copyrighted by "TheKid" 2001,
all rights reserved