Happy Halloween! I've got a new spooky layout, perfect for teaching you how to haunt your pages!

Welcome

Greetings! My name is Dealership, but please, call me Dea! I'm a Red Zafara, and I'll be your guide! This page will help you make wonderful layouts! Star made this layout herself, and I'll tell you a secret – If she can make them, anyone can!

About Me

Name : Dea
Age : 16 years old (42815 hours, according to NeoPets, though.)
Gender : Male
Level : 1
Strength : 13
Speed : 12
Defence : 6
Hit Points : 5
Intelligence : 10

I know I'm not that impressive, but I have a dream of being painted someday! Maybe I'll be Halloween, or even Darigan! Or, if I'm really lucky, I might become a Krawk, or a Draik!

I don't want to bore you with the story of my life, but I would like to tell you more than just those simple details. Although I may not seem like I'm very special, Star really has big plans for me, although she hasn't decided quite what they are yet. She does roleplay her other pets on occasion, so you can NeoMail her if you'd like. Her Shop has some really nice items, too, if you'd like, you can buy some of them, and maybe she'll make me into a Halloween pet! She also has a really cool Guild, if you want to join it. My hobbies include teaching people HTML, writing, reading, drawing, and hanging out with my friends. I also enjoy playing pranks on my friends, although Star doesn't find that amusing at all. My dislikes include when people are mean to me, if people don't include me, and the fact that I'm never roleplayed.

I'm kept on an account called Berem, which is named after one of Star's favorite book characters. The others who stay here with me are Asti, and Era. I don't really have any friends except for Star's other pets, but I hope that will change soon. NeoMail Star to roleplay, and then maybe she can list your pet on this page as a friend of mine.
My wishlist includes the following items...

Gormball Necklace

Dark Faerie Wings

Woolen Scarf

Woolen Cap

Halloween Paint Brush

Halloween Rock

Spectacles of Perception

If you have any of these items, please, NeoMail Star.
On the topic of NeoMailing Star, please try to read the guide before NeoMailing her. She can get quite busy at times, which means she may not be able to answer all her NeoMail at once.
If her Inbox is full, send any of her pets on her main account a BattleDome Challenge, and explain the problem in the Challenge area.
On the topic of BattleDome challenges, Star's pets currently do not accept challenges. Thank you for your time.
But that's enough about me, let me finally begin teaching you HTML.

Stuff to Know

Before you rush off to edit your lookup, there are a few things you must know.
The NeoPets Team has set some rules for editing lookups, and what you can, and cannot remove.
Here I shall put Editorial questions from The Neopian times, that relate to lookups, and coding.

May we take parts off of our new User Lookups or cover over them? For instance, the Neohome section. I do not furnish my Neohome and don't want it prominently displayed on my lookup. Would it be against the rules to cover or remove that box?
As we said last week, what you can and can't do in User Lookups is currently being debated, and we're looking at the lookups of a lot of the talented folks that have already figured out the new code to see what they've done. We're currently leaning toward allowing the Neohome and Shop & Gallery modules to be removed while everything else must stay in some form. We'll make an official announcement in New Features when the rules are decided, and we'll update the "My Profile" page (where you edit your User Lookup) to also list what you can and can't cover so everyone knows the deal.
- Editorial Issue 290

As you can see, there are mixed answers on this particular topic. To be on the safe side, I have found more information on these issues.

Okay, so I asked this on the Help Board, but no one seemed to have an answer for me. So straight to the source I went! I know there are specific rules for what you can and can't cover up in a userlookup or guild, but what about shops? I recently came across a shop with a full page layout. The navigation (retyped) & items were there, but otherwise everything else (shopkeeper, report this shop link, etc) was covered. Is this against the rules?
Erm, yes. Covering the report shop link especially is not allowed. In short, any links on the page must always be there. To clarify, here's a list of the definitive rules on the subject.

User Lookup:

You MUST have your real, official stats viewable. You cannot retype these yourself. They have to be the official, default stats that exist on every user lookup. (Your block of text info, your Neopets, your trophies, etc.) This is so that everyone visiting your lookup knows for sure that this is your true information.

You can cover your shield! It's quite nice to cover it with something that matches the theme of your lookup. And your join date is available in your text stats, so covering the shield does not hide how long you've been on the site. However, you CANNOT cover this shield with a different, official Neopian shield. If your current shield says "2 Years," you can't cover it with the 5 year shield.

You should have the standard yellow bar links so that they are clickable. They don't have to be on the bar itself, so you can retype them as text links or make your own navigation bar if you like. Whatever you wish as long as those links are on the page. :)

Pet Lookups:
The correct stats of your Neopet(s) must be displayed. Again, you cannot retype them or cover them in any way.

Shop/Gallery:

