Changes between Version 1 and Version 2 of Training/Section02

Timestamp:

12/29/09 20:35:56 (16 years ago)

Author:

cfgrok (IP: 64.30.223.5)

Comment:

Converted unordered lists to ordered lists -- standardized header usage

Training/Section02

@@ -11 +11 @@
 Click on the This Template link and our template will display in your browser. This template can be portioned off into 6 sections:
 
- * Navigation – Contains the logo and the navigation
- * Primary Content – Contains the general content for the user
- * Secondary Content – Contains any secondary content in a 2 column format
- * Footer – Contains footer content
- * Message Box – Contains messaging to notify the user of status or error conditions
- * Master Page – Contains the general page layout structure and includes the above 4 elements.
+ 1. Navigation – Contains the logo and the navigation
+ 2. Primary Content – Contains the general content for the user
+ 3. Secondary Content – Contains any secondary content in a 2 column format
+ 4. Footer – Contains footer content
+ 5. Message Box – Contains messaging to notify the user of status or error conditions
+ 6. Master Page – Contains the general page layout structure and includes the above 4 elements.
 
 [[Image(training02-1.png, nolink)]][[BR]]
 '' The above diagram shows the content sections and the file in which each will reside ''
 
-=== Making the Modules ===
-
- * Open the file /template.html and review the contents. Each section has been marked out for you with HTML comments. For example, the following section of code indicates the boundaries for the specific content.
- * Create a new file using the name indicated (views/layout/Layout.Navigation.cfm) and copy the content in between the comments into the newly created file. Do this for each section.
+== Making the Modules ==
+
+ 1. Open the file /template.html and review the contents. Each section has been marked out for you with HTML comments. For example, the following section of code indicates the boundaries for the specific content.
+ 2. Create a new file using the name indicated (views/layout/Layout.Navigation.cfm) and copy the content in between the comments into the newly created file. Do this for each section.
 
 '' Example of the boundaries for specific content ''
@@ -40 +40 @@
 }}}
 
-=== One Master to Rule Them All ===
+== One Master to Rule Them All ==
 
 Open /PlantOMatic/views/layout/Master.Layout.cfm and review the code. Master.Layout.cfm contains !ColdFusion and HTML source code and represents the high level structure of our application – it is primarily in charge of assembling our content modules. We get our content from the !ViewCollection and output it on the screen. The calls to the !ViewCollection are together at the top of the file:
@@ -65 +65 @@
 }}}
 
-=== Putting it all Together ===
+== Putting it all Together ==
 
 Our last task in skinning is to create a reusable mechanism to use our layout. Model-Glue 3 introduces the concept of an Event Type. Much like Types in Object Oriented Programming, an Event Type contains specific behavior and is addressable by a specific name. Event Types in Model-Glue can contain behavior that is executed BEFORE, AFTER or BEFORE and AFTER an Event is executed. 
@@ -112 +112 @@
 }}}
 
-=== A Flexible One Column Template ===
+== A Flexible One Column Template ==
 
 Now, when we run our application at [http://localhost/PlantOMatic/ http://localhost/PlantOMatic/] we see our template in action:
@@ -119 +119 @@
 '' One Column Layout ''
 
-==== What about Two Columns? ====
+== What about Two Columns? ==
 
 To see the benefits of this flexible template, let's add a piece of secondary content. Open /PlantOMatic/config/ModelGlue.xml and update the default Event Handler to have an include for secondary:
@@ -136 +136 @@
 Now when our Event Handler runs, Model-Glue will include the secondary content inside of the ViewCollection. Since we test for the existence of secondary in /PlantOMatic/views/layout/Master.Layout.cfm and adjust the HTML markup accordingly, the simple presence or the absence of secondary in the ViewCollection will turn our layout from a single column to a two column layout seamlessly.
 
-=== A Flexible Two Column Template ===
+== A Flexible Two Column Template ==
 
 [[Image(training02-3.png, nolink)]][[BR]]
 '' Two Column Layout ''
 
-==== Housekeeping ====
+== Housekeeping ==
 
 We have a few items to take care of before we move on.
 
- * Open /PlantOMatic/views/layout/Layout.Navigation.cfm and replace the content:
+ 1. Open /PlantOMatic/views/layout/Layout.Navigation.cfm and replace the content:
 
 {{{
@@ -162 +162 @@
 }}}
 
- * Open /PlantOMatic/views/layout/Layout.MessageBox.cfm and replace the content:
+ 2. Open /PlantOMatic/views/layout/Layout.MessageBox.cfm and replace the content:
 
 {{{
@@ -185 +185 @@
 }}}
 
-=== Section 2 Summary ===
+== Section 2 Summary ==
 
 In this section, we learned how to skin a static template, work with the Model-Glue framework to create a flexible layout and configure our Event Handlers for templating. For more information, we suggest the following documentation: