Account Management

E-mail

Hardware and Media

Network and Wireless

Offsite Access

Printing

Processes

Security and Passwords

Software and Tools

Systems Staff

Web Development

Home > Software and Tools > CoSATS

CoSATS: Computer Science Automated Template System

Overview

The template system was created to provide faculty and TAs the ability to create class web sites that use the University of Minnesota templates. The use of templates will help create a consistent look and feel to the class home pages, making it easier for students to navigate the site and find the information they are looking for. The templates provide an easy way to comply with the University of Minnesota Policy Regarding Publishing Information on the World Wide Web. You do not need to understand CSS or PHP to use these templates.

How it Works

To use CoSATS, place the provided index.php file in the root directory for your class web site (/web/classes/Fall-2004/cscixxxx/). This file provides the configuration variables and points to the location of the central scripts. When a browser accesses the index.php file, the central script searches the root directory for files with html extensions. The script generates a menu of links to these files. It also reads the contents of the home.html file and generates dynamic html that includes the menu along with the contents of the home.html file. The central script does not alter the contents of your original html files, it simply reads the contents and redisplays them using the University of Minnesota templates.

Directories are also displayed within the CoSATS framework so long as the link terminates with a forward slash ("/"). In case this is not desired, a link to a directory that does not include the trailing slash will display normally in the browser.

Demo

To give you an idea of what CoSATS does, check out the example class website.

Instructions

To begin using the template, download the index.php.txt file and copy it into the directory you want to template. If you have not already done so, send an email to operator@cs.umn.edu and someone will create a directory for your class home page. Make sure the file is called index.php. Then, open the index.php file in a text editor and make any necessary configuration changes. Once you have configured the index.php file, you need to create the home page. The home page should be an html file that is called "home.<file_ext>", where <file_ext> is an extension that was defined in the $MENU_EXT array.

Configuration Variables

The configuration variables are listed at the top of the index.php file; here is an overview of these options:

$CLASS_NAME_SHORT

This is the subject code and the course number of the class for which the template is being used. i.e. CSCI 4011, MATH 2243, SENG 5011. This will be used to make "Home" links for the left-hand menu, as well as in the title of the page. (The title of each page is made by concatenating $CLASS_NAME_SHORT and the title of the page that is being templated.)

$CLASS_NAME

This is a longer name for the course, such as "CSCI 4011: Formal Languages" or "MATH 2243: Differential Equations." Because this name is used in the header of the template, it should be kept under 30 characters to avoid breaking the layout.

$MENU_EXT

This variable is an array of the file extensions defining which files should be listed in the left-hand menu. It should be of the form:

$MENU_EXT = array('html', 'htm');

It defaults to:

array('html');

$TEMP_EXT

This variable is an array of the file extensions defining which files should not be listed in the menu, but should be linked as templated versions inside other files. This variable should be of the same form as $MENU_EXT. It defaults to:

array('html', 'htm');

$BG_COLOR

This is the color that is applied to the header graphic on each page. It will have an opacity of 50%, so the color you enter will not be the exact color shown on the screen.

The color can be entered in one of three forms:

Hex: #RRGGBB
RGB: rgb(rrr,ggg,bbb)
Plain English: ie. white, red, green, blue, etc.

$OPAQUE

If you would prefer a solid color background for our header, you can turn off the opacity feature of the templates by changing this variable from TRUE to FALSE.

$FG_COLOR

This is the color of the text that is written over the header graphic, so you should make sure that it has enough contrast with its background. It can be entered in the same formats as $BG_COLOR.

$EXTRA_LINKS

This variable allows you to specify additional links that will be appended to the top section of the left-hand menu. Each link should be entered in the form <a href="link.html">Link</a><br /><br /> in order to maintain proper spacing.

$EXTRA_LINKS_BOTTOM

This allows you to specify additional links that will be appended to the bottom section of the left hand menu. The links should be entered in in the form <br /><br /><a href="link.html">Link</a> in order to maintain proper spacing.

$IGNORED_FILES_LIST

This allows you to define files that should not be included in the left navigation menu. Since the left menu is generated by the files in the class root directory, only use the filename, do not include the path, for example: if you wish http://www-users.itlabs.umn.edu/classes/Spring-2006/cscixxxx/file1.html to not be in the left navigation menu, add "file1.html" to the array:

