How to Use the State Template Package

This document is for webmasters who are converting their website to the California state template for the first time -- or who are creating a new website. If you have already converted your website using code v1.0, or if you are in the middle of the conversion, please read the instructions on how to upgrade to v1.20.

Please read the complete set of instructions below prior to making any changes. Line numbers are provided for guidance, however, our numbers might vary from yours depending on the size of your window and whether or not you have added, modified or deleted lines of code.

Create your test web site
Download the template package V1.20 (zip) - Unpack template package into a root directory such as htdocs
Configure web server to process SSI
MASTER TEMPLATE

Copy "CAtemplate.html" and rename to create your department master template. Configure to fit your needs.
- Change <title> and meta tags to suit your department.
- Line 56: Select one or two level navigation, (notice available options are commented out, active option is in line 56).
- Line 64: Select one, two or three column content layout, (notice available options are commented out, active option is in line 64)
- Line 79: Select color scheme, (notice available options are commented out, active option is in line 79)
- Line 93: Change the active tab value on each page to reflect the appropriate navigation tab value. Change this value to match the name of the page as listed in your navigation.
  - var defaultMainList = "Home";
HEADING

In "ssi/heading.html"
- ACCESSIBILITY Link: Create your accessibility page and update this link. View sample accessibility page.
- SEARCH: To use DTS site search please open a Service Desk ticket (916) 464-4311 to determine which tier option best suits your needs. For more information on the tiered service model please read DTS Site Search Service (pdf). The search include is called from line 19 in ssi/heading.html v1.20.
  
  
  
  Once you have opened a ticket with DTS you will receive the parameters for "site", "client" and "proxystylesheet", which you will use to customize your "ssi/search.html" file.
  
  Open "ssi/search.html" and follow the instructions (commented out) within this file to update the parameters. The resulting code should look something like this:
  
  <input name="site" value="ca_webtools" type="hidden" />
  <input name="client" value="ca_webtools" type="hidden" />
  <input name="proxystylesheet" value="ca_webtools" type="hidden" />
  
  If the search box does not appear, your server might not support SSI statements within an included file. In that case, do the following:
  1. Open the file 'search.html'.
  2. Copy its contents and paste it into 'heading.html' between the Begin and End Search comments.
  3. Delete include statement.
  To hide the radio buttons and perform only local site search, comment line 46 in the /javascript/navigation.js file, like this:
  
  //radioContainer.style.display = "inline";
- BRANDING: Replace the "heading_department.gif" with your agency branding graphic and change the alt tag. See branding samples.
  
  Line 28:
  
  <img src="images/ca_department/heading_department.gif" alt="Welcome to the State of California" />
- NAVIGATION: Build your primary navigation. Starts at line 39.
  
  NOTE: Do not delete the double <span> tags in the navigation.
FOOTER: Customize information in "ssi/ footer.html". Create your own conditions of use and privacy policy documents.
Test your master template
Copy and rename your master template to begin creating sub pages. Remember to modify line 93, active tab.
- var defaultMainList = "Home";
Populate new pages with content
Test the site
TEST AND VALIDATE
1. Run a website report to check for broken links, orphan files, missing attributes, etc.
2. XHTML Validator
3. CSS Validator

For more detailed instructions please review Dane Wilson's How to Use the Template - For Early Adopters (ppt) - January 16, 2007.