PlumRoyal got their homepage at Neopets.com

Welcome!

Thank you to everyone who encouraged me to put the tutorial back up! It means a lot to me to know it's appreciated and helpful. =)(I ♥ you, Scums. :P)

This tutorial will teach you how to make a very simple pet lookup. I do not offer graphics help or make
customs, so please don't ask. Also, please refrain from asking me for help with your petpage, as I have
limited knowledge of this. I have friends (links are to the right under Special Gals) who offer tutorials for petpages
and user lookups. Feel free to visit their pages.

Examples of lookups using this coding can be found this one and this one (yes, these are my own pets). If you have any questions, feel free to neomail me.

If you use this tutorial, do not claim it was your own coding. The credit link must stay on.

Rules:
1. You do not need permission to use this coding for premades and customs. However, you do need to keep the credit link to my page in every pet lookup you make. You may reword the text credit or even make your own button if you don't like the ones provided, but it must be clear that the coding was done by me and must link directly to this page.

2. If you neomail me for help, please include which pet you are attempting to make a lookup for and specifically what problems you're having. It also helps immensely if you leave your coding as it is if you're having problems (if possible) so that I can look at your coding and see what's going wrong.

3. Did I mention not to remove the credit?

Common Problems:
1. Header/background not showing up? The most common cause of this (in association with my coding) is a simple space between "url" and the first parenthesis ( in the header code. If there is a space there and you're having problems, remove it. Very simple. ;)

2. The header image is not the right size. There are two ways to fix this. The first is to edit your image in whatever photo editing program you use (if you don't currently use one, I've heard that GIMP is a good free one) and resize it to the dimensions that are in the header code. The second suggestion is to change the width and/or height that is specified in the header code to match your image.

Note: If you use any single parts of this coding (just the background code, or just the font code) they must be inside the style tags.

Here's the code to copy and use:

body, td, p{color:#000000;font-family:georgia; font-size:12px;}
a:link, a:visited, .content {color:#FFFFFF; font-family:georgia; font-size:12px;}
a:hover{color:#000000;}

#main{background:#555555;Border:1px solid #000000;width:700px;}

#content{width:100%;}

.contentModuleHeader,.contentModuleHeaderAlt, .ds{
background:#444444;
border:1px solid #000000;border-bottom:0px;}

.contentModuleContent,.contentModuleTable img, .cs {border:1px solid black; background:#DDDDDD;}

.contentModule,.contentModuleTable {border:none;}

.sidebar,#footer,#nst,.user,.nav_image,.bb{display:none;}

#header{width:700px;height:150px;background:#FFFFFF url(http://i23.tinypic.com/2087336.png);border:none;background-position:center;background-repeat:no-repeat;}
</style />

<div align=center><a href='/myaccount.phtml'>MY ACCOUNT</a>||
<a href='petcentral.phtml'>PET CENTRAL</a>||<a href='explore.phtml'>EXPLORE</a>||<a href='gameroom.phtml'>GAMES</a>||
<a href='objects.phtml'>SHOPS</a>||<a href='neoboards/index.phtml'>BOARDS</a>||
<a href='nf.phtml'>NEWS</a>||<a href=/video/index.phtml>VIDEO</a>||<a href=/mall/index.phtml>NC MALL</a><br><br>

YOUR TEXT HERE<br><br>

Code by <a href=/~PlumRoyal>Roni</a></div>

You can paste it here on the "edit pet description" page.

Text in green are the areas you can change.
Text in blue are tips on what that part of the code is for.

1.body{background:#BBBBBB;background-image: url(YOUR_IMAGE_HERE.gif);}
This changes the entire page background to the color/image of your choice.

2.body, td, p{color:#000000;font-family: georgia; font-size:12px;}
a:link, a:visited, .content {color: #FFFFFF; font-family: georgia; font-size: 12px;}
a:hover{color:#000000;}
This changes your font and links color, type, and size.

3.#main{background:#555555;border:1px solid #000000;width:700px;}
This changes the background and border color behind the modules.

#content{width:100%;}

4..contentModuleHeader,.contentModuleHeaderAlt { background:#444444;border:1px solid #000000;border-bottom:0px;}
This changes all the colors and borders for the module headers.

5..contentModuleContent,.contentModuleTable img {border:1px solid black; background: #DDDDDD;}
This changes the colors and borders of the content modules (the boxes that hold your info like pet, stats, description, etc).

.contentModule,.contentModuleTable {border:none;}

6..sidebar,#footer,#nst,.user,.nav_image{display:none;}
This removes the sidebar that shows your active pet, the footer at the bottom of the page, and the navigation.

7. #header{width:700px;height:150px;background:#FFFFFF url
(http://i23.tinypic.com/2087336.png);border:none; background-position:center;background-repeat:no-repeat;}
This is where you can add your own image or change the color of the header. Not good at making graphics and don't want the header to show up? Just replace the entire header code with this:
#header{display:none;}

Border style suggestions: solid,dashed,dotted,ridge
Font suggestions: arial, tahoma, georgia, century gothic
Color Hex Codes: Click here

Link back to me!

My Special Gals ;)

Affiliates (Open)

Other Helpful Pages

Need a Side Account?

NEOPETS, characters, logos, names and all related indicia
are trademarks of Neopets, Inc., © 1999-2008.
® denotes Reg. US Pat. & TM Office. All rights reserved.
PRIVACY POLICY | Safety Tips | Contact Us | About Us | Press Kit
Use of this site signifies your acceptance of the Terms and Conditions