Thingamablog Blog

Changing The Templates

Today I will describe what I did to the templates so that they will work in conjunction with what I changed in the style sheet.

The basic idea is that I removed the positioning information from the style sheet and then put the contents of the blog in a table so that the table can arrange the content inside the boundaries of the browser. I like the way the table reformats the text better than what was coming out of the style sheet.

I started with main.template.

First, I copied all of the sidebar html above the content html. That can be recognized by the ID's "id=links" and "id="content". I did that to put the sidebar on the left side of the screen. Then, before the ID specification, <div id="links"> I added the following table specification.

  <table border="0" cellpadding="5" cellspacing="5" align="left" 
  width=100%> 
  	<tbody align="left" valign="top">
  	<tr><td width="250">

and before <div id="content"> I added the end of the left hand table cell and the beginning of the right hand cell:

  </td>
  <td>

Then after <br clear="all" /> I ended the table:

  </td></tr>
  </tbody>
  </table>

The table is directed to use 100% of the browser window, and the left hand cell, which contains the links and calendar, is set to a fixed size, so the right hand cell, which contains the contents, is formatted to fill the rest of the browser window. This puts the sidebar on the left hand side of my blog.

Moving the sidebar left to right would involve just swapping the locations of the two table cells, one containing the links html and the other containing the content html. The fixed width in the <td> tag, width="250", belongs to the cell with the sidebar.

I did that to all 5 templates, and it looks pretty good.

Next, I will create and use my custom tags to put my photo, links, and bio etc. into the blog.