University of Vermont

UVM Self-help Web Guide

Right Column Add-Ons

You can add many right hand column add-ons such as quick link to your departmental pages by simply creating special files and naming them in a certain way. The magicscript then will automatically "create" the box on your page by "reading" the names of the special files you have created.

Quick links

Necessary file names (these must be created exactly as they appear in order to work):

  1. News & Events: Create a file name of news_&_events.html
  2. Q & A: q_&_a.html
  3. Current Topics: current_topics.html
  4. Quick Links: quick_links.html
  5. Related Links: related_links.html
  6. To-Do List: to-do_list.html
  7. Work With Our Office: work_with_our_office.html
  8. Shortcuts To Forms & Info: shortcuts_to_forms_&_info.html

Note: There is a pre-determined order in which the various categories will appear. This cannot be changed.

Create your quick links

  1. To create Quick Links, create a file and save it as quick_links.html.
  2. In the file, create a three-column table, like the one used for defaultmenu.html. Make the number of columns 3; make the number of rows how many quick links you will have (if you want six quick links, then type in 6).
  3. An example:
1 Bailey/Howe Library
2 Registrar's Office
3 Career Services

When you're done, save the file, then transfer it over to your Zoo account.

Note: If you are linking to something off your page, you'll need to use the full URL. If you're linking to something within your site (that is, within the same folder, such as public_html), you'll just need to type in name_of_file.html (that is the name of your file, with a .html extension).

Page-level quick links

For specific pages in your site, simply append a hyphen and the file name to the name of the quick links file. For example, if you wanted to have a current topics list appear only on a single page in your site that was conferences.html. You would need to name your current topics file: current_topics-conferences.html., or if the file is in a particular folder/directory, include that in the name: quick_links-directoryname-filename.html. Note: this quick link file must be included in the same directory as your magicscript.php file (not in the directory where the page is located).

Custom quick links

While we encourage to use these six categories to provide consistency throughout the UVM Web site, you may create a customized label should the circumstances warrant it. Creating a custom quick link category is accomplished in much the same way as you would to create the standard quick link boxes, with a three-column table. In this instance, the title for your quick links box will be generated from a zero line entry, as follows:

0 My Custom Links  

Note: no entry is needed in the third column.

In order to have your custom Quick Links appear in the Quick Links area, your file name special_menu1.html. You can create as many custom categories as you wish by incrementing the number "1" (e.g. special_menu2.html). Custom Quick Links will always appear at the top of your Quick Links box when combined with the standard Quick Links (e.g. Related Links, Current Topis, etc.).

Custom content in the quick links right-hand column

You can also add custom HTML content to the quick links box on every page of your site (or at page level, as documented above). This feature allows you to include most any kind of Web content including text, images, forms, or even embedded media, but do be mindful of the fact that the quick links column is normally limited to a width of 160 pixels. Here's an example of how you can create this feature on your own page:

  1. To create custom content in the quick links area to your site, create an HTML file and save it as links_extra.html.
  2. When you're done, transfer the file over to your zoo account and set permissions, if necessary.

Right column floating "sidebars"

The above custom content in quick links area option will always find your custom content hugging the top banner, much like quick links would. Sometimes, users need to associate sidebar content more closely with something further down on the page. For these people, you can use our "right column float" code snippet to place your content appropriately. Simply copy and paste this snippet into your editor's code view and adjust the text. Note: You can also include images and other media in a right column float.

<div id="rightcolumn_float">
Enter your copy/links/etc. here.

Last modified September 14 2011 11:44 AM