Right Column Menu Layout Template
Masthead
The font used to create the masthead logo is Impact in color #735A39. The logo was created using The Logo Creator and the file is included in the download. However, you will not be able to edit it without the program. The image itself is called from the style sheet as the background. The image used with the masthead is 480 pixels wide x 119 pixels high. You can substitute any transparent image for the logo or request the name be changed to your actual site name.
Menu
The menu allows for a section heading with links under that. If you so choose, you can add a search box to the right navigation <div> Examples of search boxes inserted into a left navigation <div> which can be adapted to the right side. Additional vertical menus from Dynamic Drive could also be used in the place of this one.
CSS
All styling for the presentation of the content is within an external style sheet. Changes in colors, font families and sizes should be made within the style sheet and NOT added as part of the html code.
Images
The images used on this page are examples only. All images should be resized within an graphics program and NOT by changing the size from within the html code. A class has been applied to the image to float it left or right. The top image has a drop shadow applied by adding it with your graphics program while the bottom image does not. Both images have a 1 pixel black border applied using a graphics program.
Lists
The bullets used as part of the content unordered lists are added via the style sheet rules. You can change to a different image of your choice but may have to adjust the margins and padding.
This is how a list will look:
- Main item
- Main Item
- Main Item
- Sub Item
- Sub Item
General Information
The masthead, top or right navigation as well as the footer can be easily converted to SSI's by following the server side include tutorial OR to a FrontPage or Expression Web include. Likewise, the template can also be converted to a dynamic web template by following the Expression Web Design Time Includes tutorial.
This template does NOT require any special web editor to use it. It should work with any of them - even a plain text editor. The templates uses a XHTML Transitional doctype which requires tags be self closing <br />or opened and closed <p></p>. Remember, if you are located in another country to change the language statement. Both the style sheet and XHTML code validate.
You are welcome to use the template for any of your projects, however, the link back to my site MUST remain. ENJOY!