How to make a Layout

Who here wants to make their own layout but doesn't have the right gear for it?  Well, with our help you can! Follow the steps below and soon your page will be as good as new. Please remember to give us credit!

1. Making a Banner - Have a look through your computer's programs and you'll find Paint. Here you can draw, colour in and cut out images. If you have anything similar you can use that, Photoshop or anything like that is highly suggested. We know GIMP and some versions of Photoshop can be downloaded but the version of Photoshop filly1 uses was bought with real money. So now you are on your way. If you are using Paint and you need to cut out anything we suggest enlarge it, it really helps. When you are done, save it. Make sure it has .jpg at the end of the name you save it to.

2. Uploading - Now your banner is finished you can upload it to the web. To do this you can use Photobucket, Imageshack etc.

3. Layout Part - You are now up to the layout part. Copy the code we have for you below into your html mode. When you go back to your page you'll find two boxes both white. Go back to html mode and you'll notice in the code has at the bottom <td bgcolor="#ffffff"> the ffffff is the colour code for "white". Click here to find the colour you want and copy the letters/numbers. Get rid of ffffff and put in the colour code you have. Remember to keep them all together, no spaces. When you return to your page you'll find the bottom white box originally there is now the colour you chose.

<div align="left"></div>
<table style="margin-left: auto; width: 442px; margin-right: auto; height: 256px; text-align: left;" shell="" bgcolor="black" border="0" cellpadding="0" cellspacing="2">
<tbody>
<tr align="middle" height="50">
<td bgcolor="white"><font color="#000000"><br></font></td></tr>
<tr style="color: rgb(0, 0, 0);" align="center" height="200">
<td bgcolor="#ffffff">
<br></td></tr></tbody></table>

Layout code by Pheonix Designs & filly1 (c). If you take this without giving us credit we will eat your karma. No seriously, your karma will be docked.

 

4. Finishing Off - Now is time to add your banner. You can copy the html and paste the code in html mode but usually this will lead back to where you uploaded it with a link. It doesn't really matter but some players find it annoying if they accidently click it. If you don't want the link copying won't work assome browsers won't let you past it for some reason. A trick filly1 learnt is you copy the img code from the image hoster you used, send a pm to yourself with the img code in it (For those who don't know the img code will turn into the image. This code can be used in pms and forums). You need to be using Internet Explorer for this part. You then copy the image to your page and save. Make sure it's all there and go back to your edit page. You can now drag it to the top box. Save it now to make sure Howrse doesn't go wacko after you write out your whole page saying the html is incorect, trust us, you don't want that to happen. Well anyway, ta-da! Your first layout. Now you can get writing in the box below.

5. Extras - You're getting bored with your layout, you want something different. How about try some scroll boxes? Maybe use an image as a background? Or even change to font?

&nbsp;

<DIV align=left>

<P>&nbsp;</P>

<DIV style="OVERFLOW: auto; WIDTH: 679px; HEIGHT: 153px">

<P>text...............................</P>

<P>&nbsp;</P>

<P>text...............................</P>

<P>&nbsp;</P>

<P>text...............................</P>

<P>&nbsp;</P>

<P>&nbsp;</P>

<P>&nbsp;</P>

<P>&nbsp;</P>

<P>&nbsp;</P>

<P>&nbsp;</P>

<P>&nbsp;</P>

<P>&nbsp;</P>

<P>&nbsp;</P>

<P>&nbsp;</P>

<P>&nbsp;</P>

<P>&nbsp;</P></DIV></DIV>

 
scroll box code
 
 
<table height="100" width="150"
background="http://www.tizag.com/pics/htmlT/background.jpg" >
<tr><td>This table has a background image</td></tr>
</table>
 
What you do here is you  paste this code in your html mode, upload the image or get it from Google etc, either way copy the direct link and past it where that other link is. You'll find it comes out as a small box, you just need to stretch it out. We got this code from http://www.tizag.com/htmlT/htmlbackground.php
 
 

<FONT FACE="Georgia">Example</FONT>

This code is for changing the font. Simply paste this in the code where you are writing (you'll see your writing in the code), change Georgia to the font you want and away you go! Note that Howrse only accepts some fonts.
 
 
Copy Right issues: Here are codes for little banners you can put on your page basically saying the original code was by filly1 from Pheonix Designs. You can just type something if you like but we thought you might like something nice instead lol. If you would like something to blend in with the background feel free to pm one of us with the colour code of your layout's background. It'll be free. ;)
Coming Soon
 
Notice to all users of the layout code: filly1 was the original creator of the code and that needs to stay that way. All layouts are mostly the same structure with this code (two boxes with a thick border) and if you are caught saying you were the creator we will demand you to show us the code so we can match it up to our own. If it is our code and you still claim for it to be yours mods will involved!