array('file1.html');

$IGNORED_FILES_TEMPLATE

This allows you to specify explicitly which files the templating system should ignore. These files will display "as is" without applying the U of M template. Files are specified in relation to the class root directory (for example: http://www-users.itlabs.umn.edu/classes/Spring-2006/cscixxxx/).

For example, to add files: "../cscixxxx/dir1/file1.html", "../cscixxxx/file2.html" use:

array('dir1/file1.html', 'file2.html');

$LEFT_NAV_LIST

This allows you to specify the left navigation menu explicitly by providing a list of files in the class root directory (for example: http://www-users.itlabs.umn.edu/classes/Spring-2006/cscixxxx/).

If this is specified, only files which exist will be added to the left navigation menu (to prevent broken links). Also, files in the class root directory not specified in the list are not added to the left navigation menu. The menu appears in order specified by the list. If this list is unspecified, an alphabetical menu of files in the class root directory is used.

For example, to for a left navigation menu containing: "../cscixxxx/file1.html", "../cscixxxx/file2.html", use:

array('file1.html', 'file2.html');

Suggested File Names

To increase the uniformity across the different class pages, we recommend the use of the following file names so each class page has a similar menu on the left side of the browser. Place your announcements in the home.html file, this way the default content will be the announcements page.

assignments.html
exam information.html
final projects.html
help.html
labs.html
notes.html
office hours.html
related links.html
schedule.html
syllabus.html

We also recommend that you include links to the class bulletin board and to GRIT. To do this add the following to the $EXTRA_LINKS variable.

$EXTRA_LINKS = '
<a href="https://wwws.cs.umn.edu/grit/">Check Grades</a><br /><br />
<a href="<url for phorum>">Bulletin Board</a><br /><br />';

File Permissions

We recommend that you set the permissions for your html files to 664. Make sure that all of your directories are set to 775. We also recommend that you set the sgid for group permissions on your directories. By setting the sgid, any file that is added to the directory will be owned by the group that owns the directory. Example:

%chmod 664 index.php
%chmod 775 dir
%chmod g+s dir

When systems staff creates a new directory for a class web site, they create a group for that site, e.g. F04C4211. They usually set the ownership of the directory to the professor's username with group ownership set to the new group created for the class. The permissions for the root directory of the class site should be set with 775 permissions and the sgid bit on. Following these conventions restricts write access to the professor and TAs who have been added to the class group. By setting the sgid bit, any file added to the directory will be owned by the group that owns the directory. If the sgid bit is not set, the file will be owned by the users default group, for most TAs this group is "grad." If the file is writable by group and the group owner is grad, all grad students will be able to modify the file.

Valid HTML

We strongly encourage the use of W3C's Markup Validation Service. This service will automatically check your page for any invalid HTML syntax. Invalid HTML syntax will lead to problems with your page rendering correctly in the end user's browser. It also can lead to accessibility problems in which screen readers are unable to navigate the page. The University has a policy on Accessibility of Information Technology that must be adhered to on all web sites.

Robot Exclusion

If you would like to exclude robots from indexing certain files in your class home page, you can add a META tag to the top of the html file you wish to exclude.

<META NAME="ROBOTS" CONTENT="NOINDEX">

If you do not want the links in the document to be followed by the robot, use the following META tag instead:

<META NAME="ROBOTS" CONTENT="NOFOLLOW">

If you do not want the page indexed and you do not want the links in the page to be followed, you can combine the tags into one:

<META NAME="ROBOTS" CONTENT="NOINDEX,NOFOLLOW">

For more information, see the W3C's documentation on robots.

Cascading Style Sheets (CSS)

CSS is used to define the presentation of a web page. You can use it to define font styles, font sizes, colors, etc. CoSATS allows you to use your own style sheets. The index.php file grabs any stylesheets associated with the document it is templating. The styles for each page are applied in the following order:

Stylesheets linked from document (<link rel... />)
Inline styles in the document (<style>...</style>)
The umn.css stylesheet
The umnglobalbkgimg.css stylesheet

Each consecutive stylesheet can override styles declared in the previous stylesheet. Since the umn.css and umnglobalbkgimg.css stylesheets only define the template layout and the basic text structure (h1-h6 sizes, fonts, etc.), you can still control the final presentation of the templated files.