SSPrincess
06-13-2004, 01:30 AM
So you want a cool looking userlookup do you? Well don't worry, it's not very hard as long as you have the right code for whatever you want. For starters, here's a code that you can use to make a nice Neopets User Lookup:
</i><style type="text/css">
body {background: url('http://backgroundimageurl.gif') fixed}i.solookup}
td, p, body, A{COLOR:#000000;FONT-FAMILY:verdana;FONT-SIZE:8pt;}
A:LINK{COLOR:#FFFFFF;FONT-FAMILY:verdana;FONT-SIZE:8pt;}
A:VISITED{COLOR:#FFFFFF;FONT-FAMILY:verdana;FONT-SIZE:pt;}
A:HOVER{COLOR:#FFFFFF;FONT-FAMILY:verdana;FONT-SIZE:8pt;TEXT-DECORATION:underline;}
p table {width:530;border:1px solid #FFFFFF;background:#FFFFFF;}
b.sotableup {width:530;border:1px solid #FFFFFF;background:#FFFFFF;}
i.return{width:510}
</style>
<b style="overflow:auto; height: 80px; width=530px;" class="sotableup">
<i class="return"> </i>
<b style=color:FFFFFF>TEXT HERE |</b> TEXT HERE <b style=color:FFFFFF>| TEXT HERE</b> <i class="return"> </i>
</b>
The parts that are in bold can be changed so that you can make your layout look anyway you want it to. If have questions about this code(like what certain things do), then visit Lissa's CSS (http://www.lissaexplains.com/css.shtml) page since that's what this code uses.
Perhaps you just want to have text on your userlook. In that case, you'd use this code:
<i></i><style type="text/css">
p table {width:530;border:1px solid #660099;background:#FFFFFF;}
b.sotableup {width:530;border:1px solid #FFFFFF;background:#FFFFFF;}
i.return{width:510}
</style>
<b style="overflow:auto; height: 80px; width=530px;" class="sotableup">
<i class="return"> </i>
<b style=color:000000>
Text
</b> <i class="return"> </i>
</b></b>
Like before, change the parts in bold to fit your preference. There is one catch to this however: you need to have a lot of text. If your text-box is not showing up, then add more text until scrollbars appear, which should show the text-box.
Now, perhaps you will like to have your own side menu instead of the Neopets menu. What you need to do, is use this code:
</i><style type="text/css">
i.menu {background:url(http://www.ImageURL.gif);height: 473; width: 131; position:absolute;top:0;left:15}
</style>
<i class=menu></i>
<style type=text/css>
p table {border: none ;background:#9999CC; filter:Alpha(opacity=90)}
table{background:transparent}
img{filter:alpha(Opacity=0, FinishOpacity=1, Style=3, StartX=0, FinishX=90, StartY=0, FinishY=90)}
</style>
Nothing to change here, all you need to do is insert your image's URL where it says "http://www.ImageURL.gif". Also, for best results with this code, you will need to make your image 473x131 to completely cover the Neopets menu.
Next is the the little banner on top. If you want to put your own image in there, then you'd use this code:
</i><style type="text/css">
i.topbanner {position:absolute;left:220;top:35;background:url("http://www.ImageURL.gif");height:62;width:480;}
i.puos{width:510}
</style>
<i class="topbanner"></i>
Like before, all you need to do is to insert your image's URL in there. Please note that for best result with this code, you will need to make your image 62x480 to completely cover the Neopet's banner.
Last up is the shield. If you want to have your own shield in your user lookup, you'd use this code:
</i><style type="text/css">
i.shield {background-color: #FFFFFF;position:absolute;left:570;top:393;backgro und:url("http://www.ImageURL.gif");height:125;width:100;}
<i class="shield"></i>
Simply change the necessary parts in bold. Also, for best results make your image at least 125x100 to completely cover the Neopets shield.
And that's all you need to know to have a nice looking Neopets User Lookup. ;)
* Any additional questions that was not answered in this tutorial on making User Lookups can be asked
in LEIA's Neopets forum, but don't do not ask questions like "I don't get it, so will someone make a lookup for me?"
Questions like that will be referred back to this thread, so if you
have a question, state exactly what it is, so that you can get helped and get your problem fixed quickly. :) *
</i><style type="text/css">
body {background: url('http://backgroundimageurl.gif') fixed}i.solookup}
td, p, body, A{COLOR:#000000;FONT-FAMILY:verdana;FONT-SIZE:8pt;}
A:LINK{COLOR:#FFFFFF;FONT-FAMILY:verdana;FONT-SIZE:8pt;}
A:VISITED{COLOR:#FFFFFF;FONT-FAMILY:verdana;FONT-SIZE:pt;}
A:HOVER{COLOR:#FFFFFF;FONT-FAMILY:verdana;FONT-SIZE:8pt;TEXT-DECORATION:underline;}
p table {width:530;border:1px solid #FFFFFF;background:#FFFFFF;}
b.sotableup {width:530;border:1px solid #FFFFFF;background:#FFFFFF;}
i.return{width:510}
</style>
<b style="overflow:auto; height: 80px; width=530px;" class="sotableup">
<i class="return"> </i>
<b style=color:FFFFFF>TEXT HERE |</b> TEXT HERE <b style=color:FFFFFF>| TEXT HERE</b> <i class="return"> </i>
</b>
The parts that are in bold can be changed so that you can make your layout look anyway you want it to. If have questions about this code(like what certain things do), then visit Lissa's CSS (http://www.lissaexplains.com/css.shtml) page since that's what this code uses.
Perhaps you just want to have text on your userlook. In that case, you'd use this code:
<i></i><style type="text/css">
p table {width:530;border:1px solid #660099;background:#FFFFFF;}
b.sotableup {width:530;border:1px solid #FFFFFF;background:#FFFFFF;}
i.return{width:510}
</style>
<b style="overflow:auto; height: 80px; width=530px;" class="sotableup">
<i class="return"> </i>
<b style=color:000000>
Text
</b> <i class="return"> </i>
</b></b>
Like before, change the parts in bold to fit your preference. There is one catch to this however: you need to have a lot of text. If your text-box is not showing up, then add more text until scrollbars appear, which should show the text-box.
Now, perhaps you will like to have your own side menu instead of the Neopets menu. What you need to do, is use this code:
</i><style type="text/css">
i.menu {background:url(http://www.ImageURL.gif);height: 473; width: 131; position:absolute;top:0;left:15}
</style>
<i class=menu></i>
<style type=text/css>
p table {border: none ;background:#9999CC; filter:Alpha(opacity=90)}
table{background:transparent}
img{filter:alpha(Opacity=0, FinishOpacity=1, Style=3, StartX=0, FinishX=90, StartY=0, FinishY=90)}
</style>
Nothing to change here, all you need to do is insert your image's URL where it says "http://www.ImageURL.gif". Also, for best results with this code, you will need to make your image 473x131 to completely cover the Neopets menu.
Next is the the little banner on top. If you want to put your own image in there, then you'd use this code:
</i><style type="text/css">
i.topbanner {position:absolute;left:220;top:35;background:url("http://www.ImageURL.gif");height:62;width:480;}
i.puos{width:510}
</style>
<i class="topbanner"></i>
Like before, all you need to do is to insert your image's URL in there. Please note that for best result with this code, you will need to make your image 62x480 to completely cover the Neopet's banner.
Last up is the shield. If you want to have your own shield in your user lookup, you'd use this code:
</i><style type="text/css">
i.shield {background-color: #FFFFFF;position:absolute;left:570;top:393;backgro und:url("http://www.ImageURL.gif");height:125;width:100;}
<i class="shield"></i>
Simply change the necessary parts in bold. Also, for best results make your image at least 125x100 to completely cover the Neopets shield.
And that's all you need to know to have a nice looking Neopets User Lookup. ;)
* Any additional questions that was not answered in this tutorial on making User Lookups can be asked
in LEIA's Neopets forum, but don't do not ask questions like "I don't get it, so will someone make a lookup for me?"
Questions like that will be referred back to this thread, so if you
have a question, state exactly what it is, so that you can get helped and get your problem fixed quickly. :) *