Pet Pages

How does it work?
These are page layouts for you to use for your pet pages. You need to copy the info in the textbox and then paste it into the Edit Neopet Homepage area. To get to the Edit Neopet Homepage area, go to your Edit Neopet Homepage Page, and then click the edit button below the pet you want to change.

Previewing the lookup:
You can click on the preview of the pet page to see a full sized version of it.

Making your own page based on ours:
You are allowed to use the coding of our graphics to create your own. However, please put the following clearly visible in your layout if you do this: Coding help from SunnyNeo.com.
Preferably with one of our buttons.

Other Info:
Below each preview of the petpage it will tell you what fonts are used on graphics of the petpage. It will also tell you what browsers the petpage is compatible in. It may be comptible in other browsers as well, these are just the ones we have tested them in.

Total Number of Petpages: 7
Last Updated: January 16, 2008

About Me Petpage Fonts: Rabiohead, Drifter Compatible: IE, FF, N and Safari <style type=text/css> center{z-index:100;position:absolute;top:0px;left:0px;} table, .sf{ display: none;} body {background:#ffffff url('http://sunnyneo.com/petpage/PP_aboutme_bg.jpg');} body, div, a { font: 7pt verdana; color:#000000; text-align:center; margin-bottom:2px;} td, tr, table { font: 7pt verdana; color:#000000; padding:0px; margin:0px;} h1{ padding-top:3px; height:23px; text-transform:uppercase; font-size:10pt; font-family:georgia; text-align:center; padding-left:5px; color:#000; margin:0px; margin-top:40px; background:url('http://sunnyneo.com/petpage/PP_aboutme_h1.jpg'); background-repeat: no-repeat;} #nav { left:74px; top:210px; width:632px; height:30px; position:absolute; z-index:3;} #nav a { text-decoration: none; color:#000; padding-left:23px; padding-right:23px;} #nav a:hover { color:#ffffff;} a:link, a:active, a:visited { text-decoration: none; color:#636363;} a:hover { color:#927F44;} b { font: 7pt verdana; color:#8FB677; border-bottom:1px dotted #7f7f7f; font-weight:bold} #pic{ position:absolute; left:0px; top:0px; z-index:0; padding:0px; margin:0px; width: 780px; height: 600px;} #info{ position:absolute; left:74px; top:235px; width:632px; overflow:none; z-index:2; padding:0px; margin:0px;} .footer{ width: 632px; padding: 5px 0px; background-color:#C0D6B2; border: 1px solid #759B60; color:#000000; z-index:4; text-align: center;} #nomar{ margin-top:0px;} </style> <img src="http://sunnyneo.com/petpage/PP_aboutme_img.jpg" id="pic" width="780" height="600"> <div id="nav"> <a href=/explore.phtml>EXPLORE</a> <a href=/arcade/index.phtml>GAMES</a> <a href=/neomessages.phtml>NEOMAIL</a> <a href=/objects.phtml>SHOPS</a> <a href=/neoboards/index.phtml>BOARDS</a> <a href=/nf.phtml>NEWS</a> <a href=/help.phtml>HELP</a> </div> <div id="info"> <h1 id="nomar">First Header Title Here</h1> This is a pet page layout for an About Me information page. Write all about yourself here. You can add more headers and change what they say. <h1>Second Header Title Here</h1> This is what bold text looks like: <b>bold</b>, this is a link: <a href="http://www.neopets.com/~alan_rogers2132">link</a> <h1>Third Header Title Here</h1> Don't remove the bottom credit please ^_^ <br /><br /><br /><br /><br /><br /><div class="footer"><a href="http://www.neopets.com/~alan_rogers2132">I got my Pet Page layout from SunnyNeo, get yours today!</a></div></div>	Avatars Petpage Fonts: Fabulous 50s, Girls are Weird, Drifter Compatible: IE, FF, N and Safari <style type=text/css> center{z-index:100;position:absolute;top:0px;left:0px;} table, .sf{ display: none;} body {background:#ffffff url('http://sunnyneo.com/petpage/PP_avatars_bg.jpg'); } body, div, a { font: 7pt verdana; color:#000000; text-align:center; margin-bottom:2px;} td, tr, table { font: 7pt verdana; color:#000000; padding:0px; margin:0px;} h1{ padding-top:3px; height:23px; font-size:16pt; font-family:georgia; font-style:italic; text-align:center; padding-left:5px; color:#6A4848; margin:0px; margin-top:20px; margin-bottom:5px; border-bottom: 1px dashed #DF95C5; } a:link, a:active, a:visited { text-transform:uppercase; text-decoration:none; color:#49392D;} a:hover { color:#885F6E;} b { font: 7pt verdana; color:#BF83CA; border-bottom:1px dotted #94727B; font-weight:bold} #pic{ position:absolute; left:0px; top:0px; z-index:0; padding:0px; margin:0px; width: 780px; height: 600px;} #info{ position:absolute; left:115px; top:315px; width:551px; overflow:none; z-index:2; padding:0px; margin:0px;} #marquee{ position:absolute; left:115px; top:298px; width: 551px; color:#000000; text-align: center; font-size:7pt} #nomar{ margin-top:0px;} </style> <img src="http://sunnyneo.com/petpage/PP_avatars_img.jpg" id="pic" width="780" height="600"> <div id="marquee"> <marquee scrollamount="4">This Pet Page layout was made by SunnyNeo. Go there to get yours today!</marquee></div> <div id="info"> <h1 id="nomar">Vouchers/Why Lend Me;</h1> Put your voucher's names here. Also, use this space to explain why someone should lend you their items/pets. Include any collat you may have, and some things you were lent before.<h1>Pet/Petpet Avatars I Need;</h1> Show the Pet or Petpet (or Petpetpet) avatar's that you still need here. <br /><br /> If you don't know how to insert images of your avatar, visit:<br /> <i>http://sunnyneo.com/htmltutorial.php#images</i><br /> (copy & paste the url into your adress bar) <h1>Item Avatars I Need;</h1> Show the item avatar's that you still need here. <h1>Misc. Avatars I Need;</h1> Show the miscellaneous avatar's that you still need here (games, random, etc.). <h1>Avatars I Have;</h1> Show the avatar's that you have already obtained here.</div>
Awards Petpage Fonts: super danger, Redensek Compatible: IE, FF, N and Safari <style type=text/css> center{z-index:100;position:absolute;top:0px;left:0px;} table, .sf{display: none;} body{background:#ffffff url('http://sunnyneo.com/petpage/PP_awards_bg.jpg')} body, div, a, p{font: 7pt verdana;color:#000000;text-align:center;} td, tr, table{font: 7pt verdana;color:#000000;} h1 {width:550px;margin-bottom:5px;border-bottom:1px dotted #2D4A6A; font-size:18pt; color: #5E423E;font-family:Georgia;font-weight:normal} a:link, a:active, a:visited {text-decoration: none; color:#6F8787;} a:hover{color:#000000;background-color: #6F8787;border:1px solid #000000} b{color:#2A1C19; border-bottom:1px dashed #384A0E;font-weight:bold} u{color:#131B28} i{color:#797629} #pic{position:absolute;left:0px;top:0px;z-index:0;} #mar{position:absolute;left:90px;top:248px;width:600px;overflow:none;z-index:2;text-align:center;color:#ffffff} #stuff{position:absolute;left:90px;top:268px;width:600px;overflow:none;z-index:2;text-align:center} </style><div id="pic"> <img src="http://sunnyneo.com/petpage/PP_awards_img.jpg" width="780" height="500"> </div><div id="mar"><marquee>I got this Awards Pet Page layout from SunnyNeo! Go there to get yours today!</marquee> </div><div id="stuff"><center> <h1 >Get Your Awards</h1> <b>bold text</b> <u>underlined text</u> <i>italicized text</i> <a href="www.neopets.com">hyperlinked text</a> regular text<p> This is where you put your awards for other people to collect.<br /> </p> <h1 >My Fonts/My Lookups</h1> This is where you have screenies of your past fonts/lookups to show then off =o<h1 > My Awards</h1> I currently have ## Awards.<p>This is whre you put all the awards you have gotten. Fill in ## with how many awards you have. </p> <h1 >Other Header</h1> Put anything else here</div>	Frequently Asked Questions (FAQ) Petpage Fonts: Jester Compatible: IE, FF, N and Safari <style type=text/css> center{z-index:100;position:absolute;top:0px;left:0px;} table, .sf{display: none;} body{background:#ffffff url('http://sunnyneo.com/petpage/PP_faq_bg.jpg')} body, div, a, p{font: 7pt verdana;color:#000000;text-align:center;} td, tr, table{font: 7pt verdana;color:#000000;} h1 {width:550px;margin-bottom:5px;border-bottom:1px dotted #6D591C; font-size:18pt; color: #402021;font-family:Georgia;font-weight:normal} a:link, a:active, a:visited {text-decoration: none; color:#000000;background-color:#715523;border:1px solid #200001} a:hover{color:#ffffff;background-color: #200001;border:1px solid #715523} b{color:#521E20; border-bottom:1px dashed #FFBBC8;font-weight:bold} u{color:#010B50} i{color:#A57900} #pic{position:absolute;left:0px;top:0px;z-index:0;} #stuff{position:absolute;left:90px;top:369px;width:600px;overflow:none;z-index:2;text-align:center} </style><div id="pic"> <img src="http://sunnyneo.com/petpage/PP_faq_img.jpg" width="780" height="500"> </div><div id="stuff"><center> <h1 >F.A.Q.</h1> <b>bold text</b> <u>underlined text</u> <i>italicized text</i> <a href="www.neopets.com">hyperlinked text</a> regular text<br /> </div>
Guild Webbie Petpage Fonts: Christopherhand, Century Gothic, Redensek Compatible: IE, FF, N and Safari <style type=text/css> center{z-index:100;position:absolute;top:0px;left:0px;} table, .sf{ display: none;} body {background:#ffffff url('http://sunnyneo.com/petpage/PP_webbie_bg.jpg'); } body, div, a { font: 7pt verdana; color:#000000; text-align:center; margin-bottom:2px;} td, tr, table { font: 7pt verdana; color:#000000; padding:0px; margin:0px;} h1{ padding-top:3px; height:23px; font-size:16pt; font-family:georgia; font-style:italic; text-align:center; padding-left:5px; color:#2D363F; margin:0px; margin-top:20px; margin-bottom:5px; border-bottom: 1px dashed #6F9F80; } a:link, a:active, a:visited { text-transform:uppercase; text-decoration:none; color:#4E5F74;} a:hover { color:#9EC6B1;} b { font: 7pt verdana; color:#444F5A; border-bottom:1px dotted #C483A1; font-weight:bold} i { font: 7pt verdana; color:#B63B68; } u { font: 7pt verdana; color:#39684F; border-bottom:3px double #8399AA} #pic{ position:absolute; left:0px; top:0px; z-index:0; padding:0px; margin:0px; } #info{ position:absolute; left:21px; top:388px; width:733px; overflow:none; z-index:2; padding:0px; margin:0px;} #nomar{ margin-top:0px;} </style> <img src="http://sunnyneo.com/petpage/PP_webbie_img.jpg" id="pic" width="780" height="588"> <div id="info"> <h1 id="nomar">Welcome to the Webbie;</h1> Write a welcome here. A short description of your guild would do nicely.<p><b> Bold</b> <i>Italic</i> <u>Underlined</u> <a href="http://www.neopets.com/"> Hyperlink</a></p> <h1> Requirements;</h1> If your guild has any requirements, put them here. If your guild does not have requirements, just delete this section. <h1>Guild Rules;</h1> Guild rules here. <h1>The Ranks;</h1> Your guild ranks/how to rank up here.<h1>Activities;</h1> Tsk tsk, activities aren't allowed on Neopets.</div>	Laboratory Log Petpage Fonts: Whimsy TT, Century Gothic Compatible: IE, FF, N and Safari <style type=text/css> center{z-index:100;position:absolute;top:0px;left:0px;} table, .sf{display: none;} body {background:#ffffff url('http://sunnyneo.com/petpage/PP_lablog_bg.jpg')} body, div, a, p {font: 7pt verdana;color:#000000;text-align:center;margin-bottom:2px;} td, tr, table {font: 7pt verdana;color:#000000;} hr {border:1px solid black;background-color: #FEFF3D;height:5px;margin-bottom:7px;margin-top:7px;margin-left:5px;margin-right:5px;} a:link, a:active, a:visited {text-decoration: none; color:#636363;} a:hover {color:#FFD394;} b {font: 7pt verdana;color:#919154; border-bottom:1px dashed #555555;font-weight:bold} #pic{position:absolute;left:0px;top:0px;z-index:0;} #left table{display:inline;} #left{position:absolute;left:20px;top:30px;width:206px;overflow:none;z-index:2;} #log{position:absolute;left:265px;top:256px;width:500px;overflow:none;z-index:2;} </style><p align="center"> <div id="pic"><img src="http://sunnyneo.com/petpage/PP_lablog_img.jpg" width="780" height="600"></div> <div id="left"> Hello, #VISITOR, and welcome to my lab log. Let's start off with some of my stats.<br> <img src="#PHOTO" style="border-bottom:1; border-right:1;"><br> This is how I look right now thanks to the Lab Ray. Aren't I adorable?<br><br> <table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="100%" id="AutoNumber1" height="200"> <tr> <td width="40%" align="right" height="23"><b>Name:</b></td> <td width="60%" height="23"> My name is #NAME</td> </tr><tr><td width="40%" align="right" height="23"><b>Owner:</b></td> <td width="60%" height="23"> My owner is #OWNERLOOKUP</td> </tr><tr><td width="40%" align="right" height="23"><b>Gender:</b></td> <td width="60%" height="23"> I am a #GENDER</td> </tr><tr><td width="40%" align="right" height="23"><b>Age:</b></td> <td width="60%" height="23"> I am #HOURS hours old</td> </tr><tr><td width="40%" align="right" height="23"> <b>Level:</b> </td> <td width="60%" height="23"> I am level #LEVEL</td> </tr><tr><td width="40%" align="right" height="23"> <b>Health:</b></td> <td width="60%" height="23"> My HP is #CURRENT_HP/#MAX_HP</td> </tr><tr><td width="40%" align="right" height="23"> <b>Strength:</b></td> <td width="60%" height="23"> My strength is #STRENGTH</td> </tr><tr><td width="40%" align="right" height="23"> <b>Defence:</b></td> <td width="60%" height="23"> My defence is #DEFENCE</td> </tr><tr><td width="40%" align="right" height="23"> <b>Speed:</b></td> <td width="60%" height="23"> My speed is #MOVE</td> </tr><tr><td width="40%" align="right" height="1"> <b>Intelligence:</b></td> <td width="60%" height="1"> My intelligence is #INTELLIGENCE</td> </tr></table> <hr /> Misc. information here. <hr /> Misc. information here.<br><br> <b>Bold</b><br><br> <a href="http://www.neopets.com">Link</a> </div> <div id="log"> <b>Date here:</b> lab result here<br> <b>Date here:</b> lab result here<br> <b>Date here:</b> lab result here<br> <b>Date here:</b> lab result here<br> <b>Date here:</b> lab result here<br> <b>Date here:</b> lab result here<br> <b>Date here:</b> lab result here<br> <b>Date here:</b> lab result here<br> </div>
Screenies Petpage Fonts: Angelina, Girls are Weird, Drifter Compatible: IE, FF, N and Safari <style type=text/css> center{z-index:100;position:absolute;top:0px;left:0px;} table, .sf{display: none;} body, td, font, table, p {scrollbar-arrow-color:#000;scrollbar-shadow-color:#A9D0BA;scrollbar-face-color:#A9D0BA;scrollbar-darkshadow-color:#A9D0BA;scrollbar-highlight-color:#A9D0BA;scrollbar-track-color:#A9D0BA;scrollbar-3dlight-color:#A9D0BA;background-color: transparent;} body{background:#ffffff url('http://sunnyneo.com/petpage/PP_screenies_bg.jpg')} body, div, a, p{font: 7pt verdana;color:#000000;text-align:center;} td, tr, table{font: 7pt verdana;color:#000000;} h1 {width:650px;margin-bottom:5px;border-bottom:1px dotted #FD8593; font-size:18pt; color: #4AB97D;font-family:monotype corsiva;font-weight:normal} hr {background-color:#FFCCD7; border: 1px solid black; width:400px; height: 5px} a:link, a:active, a:visited {text-decoration: none; color:#666666;background-color:#FEC1C1;border:1px solid #7DBB9B} a:hover{color:#ffffff;background-color: #72C99B;border:1px solid #FEA0AB} b{color:#1A5D39; border-bottom:1px dashed #FFBBC8;font-weight:bold} u{color:#F16F7F} i{color:#69C594} #pic{position:absolute;left:0px;top:0px;z-index:0;} #stuff{position:absolute;left:45px;top:390px;width:690px;overflow:none;z-index:2;text-align:center} </style><div id="pic"> <img src="http://sunnyneo.com/petpage/PP_screenies_img.jpg" width="780" height="405"> </div><div id="stuff"><center> <h1 >NeoBoards</h1> <b>bold text</b> <u>underlined text</u> <i>italicized text</i> <a href="www.neopets.com">hyperlinked text</a> regular text<br /> <img src="http://images.neopets.com/games/new_tradingcards/sm_shoyru_day_2007.gif"><br /> Description of screenie here <hr /> <img src="http://images.neopets.com/games/new_tradingcards/sm_shoyru_day_2007.gif"><br /> Description of screenie here <hr /> <img src="http://images.neopets.com/games/new_tradingcards/sm_shoyru_day_2007.gif"><br /> Description of screenie here <hr /> <img src="http://images.neopets.com/games/new_tradingcards/sm_shoyru_day_2007.gif"><br /> Description of screenie here <h1 >Shop Wiz Snipes</h1> <img src="http://images.neopets.com/games/new_tradingcards/sm_shoyru_day_2007.gif"><br /> Description of screenie here <hr /> <img src="http://images.neopets.com/games/new_tradingcards/sm_shoyru_day_2007.gif"><br /> Description of screenie here <hr /> <img src="http://images.neopets.com/games/new_tradingcards/sm_shoyru_day_2007.gif"><br /> Description of screenie here <hr /> <img src="http://images.neopets.com/games/new_tradingcards/sm_shoyru_day_2007.gif"><br /> Description of screenie here <h1 >Quests</h1> <img src="http://images.neopets.com/games/new_tradingcards/sm_shoyru_day_2007.gif"><br /> Description of screenie here <hr /> <img src="http://images.neopets.com/games/new_tradingcards/sm_shoyru_day_2007.gif"><br /> Description of screenie here <hr /> <img src="http://images.neopets.com/games/new_tradingcards/sm_shoyru_day_2007.gif"><br /> Description of screenie here <hr /> <img src="http://images.neopets.com/games/new_tradingcards/sm_shoyru_day_2007.gif"><br /> Description of screenie here <h1 >Random Events</h1> <img src="http://images.neopets.com/games/new_tradingcards/sm_shoyru_day_2007.gif"><br /> Description of screenie here <hr /> <img src="http://images.neopets.com/games/new_tradingcards/sm_shoyru_day_2007.gif"><br /> Description of screenie here <hr /> <img src="http://images.neopets.com/games/new_tradingcards/sm_shoyru_day_2007.gif"><br /> Description of screenie here <hr /> <img src="http://images.neopets.com/games/new_tradingcards/sm_shoyru_day_2007.gif"><br /> Description of screenie here <h1 >Restocks</h1> <img src="http://images.neopets.com/games/new_tradingcards/sm_shoyru_day_2007.gif"><br /> Description of screenie here <hr /> <img src="http://images.neopets.com/games/new_tradingcards/sm_shoyru_day_2007.gif"><br /> Description of screenie here <hr /> <img src="http://images.neopets.com/games/new_tradingcards/sm_shoyru_day_2007.gif"><br /> Description of screenie here <hr /> <img src="http://images.neopets.com/games/new_tradingcards/sm_shoyru_day_2007.gif"><br /> Description of screenie here <h1 >Awards / Fan Mail</h1> <img src="http://images.neopets.com/games/new_tradingcards/sm_shoyru_day_2007.gif"><br /> <hr /> <img src="http://images.neopets.com/games/new_tradingcards/sm_shoyru_day_2007.gif"><br /> <hr /> <img src="http://images.neopets.com/games/new_tradingcards/sm_shoyru_day_2007.gif"><br /> <hr /> <img src="http://images.neopets.com/games/new_tradingcards/sm_shoyru_day_2007.gif"><br /> </div>