Setup Guide V1 (last updated January 4th, 2007)

Designed for the Gen7 Series Templates and Modules

Adding content to web your pages:

Overview

With the basic pages now set up in your template, you can start adding content. Content would qualify as:

text
images
media
scripts

The Generation7 templates are designed using CSS (Cascading Style Sheets). CSS is basically a set of rules, which apply to the different types of things that we put on a web page. For example, if you were to open any web page, and just start typing into the main content area of that page, the 'text' would be formatted according to the rules applied by CSS, for that specific area of the page.

Depending on what it is you have placed into the page, the formatting may take shape in various forms. If it is text, the text would be formatted for:

  • font type
  • font size
  • font color
  • font weight

We can take this a step further, and apply additional rules to special font styles such as Heading tags. These CSS rules might add some additional formatting such as  " C h a r a c t e r " spacing for visual effect, padding that would indent the text, or even a background image.

If you were to apply an (H1) tag to text, within that same area, additional CSS 'rules' would be applied, and the text would be formatted according to the rules for (H1) tags, within that specific area of the page. Confused so far? Not to worry, watch the video on working with the CSS style sheets and you'll learn how to modify the properties of your fonts, site wide!

Sections:

  • flash header

  • menu area (usually the left side of the page)

  • body1 (the main content center of page)

  • body2 (text box on left or right side of page)

  • body3 (additional content positioned under the body1 content)

  • site information (footer, or very bottom of the page)

Elements with these sections:

  • menu buttons

  • regular text content

  • special text headings (H1 - H6 tags)

  • hyperlinks

The intermediate tutorials go into detail of how to modify the CSS style sheet, so you can change the font properties site wide.

Content to DWT pages

Our package_A templates for use with FrontPage 2003 / Expression Web, and our package_B templates for use with Dreamweaver are designed with DWT template pages (Dynamic Web Template).

The advantage of working with a DWT are many.

To learn about Dynamic Web Templates (DWT's), click on the links below to read an excerpt from the Microsoft website, or watch the video about Dynamic Web Templates:

As our template packages also use 'include' or 'Library' components, the DWT may not ever come into play with the exception of the editable and 'non-editable' regions a DWT creates on it's child pages.

A DWT has the ability to 'lock' out specific area's on the child pages. This helps from 'bumping' or nudging something on the page, basically throwing it out of alignment. The DWT allows for content in the assigned 'editable' regions to be editable, and anything not in an assigned 'editable' region can ONLY be modified by editing the (compact.dwt, fullscreen.dwt or index.dwt) master pages.

You can create as many additional DWT pages as you need, and you can also attach any existing DWT child page, to another DWT master page.

In the intermediate tutorials, we'll go into greater detail of how to create a new DWT page, for the purpose of creating a page with additional menu's and sub menu's.

Here's and example of what you will see when editing a web page attached to a DWT:

Note the 2 yellow arrows. The arrow on the left points to the 'non-editable' region icon, and the arrow on the right points to the 'orange' or for DW 'green' border that surrounds the 'editable' areas. You can edit anything inside the orange or green borders. To edit the page where you see the 'non-editable' icon, you would need to edit the DWT master page directly.

(click the pic for page page view)

 
 

Back...