Little help for an HTML noob, please?

[leverhelven]

Ohai guys! I'd like my user lookup to show pics (with links) of all my pets (main account's and side's), just like this one, for example: http://www.neopets.com/userlookup.phtml?user=rory321363

 

How is the coding for this? Can someone teach me, pretty please? Thanks! :)

[jcpet]

For each pet you want to display, use the following code:

<a href="http://www.neopets.com/petlookup.phtml?pet=INSERT_PET_NAME_HERE">
<img src="//images.weserv.nl/?url=http://pets.neopets.com/cpn/INSERT_PET_NAME_HERE/1/3.png">
</a>

So if you have 5 pets, copy and paste the entire code above 5 times, replacing INSERT_PET_NAME_HERE with your pet's name. The pets will show up beside one another on the same row. If you want to start a new row, you need to add a line break: <br>.

 

For example, if you have 3 pets, and you want two rows, one on the first row, and two on the second, you would have the following code:

<a href="http://www.neopets.com/petlookup.phtml?pet=INSERT_PET_NAME_HERE">
<img src="//images.weserv.nl/?url=http://pets.neopets.com/cpn/INSERT_PET_NAME_HERE/1/3.png">
</a>
<br>
<a href="http://www.neopets.com/petlookup.phtml?pet=INSERT_PET_NAME_HERE">
<img src="//images.weserv.nl/?url=http://pets.neopets.com/cpn/INSERT_PET_NAME_HERE/1/3.png">
</a>
<a href="http://www.neopets.com/petlookup.phtml?pet=INSERT_PET_NAME_HERE">
<img src="//images.weserv.nl/?url=http://pets.neopets.com/cpn/INSERT_PET_NAME_HERE/1/3.png">
</a>

[Mouseykins]

One other thing you may want to add is putting the code from jcpet into a div so that you can move it around and position it how you want it on your lookup. So your code would look something like this:

<div id="pets"
<a href="http://www.neopets.com/petlookup.phtml?pet=INSERT_PET_NAME_HERE">
<img src="//images.weserv.nl/?url=http://pets.neopets.com/cpn/INSERT_PET_NAME_HERE/1/3.png">
</a>
<br>
<a href="http://www.neopets.com/petlookup.phtml?pet=INSERT_PET_NAME_HERE">
<img src="//images.weserv.nl/?url=http://pets.neopets.com/cpn/INSERT_PET_NAME_HERE/1/3.png">
</a>
<a href="http://www.neopets.com/petlookup.phtml?pet=INSERT_PET_NAME_HERE">
<img src="//images.weserv.nl/?url=http://pets.neopets.com/cpn/INSERT_PET_NAME_HERE/1/3.png">
</a>
</div>

The div id is just a name for the div that you can use CSS to move it around on your lookup like you would your modules. Something like this for example:

#pets {
margin-top: 0px;
margin-left: 0px;
}

[leverhelven]

All right!!! Thank you so much, you two! I could never ever be a programmer D: All those codes are worse than Chinese to me, lol!

Here, check the result:

 

http://www.neopets.com/userlookup.phtml?user=policialmagaly

 

Thanks again! <3