Aug 05 2009

Just Getting Started

Published by

Learning HTML coding really isn’t so hard. I learned how to do it myself pretty quickly, but with a site at my aid. Now, I have it memorized and only need to look up color codes. After reading this a few times, you should be able to make pretty good, basic layouts.

Tables, Rows, and Cells:

On Howrse, you need to make a table for your layout to be viewed. A table is made up of rows and cells. To begin making a table, or start any form of HTML, you need to have a beginning and ending code. For a table, it starts and ends with this code:

<table> </table>

The backwards slash is always in an ending code. (Remember to add the carrot symbols; if you forget, Howrse can’t read it and your layout can’t be shown.) Once you enter your beginning table code, you can start to add details. These include: alignment, how big you make your cells, width, spacing between the cells, spacing between the cell and where text start, background colors, text colors, fonts…it could keep going! Here is a basic table with just two cells:

cell number one cell number two
This is a row. (Best to use as a footer)

The code that I used for the table is very simple. Here it is:

<table border="1">

<td>cell number one</td>

<td>cell number two</td>

<tr>

<td>This is a row. (Best to use as a footer)</td>

</table>

The <tr> code is the code to enter a row. The ending code for this is </tr>. The whole row code would be this:

<tr>

<td>This is a row</td>

</tr>

All I had to use was basic beginning codes and ending codes. Now let’s say you would like to add a picture or a footer. You can add both of these things in the table above but it would look a little funny like pictured above. There are two cells but only one row, making it off balance. *Remember: cells and rows always end at the same spot unless combined.* By combining two cells or two rows, there will be a bigger space a picture or a longer space for a footer.

Here is the table used for a picture:

Picture goes here
cell number one cell number two

(The text will be centered on Howrse.) To combine cells, enter this code before the beginning text code (<td>): colspan=”2″ Here’s what the HTML would look like:

<table border=”1″>

<td colspan=”2″>Picture goes here.</td>

<td>cell number one</td>

<td>cell number two</td>

</table>

The number two in the colspan code can be changed to any number. Two is there because it means your are spreading the cell over two cells. If you wanted it over three cells, it would be this code: colspan=”3″

To make a footer at the bottom of the page (usually used as a place to put a copyright on your layout). You would do the same code but in the spot for the row. Here’s the whole table code:

<table border=”1″>

<td colspan=”2″>Picture goes here.</td>

<tr>

<td>cell number one</td>

<td>cell number two</td>

</tr>

<tr>

<td colspan=”2″> Footer </td>

</tr>

</table>

It will look like this:

Picture goes here.
cell number one cell number two
Footer

I had to add the <tr> code below the picture text so the site could tell that cell number one and cell number two are placed under the picture text. Howrse shouldn’t have this problem, though.

This is the basic lesson about tables, rows, and cells. Soon I will post how to add colors and fonts. Post a comment if you do not understand this correctly. If you are having any layout troubles, feel free to PM me on Howrse. My user name is Jessica27.

Share

106 responses so far

