2 files changed, 27 insertions, 6 deletions
diff --git a/demos/quickstart/protected/pages/Controls/Samples/TWizard/Sample2.page b/demos/quickstart/protected/pages/Controls/Samples/TWizard/Sample2.page
index 727179bd..ea01e320 100644
--- a/demos/quickstart/protected/pages/Controls/Samples/TWizard/Sample2.page
+++ b/demos/quickstart/protected/pages/Controls/Samples/TWizard/Sample2.page
@@ -12,6 +12,8 @@
 		SideBarStyle.Width="100px"
 		SideBarStyle.Height="100px"
 		SideBarStyle.BackColor="#507CD1"
+		SideBarStyle.HorizontalAlign="Center"
+		StepStyle.HorizontalAlign="Center"
 		NavigationStyle.HorizontalAlign="Right"
 		NavigationButtonStyle.BackColor="White"
 		NavigationButtonStyle.BorderColor="#507CD1"
diff --git a/demos/quickstart/protected/pages/Controls/Wizard.page b/demos/quickstart/protected/pages/Controls/Wizard.page
index 3034c0c6..0de4a44a 100644
--- a/demos/quickstart/protected/pages/Controls/Wizard.page
+++ b/demos/quickstart/protected/pages/Controls/Wizard.page
@@ -5,7 +5,7 @@
 
 <h2>Overview</h2>
 <p>
-<tt>TWizard</tt> is analogous to the installation wizard commonly used to install software on Windows. It splits a large form and presents the user with a series of smaller forms, called wizard steps, to complete. The following figure shows how a wizard is composed of when presented to users, where <tt>step content</tt> is the main content of a wizard step for users to complete, <tt>header</tt> refers to header content common to all steps, <tt>navigation</tt> contains buttons that allow users to navigate step by step, and <tt>side bar</tt> contains a list of hyperlinks by which users can reach to any step with one click.
+<tt>TWizard</tt> is analogous to the installation wizard commonly used to install software on Windows. It splits a large form and presents the user with a series of smaller forms, called wizard steps, to complete. The following figure shows how a wizard is composed of when presented to users, where <tt>step content</tt> is the main content of a wizard step for users to complete, <tt>header</tt> refers to header content common to all steps, <tt>navigation</tt> contains buttons that allow users to navigate step by step, and <tt>side bar</tt> contains a list of hyperlinks by which users can reach to any step with one click. The visibility of the side bar can be toggled by setting <tt>DisplaySideBar</tt>.
 </p>
 <img src="<%~wizard.gif%>" alt="components of wizard" />
 
@@ -40,7 +40,7 @@ In the above, <tt>StepType</tt> refers to the type of a wizard step, which can a
   <li><tt>Start</tt> - the first step in the wizard.</li>
   <li><tt>Step</tt> - the internal steps in the wizard.</li>
   <li><tt>Finish</tt> - the last step that allows user interaction.</li>
-  <li><tt>Complete</tt> - the step that shows a summary to user (no interaction is allowed).</li>
+  <li><tt>Complete</tt> - the step that shows a summary to user. In this step, both side bar and navigation panel are invisible. Thus, this step usually does not allow user interaction.</li>
   <li><tt>Auto</tt> - the step type is determined by wizard automatically.</li>
 </ul>
 
@@ -55,15 +55,34 @@ In this sample, we use wizard to collect user's preference of color. In the firs
 
 <h3>Customizing Wizard Styles</h3>
 <p>
-<tt>TWizard</tt> defines a whole set of properties for customization of its various components as shown in the above figure. In particular, the following properties are provided:
+<tt>TWizard</tt> defines a whole set of properties for customization of appearance of its various components as shown in the above figure. In particular, the following properties are provided for style customization:
 </p>
 <ul>
-  <li>Header - <tt>HeaderText</tt>, <tt>HeaderTemplate</tt>, <tt>HeaderStyle</tt>.</li>
+  <li>Header - <tt>HeaderStyle</tt>.</li>
   <li>Step - <tt>StepStyle</tt>.</li>
-  <li>Navigation - <tt>NavigationStyle</tt>, <tt>StartNavigationTemplate</tt>, <tt>StepNavigationTemplate</tt>, <tt>FinishNavigationTemplate</tt>, <tt>StartNextButtonStyle</tt>, <tt>StepNextButtonStyle</tt>, <tt>StepPreviousButtonStyle</tt>, <tt>FinishPreviousButtonStyle</tt>, <tt>FinishCompleteButtonStyle</tt>, <tt>CancelButtonStyle</tt>.</li>
-  <li>Side bar - <tt>SideBarTemplate</tt>, <tt>SideBarStyle</tt>, <tt>SideBarButtonStyle</tt>, <tt>DisplaySideBar</tt>.</li>
+  <li>Navigation - <tt>NavigationStyle</tt>, <tt>StartNextButtonStyle</tt>, <tt>StepNextButtonStyle</tt>, <tt>StepPreviousButtonStyle</tt>, <tt>FinishPreviousButtonStyle</tt>, <tt>FinishCompleteButtonStyle</tt>, <tt>CancelButtonStyle</tt>.</li>
+  <li>Side bar - <tt>SideBarStyle</tt>, <tt>SideBarButtonStyle</tt>.</li>
 </ul>
 <com:RunBar PagePath="Controls.Samples.TWizard.Sample2" />
 
+<h3>Customizing Wizard Navigation</h3>
+<p>
+Bidirectional,
+Unidirectional,
+Non-linear
+</p>
+
+<h3>Using Templates in Wizard</h3>
+<p>
+</p>
+<ul>
+  <li>Header - <tt>HeaderTemplate</tt>.</li>
+  <li>Navigation - <tt>StartNavigationTemplate</tt>, <tt>StepNavigationTemplate</tt>, <tt>FinishNavigationTemplate</tt>.</li>
+  <li>Side bar - <tt>SideBarTemplate</tt>.</li>
+</ul>
+
+<h3>Using Templated Wizard Steps</h3>
+<p>
+</p>
 
 </com:TContent>
 \ No newline at end of file