In order to edit the website you will first have to get the CVS repository in which it is stored. To do so, go somewhere in your home directory and type:

export CVS_RSH=ssh
cvs -d username@caffeine.uwaterloo.ca:/u/www/cvsroot co www

Where username is your CSC user name. You will be prompted for your password (unless you use an SSH key). After a while you should have a new directory, www/, with the CSC pages in it.

You will also need libxslt and libxml (including development headers) from Gnome. In debian, apt-get install libxml2-dev libxslt1-dev.

The CSC website is compiled. This means that when you edit a page, you don't edit the HTML source directly, but instead edit a page describing the page's content (and some formatting) and then run a command to generate the HTML page from these content description pages.

To generate the CSC website, make sure you are in the directory into which you checked it out (the www/ directory) and enter

make

This will compile the whole website. After any changes you make you will have to recompile the website in the same manner.

Let's now suppose we want to add a page detailing what operating systems the CSC distributes through its CD-burning. First, we go to the appropriate directory, in this case probably www/office. Here we now open a new file called operating-systems.xml in our favourite text editor (emacs, of course). Take note that the filename ends in .xml. All CSC web pages should have this file ending.

The next thing to do is to add a few standard XML things to the file. We add the two lines:

<?xml version='1.0'?>
<!DOCTYPE cscpage SYSTEM "../csc.dtd">

Note the reference to the file ../csc.dtd. This file is located in the www/ directory, which is the parent directory of www/office/, therefore we use ../. These two lines should appear at the top of every CSC web page.

Next we start the actual page. To begin, we open a cscpage tag with the title attribute set to the title of our page. We also want to add a header with the CSC logo, the current section directory and the title of the page. Don't worry though, as you'll see this is really easy. Add the following two lines to the end of the page:

<cscpage title="Operating Systems the CSC distributes">
<header />

That's it! So we can see what our page looks like so far, we also add the footer (with the menu, generation date, and copyright information) and we close the cscpage tag. Add the following lines to the end:

<footer />
</cscpage>

Notice how in the case of header and footer we have a / before the >? This is one of the major differences between HTML and XML: tags that don't really have an end tag, such as <br> have to be specified as being empty in XML by adding a / before the >. This is particularily important to remember when you add XHTML (XML's version of HTML) to the page.

Now we want to see what the resulting HTML page looks like. But first we have to tell make about our new page. To do so, open up the file www/office/Makefile, find the line beginning with INPUTS = and simply add operating-systems.xml to the end of that line. So the line might look like INPUTS = index.html staff.xml books.xml operating-systems.xml. Save Makefile and close it. Now, in the www/ directory, type make. This will build the whole website, (hopefully!) including our little document. Once make is done, have a look at the resulting file, www/office/operating-systems.html. It should look like example 1 (use your browsers Back button to return to this page after viewing the example).

Looking at the generated page, you may have noticed that it does not yet appear in the menu at the top of the page. Opening up the special file www/office/directory.xml you will see several entries, each corresponding to one of the menu items. After the last line beginning with <diritem, add in the following line:

<diritem title=""Operating Systems" href="operating-systems.html" />

Now recompile the site with make. You should see that the page now looks something like example 2. Also note that all the other office pages will now have a reference to the new operating systems page.

With that out of the way, it's time to add some content. You may be happy to hear that you can add regular (X)HTML to any CSC web page. So, we'll add the following content between the <header /> and <footer /> of the page:

<section title="List of operating systems">
<ul>
<li><a href="http://www.debian.org/">Debian GNU/Linux</a></li>
<li><a href="http://www.freebsd.org/">FreeBSD</a></li>
</ul>
<p>More operating systems may be available.</p>
</section>

As usual, compile your changes using make and have a look. The resulting file should look something like example 3. A few things to keep in mind are:

  • Always use lower-case in your XHTML tags. XML is case-sensitive. For example: <br/> is good whereas <BR/> is bad.
  • Always close your tags. If it's a tag that never encloses anything use the <tag/> syntax. For example: <ul> <li>Item 1<br/>Linebreak</li> <li>Item 2</li></ul> is good, whereas <ul> <li>Item 1<br>Linebreak <li>Item 2</ul> is bad.
  • You must place HTML code inside <section> tags. You can have as many section as you want on the page.