106 Responses to “Just Getting Started”

  1. # Jessicaon 05 Aug 2009 at 7:09 pm

    I am very sorry. This site I am using is different from Howrse and doesn’t like to work with tables. xD I will try my best so you can view this properly. It worked fine when I was typing it. You can still use the codes; WordPress just isn’t viewing the spacing of the tables correctly.

  2. # Kathrynon 01 Sep 2009 at 11:30 am

    That really helped. Thanks!

  3. # vickyon 05 Nov 2009 at 9:58 pm

    im so sorry but im not understanding would you please pm me at vampgirl312 im also a player at howrse

  4. # Kton 25 Dec 2009 at 11:45 am

    Is it possible for you to make me a ready made table?… if so I would like it to have 9 text boxes and 1 main picture box!

    Thanks if this is not possible dont worry my Howrse username is Pony mad 326

    Happy Christmas :)

  5. # Terrenon 27 Dec 2009 at 10:06 pm

    I’m a bit confused, are the cells like text boxes? If so then what are the rows.

  6. # Jessicaon 28 Dec 2009 at 12:08 pm

    They are both text boxes; rows are like headers and footers and the cells are used as actual text boxes.

  7. # Nicoleon 29 Dec 2009 at 9:05 pm

    it wont work for me i tried but o need help
    my howrse name is Nicolelocin11 please pm me

  8. # HowrseFriendon 20 Jan 2010 at 4:14 am

    they dont work, i tried to get the example on my page but it didnt work AT all! D:

  9. # Jessicaon 21 Jan 2010 at 6:24 am

    I think it is because of this website as the coding seems to be okay..I’ll edit it later tonight :)

  10. # bogshall(name on game)on 16 Mar 2010 at 12:34 pm

    im so confused! please pm me on howrse, i dont get it at all

  11. # talia45on 04 Apr 2010 at 3:30 am

    i dont get it how do you do it

  12. # Jessicaon 04 Apr 2010 at 10:24 am

    It takes some time to fully understand it. Keep re-reading the post in short segments. Soon you’ll understand it. ;) If you have any questions, feel free to PM me on Howrse – my user name is Jessica27

  13. # Thunderon 06 Apr 2010 at 7:03 pm

    I know all the HTML stuff. I just need a good website to make layouts… :(

  14. # Jessicaon 06 Apr 2010 at 7:59 pm

    You could type it up right on yours Howrse page in the HTML mode or in Notepad. That’s how I always did it. ;)

  15. # SodaPopCutei (Devon)on 08 Apr 2010 at 7:50 pm

    this is a little confusing. I know, I’ve messaged you before on howrse, but can you maybe pm me about this, maybe a little dumbed down? My name is Soda Pop Cutie.

  16. # hopperhorseon 21 Apr 2010 at 2:56 pm

    i learning pretty quick to,but like how would you type it in wordpad? like do you enter each command in a new line? or is it all one line?

  17. # Jessicaon 21 Apr 2010 at 3:26 pm

    It could be one line, but it is much easier if it is separate lines. That way, if you have to go back, you can easily re-read the coding and find the mistake much faster.

  18. # Royal Friesianon 24 Apr 2010 at 5:53 pm

    Its will not work for me

  19. # meltskuon 14 May 2010 at 9:51 am

    It doesn´t let me post. Why?

  20. # meltskuon 14 May 2010 at 9:52 am

    Yes! Finally.

  21. # Jessicaon 14 May 2010 at 5:28 pm

    The first comment you post always goes to the pending category. Once I approve it, you will be able to post comments that are automatically approved. ;)

  22. # meltskuon 15 May 2010 at 1:59 am

    I am using these, but I don´t somehow get them organized, and I don´t see the boxes anymore. The boxes lines are white, but when I color them over, then they aren´t anymore in organization. The should be width, but theyr all like a line together. What´s wrong?

  23. # darceyon 02 Jun 2010 at 12:11 pm

    How do I insert a picture I designed from paint to my equestrians centres page?

  24. # Jessicaon 02 Jun 2010 at 12:46 pm

    Make sure the file is saved as a .jpg and upload the picture on a photo sharing website. View the picture and right click to select “copy image location”. Next go to Howrse and on the HTML mode. Use this code: . Where it says link post the image location

  25. # Eiofa12on 03 Jul 2010 at 4:09 pm

    My boxes aren’t coming up! All it says is cell one, cell two, footer, and my picture isn’t doing anything either! :’( My username is Eiofa12.

  26. # Jessicaon 03 Jul 2010 at 4:21 pm

    Sorry about that, I must have forgotten a border in the coding – I’ll fix it.

  27. # Preppy Pepsion 24 Jul 2010 at 8:05 pm

    I don’t get it at all….
    I am Preppy Pepsi on Howrse. Please PM me and try to help me.

  28. # Zippos Pistol Peteon 27 Jul 2010 at 11:53 am

    I have the basic html stuff down, thanks to you! You said that you would soon post how to put in fonts and colors, could you please tell me on howrse how to put background colors or pictures in the cells and such? Thanks-Zippos Pistol Pete

  29. # Jessicaon 27 Jul 2010 at 12:41 pm

    I already have those posted – check the Adding Extras and Quick Start HTML pages. ;)

  30. # sarahtyler354(gamename)on 03 Aug 2010 at 5:32 pm

    okay im like REALLLLY confusedd :/

  31. # Crystalgirl123on 14 Aug 2010 at 6:06 am

    Hia guys im also a player on Howrse can someone pm me for more info thanks

  32. # Crystalgirl123on 21 Aug 2010 at 6:49 am

    Im sooooooooo stuk

  33. # nicholeon 21 Sep 2010 at 3:52 pm

    i am so confused it aint even funny!! is there a easier way to do these layouts?

    so am i supposed to have a blank presentation and then start typing all these codes?

  34. # Jessicaon 21 Sep 2010 at 7:25 pm

    That’s what I do, but that takes some time. ;) It is preferable to have a blank presentation, though.

  35. # Nicoleon 24 Sep 2010 at 6:31 pm

    I typed in the layout, but it just appears as text

  36. # Jessicaon 25 Sep 2010 at 9:49 am

    It needs to be placed in the HTML mode. ;)

  37. # sting1rayon 25 Sep 2010 at 10:16 pm

    i am soo confused please pm me if you would! (:

  38. # Jessicaon 26 Sep 2010 at 10:13 am

    I’ll try to remember. :p
    Feel free to PM me if I forget.

  39. # LuffHorseson 27 Oct 2010 at 7:41 pm

    Is it possible that you could post a code with three text boxes, a picture box, and footer?

  40. # Jessicaon 30 Oct 2010 at 12:54 pm

    Hm…That should be posted in the Pre-Made Layouts page.

  41. # 18KT18on 10 Nov 2010 at 2:51 pm

    I don’t really understand how to do it. I’m not very good with HTML. :(

  42. # goldenjumper11on 19 Dec 2010 at 3:34 pm

    This explains soo much!

  43. # only star horseson 19 Dec 2010 at 4:46 pm

    i got it but i would like to know how to get a photo in it. i took i photo that was on my friends page but how do i get one of my own please pm me on howrse me name is only star horses.

  44. # Basshunteron 21 Dec 2010 at 9:35 pm

    what would sites are best to use for creating them?

  45. # Jessicaon 24 Dec 2010 at 10:47 am

    I don’t know of any sites to ‘create layouts’. I just taught myself HTML and memorized the coding. Just type it up on Howrse – that way, you can check to see in the normal mode if the code is turning out right.

  46. # Nadiaon 29 Dec 2010 at 11:34 am

    wow, this really helped me! thanks!
    but i have a question: before uploading the layout on howrse, what is a good thing to practice on?? (example: microsoft word)

    by the way, my username on howrse is: eeyore991

  47. # Jessicaon 29 Dec 2010 at 8:02 pm

    The coding can be posted anywhere, but it’s best to use Howrse. That way, you can see what the layout actually looks like instead of just the coding. Post the code in the HTML mode and check it in normal mode before saving.

  48. # Caylorstables25on 17 Jan 2011 at 5:13 pm

    I can’t make a layout. This is so confusing!

  49. # Eiofa12on 17 Jan 2011 at 6:24 pm

    It’s coming out good except the cells and picture boxes are all in a row, and not the picture on top of the cells. I’m using this on U.S. Howrse. My username is this name.

  50. # Eiofa12on 17 Jan 2011 at 6:34 pm

    Never mind I fixed it but now it won’t let me save my presentation because the “You have the incorrect HTML code” message is coming up =(

  51. # Godsgirlcharison 18 Jan 2011 at 12:04 pm

    HI! :D I’m just wondering if you could do it for me because I have tried so many times but I can’t do it well. If you don’t do this type of stuff (doing it for other people) then I sincerely apologize but do need a lot of help. My Username on Howrse is Godsgirlcharis () CharisUchiha

  52. # Billycoolon 22 Jan 2011 at 7:39 pm

    Ok I will have to keep reading through i am no good at this its like EXL ha codes and data :(. I have to do this because i want to make my own layout.

    Thanks It has helped out.

  53. # jerseygurl16on 27 Jan 2011 at 6:51 pm

    can you give me HTML lessons on howrse? I’m jerseygurl16, PM me!

  54. # 563521987on 19 Feb 2011 at 8:23 pm

    hiya, I really want to learn how to make these, but i’m a little blond and this isn’t working for me. :( Please PM me on howrse, I am 563521987.
    Thank you,
    Hailey

  55. # ishaishorsemadon 26 Feb 2011 at 1:00 pm

    Hi!I use your website alot, and I have found this one of the most useful things I have evr learnt.I thought creating a layout would be extremly hard, but the way you have clearly explained everything is excellent-I have tried what you said and it actually works!(this is comeing from a technology dud…=D)Thanks again!

  56. # TashaDon 02 Apr 2011 at 7:53 pm

    Hey. how do you make a transparent scroll box on top of an image? thanks.

  57. # Jessicaon 02 Apr 2011 at 7:56 pm

    That will be added soon. ;)

  58. # Annie's Girlon 03 Apr 2011 at 9:05 pm

    Thnx.really helped

  59. # Irisison 20 Apr 2011 at 4:36 am

    Wow this is awsome thanks!!!

  60. # kristirhongon 27 Apr 2011 at 11:22 pm

    What site did you use, Jessica, that taught you how to write HTML?

    Thanks.

  61. # Jessicaon 28 Apr 2011 at 11:15 am

    Basically just various sites on the internet; it wasn’t all from one source.

  62. # Rayray2343on 28 Apr 2011 at 5:44 pm

    Im a little confused??? and i put up the layout i put the pic in and everything but how do you darken the bark ground thin the cells or room thingys??

  63. # missamanda12on 01 May 2011 at 4:20 pm

    i am having a hard time doing this.

    Can you pm me

    Howrse username:missamanda12

  64. # Pinklady98on 29 May 2011 at 4:12 pm

    sorry but i so dont get this??

  65. # Sarahon 01 Jun 2011 at 4:16 am

    can you pm me please my username on howrse is Nongrak i dont really understand this i tryed it but it doesnt work please help!!!

  66. # AMORRon 04 Jun 2011 at 6:01 pm

    so cells are text boxes… what is a footer exactly? and how would you make the scrolly boxes?

  67. # BlueBell0422on 08 Jun 2011 at 11:56 am

    I’m having trouble, I don’t get it. Please PM me, my name is my username on howrse.

  68. # Kaleyon 14 Jun 2011 at 1:52 pm

    i don’t get it?/ (i’m a blonde :])

  69. # Jessicaon 14 Jun 2011 at 7:07 pm

    a footer is still just a cell. it’s used as a spot to put credit. Scroll boxes should be on the next tutorial page.

  70. # samantha_grayson21on 17 Jun 2011 at 7:22 pm

    i dont understand that at all please pm me if you would my name is my username on howrse

  71. # porterron 17 Jun 2011 at 7:56 pm

    how do you set a picture as a background for a cell instead of just a color?

  72. # Aregorn337on 17 Jun 2011 at 10:22 pm

    I am confused too! If you have time, could you please PM me, I am Aregorn337 on howrse. I have tried it, but it is not working for me at all.

  73. # SupperAwesomeSon 20 Jun 2011 at 5:17 pm

    i still dont understand

  74. # SupperAwesomeSon 20 Jun 2011 at 5:30 pm

    where do the boxes come from

  75. # Marsha Mellowon 29 Jun 2011 at 12:25 pm

    I’m having trouble understanding….
    what is the cell code? I cant find it!
    I looked all over this website and I STILL couldn’t find out what it is!
    PLEASE HELP!

  76. # Jessicaon 29 Jun 2011 at 12:31 pm

    A cell is the same thing as a text box. Therefore, the coding is the same. I can’t show coding in comments, but you can find the text code on this page.

  77. # MarshMellowson 29 Jun 2011 at 5:53 pm

    Hello! I read it a few times but I didn’t understand it. I am a player on howrse and please mail me on how to do it right and my name on their is kitties4eva .

  78. # Caylorstables25on 30 Jun 2011 at 8:10 pm

    I am so confused. I wanted to learn how to make layouts for over 5 years and I just don’t get it! I’m really good with graphics and stuff, but this is so confusing! I don’t understand how you got all the tr and td crap! I’m confused. Please PM me on howrse at the following:

    Caylorstables25

    Thanks

  79. # Ilonieka1on 06 Jul 2011 at 9:48 pm

    I just mad my first layout. Thank you so much!

  80. # Ilonieka1on 11 Jul 2011 at 4:19 pm

    What programs do you use to make these or do you do it on howrse?

  81. # EverLoveon 12 Jul 2011 at 11:08 am

    I don’t understand either. It didn’t work. My name on Howrse is EverLove.

  82. # hippygurl639on 10 Aug 2011 at 4:43 pm

    I’m confused!!!!!!!! the error message keeps coming up!!!! help! pm me plz! hippygurl639

  83. # Norseon 11 Aug 2011 at 11:18 am

    Press save twice! It will fix the HTML for you and save/work the second time :)

  84. # Magda13on 13 Aug 2011 at 4:59 am

    Does it work now?

  85. # azbycdon 18 Aug 2011 at 11:13 pm

    I can’t get the colspan part, it only shows up as one cell no matter what.
    Look at the bottom of my page to see my problem.
    Please PM me on howrse my username is azbycd

  86. # azbycdon 18 Aug 2011 at 11:21 pm

    Now when I try to save it, the error messsage pops up and I tried saving twice. : (

  87. # Lillyon 21 Aug 2011 at 7:26 pm

    Helpful

  88. # Horsebreeder!on 28 Aug 2011 at 8:41 pm

    Hi, i was wondering how to make the likethe with and the height of the text boxes im really havibg trouble like know where they should be or how to do it

  89. # Three's Peppyon 29 Aug 2011 at 2:37 pm

    I copied the second code…the one with the picture and two cells. It didnt have scroll boxes though. It had the picture and then the two cells next to it saying cell one && cell two. Was that supposed to happen?? :/ So yeah, my thing looked like this:

    .
    cell number one
    cell number two

    Please help!? I really wanna make my own layout!

  90. # Barrellifeon 01 Sep 2011 at 4:57 pm

    hi i dont really understand this its really confusing for me if you can, can you pm me on howrse ill try it out thank you for the site im sure it helped a lot others :D

  91. # blueheart123on 16 Sep 2011 at 11:31 pm

    i dont get it please help me can you pm me at blueheart123 please.

  92. # misticdragonon 01 Oct 2011 at 11:37 am

    What site do you use for layouts? PM me please! my username is misticdragon

  93. # Twin2girlson 01 Oct 2011 at 12:04 pm

    Horseinfo.com helps for layouts. Howrse helper is WAY better for infotmation though.

  94. # saraht12on 04 Oct 2011 at 7:42 pm

    Hi, These do not work for me. please PM me saraht12

  95. # fatlittleponyon 06 Oct 2011 at 3:40 pm

    What do you mean the carrot symbols :S

  96. # Jessicaon 08 Oct 2011 at 2:24 pm

    By carrot symbols, I mean the greater than and lesser than arrows:

  97. # horselover number1on 15 Oct 2011 at 7:38 pm

    Picture goes here.

    cell number one

    cell number two

    Footer

    doesn’t work the way yo showed it >8(

  98. # iarieon 23 Oct 2011 at 2:06 pm

    I get the fisr table to work, and then I typed in the second table, an no dice, Then I copied and pasted it and it didn’t work. i think it was the colspan code that wasn’t working, because the picture box wasn’t expanding the length of the cells. Ideas??

  99. # edenlore1234on 24 Oct 2011 at 5:06 pm

    This is very confusing. Please PM me on HOwrse as edenlore1234

  100. # mr brian1on 02 Nov 2011 at 11:49 pm

    I really dont get it? Could you put it in english please! PM me mr brian1 on howrse if you can make me a layout.

  101. # bethieon 20 Nov 2011 at 12:41 pm

    im so sorry but im confused,
    now we have the codes to put a table in, where do i enter the codes??

  102. # pinkpaw3on 22 Nov 2011 at 1:20 am

    I have no idea how to start makeing a layout. And I don’t really get all the codeing. lol…. sorry if I’m being annoying…I just dont get it! PLEASE pm me on howrse.
    User name for howrse:
    pinkpaw3

  103. # Jessicaon 23 Nov 2011 at 6:58 pm

    HTML mode on your profile

  104. # twinklle33on 20 Dec 2011 at 1:19 pm

    hello i am having trouble i dont get theses stupid codes i am struggling to understand and when i copy them what other people are telling me to do they are just coming up on the skreen with the code i dont my head in
    please help!!!!!

  105. # Jessicaon 21 Dec 2011 at 12:19 am

    Go to the HTML mode and paste the code there. You must click the button to switch modes.

  106. # Blew Nighton 24 Jan 2012 at 12:25 am

    Okay, so I am trying to do this, but i don’t understand ANYTHING about it! Can you help? I know what it is saying, but when I go to do it, I can’t do it. I don’t know how, i have read several tutorials now, but it doesn’t seem to help.

    PLEASE HELP ME!!
    Please Email me at [blew.night98@gmail.com]
    Thanks!

Trackback URI | Comments RSS

Leave a Reply