Beyond reproducing the Project Light look, Ucampas adds a number of features of its own that are not part of the plain house style. This page demonstrates or documents the most useful ones. They are activated either by special <div class="ucampas-…"> placeholders in the page body, or by parameters in a uconfig.txt file.

Table of contents

The floating box on the right of this page was produced by placing

<div class="ucampas-toc right"></div>

near the top of the body. Ucampas fills it with links to the <h2>/<h3> headings on the page. Drop the right class for a full-width table of contents instead of a floating one.

In-page tabs

A

<div class="ucampas-tabs"></div>

placeholder is replaced by a set of tabs generated from the navigation tree below the current page, so that a group of child pages can be presented as tabbed panels on a single page. The tabstop, tabtop and related parameters control which part of the tree is shown.

Automatic file listings

To list a set of files (for example downloadable PDFs) together with their sizes and modification dates, without maintaining the list by hand, use:

<div class="ucampas-filelist">'handouts/*.pdf'(dates=1, clusteryears=a)</div>

Ucampas expands the shell glob pattern at build time and keeps the listing up to date automatically whenever the page is rebuilt.

Including shared text

Shared fragments can be pulled into several pages from a single source file, so that a change needs to be made only once:

<div class="ucampas-include-html">'../shared/notice.html'</div>
<div class="ucampas-include-text">'../shared/address.txt'</div>

Any ucampas-… placeholders inside the included HTML are processed as well.

Lead image

To give a page a lead image, shown recessed across the top of the main content column above the body text, simply drop an image file named img-lead.jpg (or img-lead.png / img-lead.gif) into the same folder as the page. Ucampas detects it automatically and inserts it, scaled to the column width, so no markup is needed in the page body. For a JPEG, any comment stored in the file (for example with wrjpgcom) is used as the image’s alt text.

Such an img-lead.* file applies to every page in its folder. To give just one page its own lead image, name the file after that page instead: page-img-lead.*, for example index-img-lead.jpg for the folder’s index.html, or report-img-lead.jpg for report.html. A page-specific image takes precedence, while a plain img-lead.* still serves as the shared default for the remaining pages.

The “with picture” template variants show the result.

Colour themes

Project Light offers six colour themes. Select one for a page or a whole subtree from its uconfig.txt file, either on the style line

style=ucam2012(colours=turquoise),

or separately, so that it can be inherited independently of the style switch:

ucam2012=(colours=turquoise),

The available theme names are blue, turquoise, purple, green, orange and red. (These example pages use red.)

By default Ucampas builds a local footer containing a copyright line, the page author, and any access restrictions. You can replace it with your own multi-column footer using the local_footer parameter, whose value is a list of columns given in PlexTree element notation:

local_footer=(
  ((*h3('Contact us'),
    *p('William Gates Building', *br,
       'JJ Thomson Avenue', *br,
       'Cambridge, CB3 0FD'))),
  ((*h3('Follow us'),
    *ul(*li(*a('Twitter', href='https://twitter.com/Cambridge_CL')),
        *li(*a('YouTube', href='https://www.youtube.com/user/CambridgeComputerLab'))))),
  (), (),
),

To keep the standard footer but add something before it (for example an accreditation badge), use footadd; to remove the local or global footer entirely, use local_footer=0 or global_footer=0.