Argonne Public Templates - Version 1.4 - March 15, 2006
Release Notes
This release contains the new Argonne logo and updates to the color palette, stylesheet, and templates.
Changes in this version:
- Updated argonne.css to use lighter tint of blue in leftMenu style
This file contains some brief instructions on setting up a new site based on these templates. These instructions are not intended to be comprehensive and experience with building template-based Dreamweaver sites is assumed. A more comprehensive style guide that will document the required features, color palette, layout grid and other items is under development.
IMPORTANT! Use the division*.dwt templates to start your site.
The current implementation of the Argonne style is based on nested Dreamweaver templates. The public templates (public*.dwt) define all of the available options for your site. The division templates (division*.dwt) are based on the public templates. Within the division templates, you can selectively turn on and off the various sections of the site, like the search box or the local navigation bar, using Modify | Template Properties.
When the templates are revised, new versions of the public templates (public*.dwt) and the anl_templates directory will be distributed. Using Dreamweaver, you can reapply the public templates to your site. This will update the nested division templates and thus cascade the changes to your site. This should make updating your site easier when new versions of the templates are released.
Basic Setup
It is strongly recommended that you setup separate development and production directories (local/remote).
- Unzip the files into an empty directory. This will become your development site.
- Configure a new site in Dreamweaver pointing at the new directory.
- Customize the breadcrumb trail by editing the Library/breadcrumbs.lbi item.
- Insert your division or program name as the base link.
- Update the javascript function with the name of your server.
- For each division*.dwt template, open the file and
- Turn options on and off via the template properties window (Modify | Template Properties)
- Set the default contact, search, and site map pages for the footer links via the template properties window (Modify | Template Properties).
- Setup your local navigation bar.
- Modify the searchForm.lbi library item to point to a site-specific search, if appropriate.
- Setup custom library items for your division/program logo, menus, etc.
- Setup directory structure.
About the breadcrumbs
The Argonne Style specifies that a narrow grey bar containing a > separated breadcrumb trail appear below the main horizontal navigation bar. There are at least 3 options for implementing the breadcrumb trail.
- Hand-code the breadcrumb trail on each page. Obviously, not a desireable alternative, but possible on smaller sites.
- Use the provided javascript function. The javascript function, anlBreadcrumbs("siteURL"), calls a javascript function that parses the URL of the current page based on the directory structure, capitalizing the first letter of each directory. Each directory becomes an element of the trail, thus your directory structure must reflect the navigational hierarchy of your site (which is not necessarily a bad thing).
The up-side is that this requires no additional coding to implement and works across all brwosers. The down-side is that the directory names need to be suitable for use in a breadcrumb trail, using capital letters and underscores to show spaces. For example:
- Sample_Division_Site
- Publications
- Science_and_Technology
- etc.
This will result in URLs that look like: http://server/Science_and_Technology/index.html
- Roll your own. You are free to develop your own method for maintaining a breadcrumb trail.
Directory layout
| Directory |
Description |
| anl_templates/ |
Contains the images, javascript, and CSS used to define the Argonne Style. DO NOT add or delete anything from this directory. Future versions of the templates will replace this directory in it's entirety. |
| images/ |
Images needed for the Argonne style. |
| logos/ |
Sponsor logos and other logos. |
| plugins/ |
Icons for downloading plugins. |
| javascript/ |
Javascript for swapping in style sheets, breadcrumb trail, etc. |
| stylesheets/ |
Argonne CSS style sheets and browser-specific alternates CSS style sheets. |
| javascript/ |
Place-holder for your javascript. |
| Library/ |
Dreamweaver library files directory. Several default library items are included for the breadcrumb trail, sponsor logos and download plugin images. |
| Publications/ |
Sample divisional site files |
| Research/ |
Sample divisional site files |
| Staff/ |
Sample divisional site files |
| Templates/ |
Dreamweaver template directory. There are 2 sets of templates in this directory: public*.dwt and division*.dwt. You should use the division*.dwt templates as the basis for starting your site. |
Questions? Suggestions?
- Suggestions for improving these templates are welcome. Please contact Dana Stasiak, dstasiak@anl.gov, x2-0912.
- Questions or comments on the Argonne branding initiative should be directed to Dave Baurac in C&PA.
- Questions or comments on how to use the templates can be directed to the Argonne Webmaster community at anl_webmasters@anl.gov.
Last Update: March 15, 2006
|