You can replace the side navigation and header as long as ALL standard navigation links are clickable somewhere else in your shop/gallery. If you do not have these links, your shop/gallery will be cleared.

In general, all other information, such as prices, your account name, user lookup and report links, etc, must be clearly visible and clickable.

For shops specifically, you CANNOT have your font color and background color the same, or similar enough that it is difficult to read the prices of your items. Your shop will be cleared if a monitor sees this. A user must be able to clearly see what they are buying and how much it costs.

Guilds:
The real guild navigation and welcome sections must be visible. You may cover everything else with graphics, but if you do, the yellow bar links MUST exist somewhere else on the page so that people can navigate away from your guild.
There may be some things we missed, but it should be quite clear from this list what is and isn't allowed. :) If you have all the real information from the specific page viewable, and the user can navigate all the links on the page that are normally found there, your code is probably good to go.
- Editorial Issue 230

The Basics

Now that you know who I am, what not to do, and what exactly you'll be learning, I shall continue, and start to teach you some basic HTML, and CSS.
But, before you get started, I suggest buying or downloading a graphics editing program.
This is a Paint Shop Pro tutorial you can use, if you desire. It's hosted by my friend, Tutorial!

Bold

Italic

Underline

Center

Image

Link

Font Code

Divider

Scrolling Text

Add Music

New
Line

New

Paragraph
<p></p>

~~Line-Through~~
WARNING : THIS CODE DOES NOT WORK ON LOOKUPS.
<strike>Line-Through</strike>

~~Line-Through for Lookups~~
WARNING : IF YOU HAVE ITALIC TEXT, DO NOT USE THIS CODE. IT WILL PUT A LINE THROUGH IT.
<style> i { text-decoration: line-through; } </style> <i>Line-Through</i>

-invalid_words- Scroll box.

Navigation Links
[Create][Central][Explore][Games][Neomail]
[Shops][Boards][News][Stuff][Help][Login]

You can put these together, if you want! These basic codes are the backbone of any page, and are helpful to know.

Advanced Codes

Now that you know some basic codes, it's time to move on to more advanced coding.
All of these codes must be placed in style tags.
Style tags look like this.

Here are the codes, but remember – Use style tags!

Remove the Header

Remove the Footer

Remove the Sidebar/NeoFriends Section

Background Modifier

Scrollbar Modifier – ONLY WORKS IN INTERNET EXPLORER

Header Code

This is a two-part code, you must put this on your page to use the headers.
Do not put it in style tags.
Put it in the actual text on your page.

Font Color Modifier

Link Color Modifier

Bold, Italic, Underline Modifier

Background Modifier

NeoPets/Trophy Size Modifier

Lookup Table Modifier

Custom Shield
NOTE: You CANNOT cover your shield with a different official shield! It is a reportable offense! If you are a newbie, you may not cover your shield with the six year shield!
Helpful hint: The shield width should be 100 pixels, with a height of 150 pixels.

Layout Templates

This layout is for Guilds ONLY

<center>
<style>
</style>
<style>
#main {
	border: none;
	background: none;
	float: left;
	margin-left: 115px;
	padding-top: 90px;
}
#table {
	width: 120px;
	border: none;
	background: none;
}
.table {
	width: 120px;
	border: none;
	background: none;
}
table {
	width: 120px;
	border: none;
	background: none;
}
.content {
	width: 120px;
	border: none;
	background: none;
}
.contentHeader {
	border: none;
	background: none;
}
a:link {
	color: #000000;
}
a:hover {
	color: #484848;
}
a:visited {
	color: #000000;
}
TD, P, BODY {
	color: #000000;
}
body {
}
#footer, #header {
	display: none;
}
h1 {
	font-size: 12pt;
	color: #484848;
	padding-bottom: 2px;
	border-bottom: 3px dashed #484848;
	margin-bottom: 0px;
	margin-top: 0px;
	text-align: right;
	background: #000000;
	text-transform: uppercase;
}
h2 {
	font-size: 12pt;
	color: #484848;
	padding-bottom: 2px;
	border-bottom: 3px dashed #484848;
	margin-bottom: 0px;
	margin-top: 0px;
	text-align: left;
	background: #000000;
	text-transform: uppercase;
}
body {
	background-color: #000000;
}
.sidebar {
	display: none;
}
#m, #n, #mb, table, td {
	background: none;
}
#ban, #object {
	display: none;
}
body {
	background: url("http://usera.imagecave.com/star132458/backgroundbase1.PNG");
}
img.a {
	position: absolute;
	top: 0;
	left: 0;
}
</style>
 -invalid_words- 
