This is additional text that can be put in the sidebar.

Make sure the text is wrapped in a paragraph tag so the margins are applied correctly.

To make a box like this, assign the "sidebarlt" class to your paragraph.

To make a box like this, assign the "sidebardk" class to your paragraph

This image has the "fltrt" class applied.

 

If your image extends below your text, include a <br/> with the "clearfloat" class applied.

Page with no intro image

As you can see, there is no image above the content.

This is a text link

Image Floated Left

Dreamweaver CS3An image with the assigned class "fltlft" will be aligned with the left edge of the content div, with a 15 pixel right margin and a 10 pixel bottom margin.

Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio. Donec et ipsum et sapien vehicula nonummy. Suspendisse potenti. Fusce varius urna id quam. Sed neque mi, varius eget, tincidunt nec, suscipit id, libero. In eget purus.

Image Floated Right

A Laptop ComputerAn image with the assigned class "fltrt" will align with the right margin of the content with a left margin of 15 pixels and a bottom margin of 10 pixels.

Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio. Donec et ipsum et sapien vehicula nonummy. Suspendisse potenti. Fusce varius urna id quam. Sed neque mi, varius eget, tincidunt nec, suscipit id, libero. In eget purus.

H2 level heading

The H2 tag is defined as 18 pixel Arial or Helvetica font. To change the font style, simply go into the #mainContent H2 entry in the CSS panel and define a new font.

It is also styled with a solid bottom and left 2 pixel border and a 5 pixel bottom padding to separate the border from the text.

H3 level heading

The H3 tag is defined at 12 pixel font and inherits the font style from the body tag.

An Unordered List

Unordered lists are styled with a 5 pixel bottom margin.

  • This is a list item
  • This is another list item
  • This is the third list itme

This is a Blockquote.

The blockquote CSS defines the background color, borders and the left and right margins, and the left and right padding inside the box. The #mainContent p selector controls the top and bottom padding around the paragraphs inside the blockquote tag.

To Extend this Template

Here are some suggestions for creating the ultimate website from this template.

  • Database integration - to easily create a website powered by a database, check out DataAssist or Essential Suite.
  • User Registration and User Profile management - Security Assist
  • Build a CMS to update your site via your browser, use DataAssist and iRite or get the Dynamic Suite
  • To easily integrate Google map either from an address you type in or from a database, try Pro Maps for Google
  • To integrate a shopping cart system, check out: eCart.
  • To easily validate form input and cut down on spam, take a look at Validation Toolkit
  • For other excellent Dreamweaver extensions that are too numerous to mention, check out this site, this one and this one too. And don't forget about our sweet extension collection on JustDreamweaver.com.

Get free Dreamweaver templates and extensions at JustDreamweaver.com