How can I update my pages to use the new look?

This page links to the following resources:

  1. Overview of Available Templates
  2. Templates in Three Different Languages
  3. Graphic Tools

which will help you update your pages to use the new look.


Overview of Available Templates

The University Toolkit offers templates for the new Rutgers Look. This page offers additional templates which have been edited and wrapped into functions to be called by a scripting language.

  • How are the templates organized?

    The Toolkit offers three main types of templates:

    1. Top Level Pages (Template B1)
    2. Second Level Pages (Template C1)
    3. Content Pages (Template D)

    This page offers versions of the above templates.

  • How do these templates differ from the Toolkit?

    The following variations of the Toolkit have occurred for the templates offered on this page:

    1. The tables are of a variable width as opposed to a fixed width.
    2. The graphic files are in PNG format.
    3. Graphic title images are only required for Top Level pages.
    4. The Cascading Style Sheet has been edited to use relative font sizes as opposed to a fixed point sizes (this is better for accessibility).

  • Why use a scripting language?

    Using a scripting language to control the look of your site offers the following benefits:

    1. Consistent design:
      All of your pages are guaranteed to have a consistent look, because they all call the same set of functions. Your page can also have a look that is consistent with the University Toolkit.

    2. Efficient updates:
      You can make a change to one file and have it effect all of the pages on your website.

    3. Ease of use:
      Creating a departmental website is easy with these functions. You only need three lines of code to utilize the functions, to get a standard look for your content pages. You are then free to focus on writing your content in simple HTML. Your code will also be clean and easy to read.

Templates in Three Different Languages

  • HTML

    If you want to maintain your pages as static HTML as opposed to using a server-side scripting language we recommend that you simply follow the Toolkit.

  • PHP

    PHP templates are available for the following templates:

    Each of the above is a working example of the template.

    The Top and Second Level templates create a PHP Object. Some people find it easier to work directly with a data structure and would prefer divorce the look of the page from its content. This method is especially handy if your content is stored in a database. However, this approach may not appeal to everyone. If this is the case we recommend that you use only the Content template for your pages with lots of text and that you use the static HTML templates above for your top level pages.

    To use the PHP templates:

    1. Download depends.tar.gz.
    2. Unpack depends.tar.gz with the following commands:
        gunzip depends.tar.gz
        tar xf depends.tar
      
      then move the depends directory to a location that is readable by the web.
    3. Download template.php.
    4. Edit template.php and update the following variable on top of the file:
        $path = "../";
      
      to use the correct path for wherever you saved the depends directory.
    5. Download the following files:
    6. Use any of the above three as your template and update the variables that it declares accordingly.

  • Perl

    The Perl template only offers a version of a Content Page. A working example of the Perl template is here (its code is here).

    To use the Perl templates:

    1. Download depends.tar.gz.
    2. Unpack depends.tar.gz with the following commands:
        gunzip depends.tar.gz
        tar xf depends.tar
      
      then move the depends directory to a location that is readable by the web.
    3. Download template.pl.
    4. Edit template.pl and update the following variable in both sub definitions:
        my $path = "/..";
      
      to use the correct path for wherever you saved the depends directory.
    5. Download index.pl
    6. Use index.pl as your template and update the variables that it declares accordingly.

    Some OIT applications which were written in Perl used a similar template for the old look. The new template is backwards compatible with that template. You should be able to replace the original file with the new one (provided that you have the depends directory in place). The new template has an optional argument which is a hash of links. If you don't pass a hash of links the template will use a default link to the University Wide website.


Graphic Tools

For top level pages you should create your header as a graphic. The following tool can do this for you:

The above tool will create a header image for you in PNG format which you can save and display on your pages. It is easier to let the tool create the image for you since you can be sure that it will have the correct font and color and you won't need to use any graphics software such as Adobe Photoshop, Jasc Paintshop Pro, or The Gimp.


Return to RU Main Site
For more information contact webmaster@nbcs.rutgers.edu
Last updated: May 23, 2005, 12:43 pm