<div style="position: absolute; top: 275px; left: 615px; width: 110px; height: 230px;">
<h1>Navigate</h1>
[<a>Create</a>][<a>Central</a>]<br>[<a>Explore</a>][<a>Games</a>]<br>[<a>Neomail</a>][<a>Shops</a>]<br>[<a>Boards</a>][<a>News</a>]<br>[<a>Stuff</a>][<a>Help</a>]
<h2>Links</h2>
LINKS
<h1>Credit</h1>
[<a>Guild Layout Template by Star132458</a>]
</div>
<div style="position: absolute; top: 275px; left: 285px; width: 301px; height: 230px;">
<h1>HEADER</h1>
TEXT
<h2>HEADER</h2>
TEXT
<h1>HEADER</h1>
TEXT
<h2>HEADER</h2>
TEXT
<h1>HEADER</h1>
TEXT
<h2>HEADER</h2>
TEXT
</div>
</center>

This layout is for Pet Lookups ONLY.

ADD YOUR TEXT HERE.

This layout works on PetPages ONLY.
It requires a basic knowledge of CSS positioning, and image creation.
You must modify the information as needed.

This is a lookup template. You can use it on your lookup, and change the images and colors. <a>Star's lookup</a> is an example.<br><textarea rows="1" cols="5"><style>
</style>
<style>
#userneopets img {
	width: 100px;
	height: 100px;
}
#userinfo td.medText img {
	visibility: hidden;
}
#userinfo td.medText a img {
	visibility: visible;
}
.content div a img, .content div b {
	display: none;
}
.contentModule div a img, .contentModule div b {
	display: inline;
}
body {
}
.contentModule {
	border: 3px dashed #484848;
}
.contentModuleTable {
	border: 5px solid #FFFFFF;
}
.contentModuleContent {
	border: 3px dashed #484848;
	background-color: #000000;
}
.contentModuleHeader {
	font: 10pt Nightmare 5;
	color: #000000;
	background-color: #999999;
}
#footer, #header {
	display: none;
}
#content {
	width: 1px;
	padding-left: 200px;
	padding-top: 0px;
}
.contentModule {
	width: auto;
}
h1 {
	color: #000000;
	font: 16pt Nightmare 5;
	padding-bottom: 2px;
	border-bottom: 3px dashed #484848;
	margin-bottom: 0px;
	margin-top: 0px;
	text-align: right;
	background: #999999;
	text-transform: uppercase;
}
h2 {
	color: #000000;
	font: 16pt Nightmare 5;
	padding-bottom: 2px;
	border-bottom: 3px dashed #484848;
	margin-bottom: 0px;
	margin-top: 0px;
	text-align: left;
	background: #999999;
	text-transform: uppercase;
}
body {
	background-color: #000000;
}
#main {
	background: none;
	border: none;
}
.medText, td, #nst, .sf {
	color: #FFFFFF;
	font: 8pt verdana;
}
a:link, a:visited {
	font: 8pt verdana;
	color: #888888;
}
a:hover {
	font: 8pt verdana;
	color: #888888;
}
.contentModuleHeaderAlt {
	font: 10pt Nightmare 5;
	color: #000000;
	background: #999999;
}
</style>
<img src="http://www.NeoPets.com/BackgroundImage.gif" style="position: absolute; top: 0px; left: 0px;" width="236" height="510"><div style="width: 700px; height: 250px; left: 235px; top: 250px; color: #484848; position: absolute; overflow: auto;">
<h1>NAVIGATION</h1>
[<a>Create</a>][<a>Central</a>][<a>Explore</a>][<a>Games</a>][<a>Neomail</a>]<br>[<a>Shops</a>][<a>Boards</a>][<a>News</a>][<a>Stuff</a>][<a>Help</a>][<a>Login</a>]<br><h2>HEADER</h2>
TEXT.
<h1>HEADER</h1>
You can change the colors and images. Just leave my credit on, please. I suggest a height of 510 pixels, and a width of 236 pixels for the background image.<br><br>
[<a>Layout Template by Star132458.</a>]</div>
<style>
#stats {
	position: relative;
	top: 0px;
	left: 15px;
	overflow: auto;
	width: 700px;
	height: 220px;
}
</style>
<div id="stats"><table>
<br><br><h1>
<a name="neoboards"></a>NeoBoards</h1>
<br>

Have you ever wished you could make the perfect font? Well, you can, because I have some perfect codes for that!<br>

Center<br><textarea rows="1" cols="5">[center]TEXT[/center]

Color, Size, and Type

Remove Signature Line
THIS IS A TWO PART CODE.
Put this at the end of your Font code.

Put this at the beginning of your Signature code.

It may not look like it did anything, but post on the boards, and your signature line will have vanished!

Welcome

About Me

Stuff to Know

The Basics

Advanced Codes

Layout Templates

Color Codes

Blogs

Link Back