Below you'll find some simple html codes to make creating your own stuff a little easier. No fancy stuff yet, but I found that learning the basics went a long way in preventing html disasters for me. (The appropriate html codes will be in black below.)

* * * * *

BREAK

Ever put up a banner or image and have your text share the same line as your banner making it completely off-centered and horrid looking? Place the code below before and after your banner or image (and even between text you'd like to separate) and the banner or image will have its very own line. (Put several of these in a row to make the gap wider if you want.)

<br>

PARAGRAPH BREAK

Same concept as above except one of these creates a wider space above and below characters. (Also, if you have font coding a certain way, this code could cause you to keep adding the same font colors over and over down your page. The <br> code doesn't. And, you can only use one <p> at a time to make a standard sized gap. With the <br> code, you can make the gap as tall as you like.)

<p>

CENTER

Can't figure out how to center an image or text on a page? You'll need the following code before your characters.

<center>

To close this off, you'll need to put

</center>

IMAGE CODE

Is there a lovely picture you'd like to put up, but don't know the code? (First you need to know the URL address of the image. If the pic is on your PC, you'll have to upload it using an image host. Some common ones are Photobucket, Majhost or Image Shack.) Use the code below to display the image. Be sure to place the image URL where it says "Image URL Here"

<img src="Image URL Here">

LINK AN IMAGE

What if you want to link your picture to go somewhere when someone clicks it? Easy!

<a href=Address Where You Want Them to Go Here><img src=Image URL Here></a>

(Or if you don't want a border around your image)

<a href=Address Where You Want Them to Go Here><img src=Image URL Here border=0></a>

LINK TEXT

Want to link a word or phrase to take people to another place? Here ya go!

<a href="Place the Destination URL Here">Put the Words You Want to Appear Here</a>

Example: <a href="www.royaladybug.com">Find Neo Graphics Here!</a>

Have the link open in a new window:
<a href="URL HERE" target="_blank">Put the Words You Want to Appear Here</a>

TEXT FONT, TEXT COLOR, TEXT SIZE

Here's a simple way to control your font face, color or size, followed by the code that will close it up. Change the font face, color and size according to what you need it to be. (Keep in mind that not everyone has the fancy fonts you may have. So if you use a font you're unsure of, have someone else tell you if they can see it.)

<font face="verdana" color=red size=4>Your Text Here</font>

You can also use CSS to change your text into many possible colors. The text below will be red, but when you change the color code (which is #FF0000) you change the color! Click here for a CSS color chart.

<font face="verdana" color=#FF0000 size=4>Your Text Here</font>

Also, here are a few popular fonts that can be seen by "most" computers.

 TEXT BOX or FORM BOX

This has to be the most common html question I get. "How do I put a box under my banners so that other people can copy the code?" Well, here's your answer! (You can change the size, color, etc. by experimenting with what's here. But this is the standard box I use on Neo.)

*WARNING: Neo's pet pages are now glitched. When you use the text box code, it will work the first time, but then half of your coding will vanish. I do not know why it does this now. But if someone wants to submit and alternative code for a text box, I will be glad to credit you.

<center><textarea rows="3" cols="20" name="Text_link">PUT INFO HERE</textarea>

REMOVE THE BORDERS AROUND YOUR SHOP AND GALLERY ITEMS

If you have a white or light background, your items might look better if you remove the box around them.

<style>td img {border:0px;}</style>

FOR ADVANCED HTML AND CSS HELP WITH THE NEW NEOPETS LAYOUT, SEE MY FRIEND'S PAGE

Well, Neo really did it this time, didn't they. *sigh* All of the coding above works with normal websites and with your pet pages, however, you might have problems with some of it on your lookup, shop, etc. For that I am sorry. I have no control over what Neo does to their site. In any case, a friend of mine has come up with some great coding help for Neo's new layout. I'll leave the link for you below. =)

April's Coding Help