VCL Templates (Skins)

Partner institutions can provide their own template or skin for the VCL site to match their own web sites.

To customize the look of the site, we need an html template. There are a few parts of the administrative areas of the site that can generate some really wide tables. If you want your template to look normal for those areas, it will need to be a variable width template to handle the horizontal scrolling. Additionally, there must be either 2 table cells in the middle of the page (one for the menu, one for the main content) or 2 div areas next to each other in the middle of the page.

Template files are placed in a “themes” directory under the scheduling directory of the VCL site.  For example, the NCSU theme (relative to the web root) is /scheduling/themes/ncsu. However, the contents of the theme are displayed by the index page that is at /scheduling/index.php. Typically, each theme has 3 directories under it: css, images, and js. It is difficult to explain how the main HTML is generated. The easiest thing to do when you are creating your theme is to use an index.html page in place of our index.php page. As an example, if your theme was named “myvcltheme”, you would use this directory structure:

/scheduling/index.html
/scheduling/themes/myvcltheme
/scheduling/themes/myvcltheme/css
/scheduling/themes/myvcltheme/images
/scheduling/themes/myvcltheme/js

All css, js, and image files referenced by index.html would reference them according to this structure. Remember that any image files referenced directly from a css file would need to be relative to that css file instead of relative to index.html.

After you create a theme, send us all of the files, and we’ll take care of converting the index.html file to what our code uses.