6    Look and Feel of Content Pages

The WebCT Page Editor gives you the ability to modify and enhance the pages you have added to your paths. For any page on a path, you can:


Tip: the appearance of your pages can be modified globally 
 from the homepage by clicking on the Course Settings button. 
 This allows you to define defaults for colours, counters and the 
 button bar, so that you don’t have to modify each individual 

We'll show you how to add each one of the above features to your pages in the following chapters.

The Page Editor options are displayed whenever the designer of a course views a page on the path. To view a page on the path, simply click on the title of a page when you are in the Path Editor. For this example, click on the ``What Can a Vector Do For Me?'' link. Your browser window will now divide into three frames. The top frame contains the button bar for the current page, the center frame contains the text of the page, and the bottom frame contains the designer menu options (Figure 6-1):

    Figure 6-1  Page Editor full screen

The top two frames are exactly as your students will see them. This allows you to immediately see the effects of changes that you make to your course. Let's have a closer look at the components in each of the three frames before we add some features.

The Button Bar

The button bar allows students to navigate through the path, access WebCT tools and view page-specific information (as in the examples listed at the beginning of this chapter). The button bar is divided into three sections: navigation, global tools and page-specific tools.

 The navigation options are located in the large combo-button at the left of the button bar (see Figure 6-2).

    Figure 6-2  Page Editor navigation buttons

 This large button is divided into six smaller buttons, described below:


Tip: try to keep the number of icons in the button bar to a 
 minimum so that your students don’t get overwhelmed with 


Global tools are ones which do not specifically relate to the current page. Examples of global tools are the bulletin board, e-mail, the search facility, chat, etc. These buttons appear grouped to the right of the navigation buttons. You can choose which tools you would like to include in the button bar for every page by setting a global default from the homepage. We'll see how to do this in a later chapter. Regardless of what global options you have set, you can always override the global options on an individual page by clicking on the Customize button in the Page Design menu.

The page-specific tool buttons appear grouped to the right of the Global tool buttons. Most page-specific buttons are only shown when a particular option is available for the current page. For example, if the current page does not have any self-test questions associated with it, the self-test icon is not displayed in the button bar.

A sample button bar is shown below (Figure 6-3), containing three global and four page-specific icons:

    Figure 6-3  Sample button bar

The Page Text

The center frame contains the text of the HTML page as your students will see it. As with any WWW document, the page can contain links to other pages in your course and links to other WWW sites. The page can also contain images, Java applets, or any other type of document that your students' browsers will recognize. We'll also see in the next chapter how to link words in the text to their definition in the WebCT glossary.

The example page you are looking at is probably a typical example of what standard course notes will contain: some text interspersed with images illustrating important concepts.

The Designer Menu

The bottom frame contains the designer menu toolbar for the current page. The buttons give you access to various tools and options that will enable you to add to or modify the current page. We'll look at each one of these tools in the following chapters, beginning with the glossary.

Layout Options

As discussed in Chapter 5, Ordering and Sequencing Content, the default layout of content pages can be modified using the Configure button in the Path Editor designer toolbar (see Figure 5-4). To get to the Path Editor, click on the Contents button in the designer toolbar or click in ``contents'' in the upper left large navigation button. Now click on Configure to bring up the Configure Path screen. In the Show Content Listing on Path section, click the radio button beside Yes and change the width to 250 pixels. Click Update and then click on a hyperlinked file title to see the view below (Figure 6-4).

    Figure 6-4 Sample layout with content listing

The red dot indicates the currently selected topic.

If you select a vertical button bar (Button Bar Location, Side) with no content listing the following display is the result (Figure 6-5).

    Figure 6-5  Sample layout with vertical button bar