Ohio University
Home

Using CommonSpot to Maintain
Ohio University Web Sites

Creating New Pages


Back   Content Contributors Home   CommonSpot Tutorials Home   Next


Table of Contents


Introduction

There are two methods for creating new pages in CommonSpot:

As you can see from the table of contents, above, we will discuss the creation of pages from scratch, then the creation of your own derived templates, and then the use of a blank page to create a new page by copying an existing page.


Create New Page (from template)


Templates

A template is the starting point for constructing a page in CommonSpot. Using templates provides a way to more easily build a site with consistent page design, and to maintain that consistency over time. The system provides a choice of templates, and you can also create your own templates, by starting with one of the system templates and adding page elements.

The CommonSpot software design works with two kinds of templates: "base templates," and "derived templates." Base templates are hand-coded by programming staff. Derived templates are layered on base templates or other derived templates, and use CommonSpot page elements and other features to add content.

A useful mental model for templates is a multi-layer overhead transparency: you start with a base layer, then add more and more items on top of it. What you and your audience see at any time is all the layers together. The figure below illustrates the relationship between base templates, derived templates, and pages built on them:

The illustration above is simplified by having only one derived template in the stack. You are likely to find it useful to have multiple derived templates, one built upon another, as the starting point for many of your pages.

At Ohio University, we are configuring CommonSpot with several different templates that are available for use by pagemasters and content contributors. The templates that are presented to you as available choices when creating a new page may include templates whose use is required, permitted, or forbidden, for that particular page. It is the pagemaster's and content contributor's responsibility to choose an appropriate template.

All official Ohio University Web pages, on any server, are required to meet specific design guidelines (including the placement of the new logo graphic mark in the upper left corner and the copyright statement at the bottom), regardless of the server they are published on. Templates are available in CommonSpot that facilitate meeting those guidelines, for use by pagemasters and content contributors building official sites. Those templates must not be used for unofficial sites.

All unofficial Web pages (student organizations, personal pages, etc.), on any server, are forbidden to use official Ohio University graphic logos (any variation of the Cutler Hall woodcut, the Intercollegiate Athletics "Attack Cat" logo, the University Seal, etc.), and must not say that they are copyright by Ohio University. Separate templates are available in CommonSpot that facilitate meeting those guidelines, for use by pagemasters and content contributors building unofficial sites. Those templates must not be used for official sites.

The "official_pages1" template is coded initially to facilitate the building of sites that are closely modeled on the Front Door design. As soon as the formal university policy on Web page design is finalized, additional render options or templates will be created as needed and made available through CommonSpot, in order to provide the full range of flexibility to CommonSpot users that is permitted under that policy to users of other servers.

The base template for use on unofficial sites includes a render option to display a link to the Front Door. Such a link is required for use on unofficial subsite home pages, and is permitted, but not required, for use on all other unofficial pages.

Because some people will be responsible for both official and unofficial subsites, you may have access to templates that must not be used for a particular page. Similarly, templates may be created and made available to you that are coded such that it is possible to change a page from official form to unofficial form by changing "render options" (discussed below). These technical possibilities do not mean that those choices are permitted.

The system programmers can revise the base template your page is built on, or you can edit a derived template, as discussed below, changing the CommonSpot elements on that particular template. In either case, the updates made to any template are reflected immediately in the display of all the pages built on top of that template, without losing the specific work on any of the pages built on that template (provided that inheritance has been preserved).

What should you do if you realize that you want to have a page that is already under construction or in production be built on a different template than the one you chose when you first created it? The following sequence of steps will be required:

  1. Start by making a new page, building it on the now-preferred template, but using a different filename (e.g., if building a replacement for "index" use "new-index"), to work with temporarily. This will start the new page from scratch.

  2. Copy any elements that you do want to continue to use from the original page (which you can still do, because it is intact), and paste them into the new page you are building. The old page will continue to be visible, undamaged, while you rebuild the new page. You must copy and paste one element at a time, until you have copied and pasted all of the elements that you want to preserve.

  3. When the new page is ready, you can rename the old page (e.g., to "old-index"), and then right away, so that there will be only a short interval of time when the page is broken...

  4. Go to the new page and rename it to the original, permanent name.

  5. Navigate to the old page, and use the "Referring Pages" choice from the "Knowledge Maps" menu to tell CommonSpot to change all links pointing to the current (old) page so that they instead point to the new replacement page. Renaming the old page in step 3 has caused all links leading to it from other CommonSpot pages that were constructed using the Page Gallery and Page Finder tools to be re-constructed to point to the renamed old version, instead of the replacement version. Be sure to click in the check-boxes for all the pages before selecting the new destination, and be sure to click on the "Save" button after selecting the new destination, in order to activate the change.

As you can see, you will not lose all your work done on the template you chose first, but the process of switching a page from one template to another is labor-intensive; CommonSpot rewards those who plan ahead carefully and select their templates thoughtfully.


Template-based Page Creation: Step-by-step

  1. Click on "Page & Template Management" icon and select "Create new page..."

  2. Select the subsite, or sub-subsite, you want the new page to be part of from the drop-down menu, if it is not already there as the default, and then click on "Next".

  3. Choose the appropriate template:

    • Expand the appropriate category, usually either "Ohio University Templates" or "Shared Templates."

    • For the reasons discussed in the last two paragraphs of the previous section, your life will be simpler if you make the correct template choice at this step, so give it some thought.

    • Initially, you may well choose the "official_pages1" template (or the "unofficial_pages1" template), because that is the only one available that meets the requirements for your pages. Later, after you or another person have saved derived templates built on the appropriate base template, you might choose one of them.

  4. Fill in the page information:

    • The new page's "name" field should include neither punctuation marks nor spaces; the URL of the new page will have the subsite (or sub-subsite) URL prepended to, and ".cfm" appended to, the name you specify. For example, if you are working in the "/demo3/" subsite, and specify a page name of "samplea", then the new page will have a URL of "http://author.admsrv.ohio.edu/demo3/samplea.cfm".

    • The page's title will be used within CommonSpot to identify the page, and the "Title-bar Caption" will be included in the HTML TITLE of the page, which is routinely the clickable text of the link leading to the page in search engine output. Therefore, exercise care in the choice of each. To the extent possible, choose a page title and title-bar caption that is unique among your pages, indicative of the content, reasonably terse, and not obscured by the use of acronyms. You can click on the orange icon with the black down-arrow to propagate that field down into others below it.

    • The "category" field will usually be either "Ohio University Website," "Other Documents," or "Unofficial Ohio University Page."

    • The "Availability" section has four check-boxes. The "search results" one does not matter, because we are not using that feature of CommonSpot; except in unusual circumstances, you should ensure that the other three are all checked.

  5. Click on "Next" and the page will be created in an "inactive" state. When you are ready to make the page visible, click the button in the upper right, marked "Activate Page Now" . In class, and while first developing a subsite through author.admsrv.ohio.edu, activate it right away. Once a subsite is in production through www.ohio.edu, you will most often choose to activate the page only when it is fully ready for public viewing.

    If you later need to "de-activate" an active page, use the document information tool.

  6. Confirm that you are in "Author" mode. If you are creating an official page directly on the "official_pages1" template, skip to step 8; if you are creating an unofficial page or are building a page on a derived template that has been "locked-down" (as described below), observe that the center of your page has text "Click here to define the layout." Click there.

  7. In the resulting dialog box, you can choose the number of rows and columns for the central section of your page. In class, accept all the defaults (one row and one column, no borders). Click on the "OK" button.

    Setting a width other than 100% for this table can result in different effects on different browsers, so we advise that you leave the width choice at "100%."

    You can modify the choices you have made here later on in several ways that we will discuss.

  8. Observe that your page contains a "Click to insert new element" choice near the middle (the exact location will depend on whether you are building an official or unofficial page, and the template that you are using). Click there to get started; in class, select a Simple Text Block (without header), and type some text that includes the name of the page. Click on the "Finish" button when done.

  9. Click on the yellow "work-in-progress" icon, which should look similar to one of the following:

    , , or .

  10. Select "Submit Entire Page for Publication..." or "Submit Change for publication..." as appropriate.

  11. In the resulting dialog box, you will find the opportunity to provide comments. Please make a habit of doing so -- they will prove quite useful when you need to use the Version History feature, among other times.

  12. In class, wait your turn to click on the "OK" button.

Although the page has been created, that is, it now exists, your work is only just begun! Be sure to promptly check, and if necessary change, the render options settings, as discussed in the next section, and the page background color, as discussed in the following section.


Change the Render Option Settings

Depending on the template you have chosen, the page may have options that you can adjust.

  1. If you are not already there, navigate to the page whose render options you want to examine and possibly change.

  2. If you are not already in "Author" mode, click on the "View Modes" icon and select "Author" from the menu.

  3. Click on the "Page & Template Management" icon and select "Page Properties ..."

    Near the middle of the resulting page properties dialog box you will see the "Publication Date" section, which can be used to control the date and time when the page will become accessible (e.g., to embargo a press release).

  4. Near the bottom of the page properties dialog box, click on the button marked "Select Rendering Options..." and observe the choices that are available.

  5. Each of the render options choices will have a terse description of its effects.

  6. Some of the rendering options choices that the software provides may be permitted, some may be required, and some may be forbidden, depending on the nature of your subsite and page (official vs. unofficial, subsite home page vs. other navigational or content pages, etc.). Just because you see a choice presented to you by CommonSpot in the Render Options dialog does not mean that you are free to exercise that choice.

  7. Page rendering options are selected by check-boxes. As such, selecting one does not de-select any of the others. You must therefore be attentive to possible conficts among the options presented, and manually "un-check" by clicking in any checked box that is not compatible with the options you want. For example, in the current version of the "official_pages1" template, there are three choices for width, at most one of which should be selected.

  8. You will be able at any later time to revise the initial choices you make for all render options, by using the steps presented in this section.

    In class, select the "Sitewide Navigation Bar" option (which will force the page to exceed the width achievable by many printers in portrait mode), the "Printer-Friendly Page Option," (which will make it easier for your users), and the "Remove Footer Text" option, which we will take advantage of in the next section.

    Details of using the "printer-friendly version" are discussed later.

  9. Click on "OK" to accept the page rendering option choices that you have made.

  10. Click on "Finish" to activate the page properties as you have chosen them, including the page rendering options.

Observe that changes of render options take effect immediately, and are not recorded in the Version History. They can only be "un-done" by being re-done.


Using Custom Footer Text

The "Remove Footer Text" render option removes the standard text from the left side of the footer bar and lets you put custom footer text in its place. This option is likely to be used with templates to provide a departmental address, phone number, and e-mail link, instead of the generic information built into the base template.

  1. After choosing "Author" mode for the page and, selecting the "Remove Footer Text" render option, you will either:

    • see the custom text that was already in place (this may happen with the demo subsite home page in class); in that case, inspect it to determine whether or not it should be revised; or you will

    • see a phantom link "Click here to define the layout"; in that case, click there and proceed with the following steps.

  2. In general, choose the default 1 x 1 table.

  3. Click on the "OK" button.

  4. Click on the phantom link "Click to insert new element" and make your choice from the element gallery. In class, choose a "Formatted Text Block (without header)." (Using a formatted text block permits the inclusion of a clickable e-mail link.) You could also choose to paste an element that you had copied from the footer of some other page.

  5. Click on the new element to enter appropriate custom footer text, or to revise the text from a pasted copy of another page's footer.

  6. In class, click on the yellow work-in-progress icon, select "Submit entire page for publication," or "Submit Change for publication," and provide appropriate comments for the Version History; wait your turn to click on the "OK" button.

  7. Change to "Read" mode and inspect your work.


Set the Page Background Color

Depending on the template you have chosen, the page may be generated with no explicit body background color. Because different browsers have different default background colors (usually either white or gray), you should be sure that the page is generated with an explicit background color of your choice, so that your page will appear as intended for all viewers. When in doubt, use white, as shown below, for maximum contrast with dark text, to be most easily read.

  1. If you are not already in "Author" mode, click on the "View Modes" icon and select "Author" from the menu.

  2. Click on "Page & Template Management" icon and select "Page Margins, Colors and more ..."

  3. Click in the data entry box to the right of "background" and in class type to replace the existing "#FFFFFF", changing it into "#FFAA55".

    You could also choose to specify a background image, instead of a backgound color. If you do, be sure to choose an image that will "tile" gracefully whenever the browser is using a window bigger than the image.

  4. Click on the "Finish" button.

  5. The background color change takes effect immediately, with no need to submit for publication or to seek approval, and is not recorded in the Version History, so it can be restored only by re-doing the above steps.

  6. Restore the background color to white by re-doing steps 2 - 4, specifying "#FFFFFF" in step 3.


Create New Page (copy existing page)

This method of creating a new page is particularly attractive if there is a page with nearly the same content already on the server, or if the person doing the work does not have access to the appropriate template, but does have access to a blank page that was built on that template.


Warning

From July 19, 2005, through November 16, 2005, the version of CommonSpot that we were using was afflicted with a subtle bug that sometimes corrupted pages made by copying, as described here. Use the Document Information dialog, discussed in the next section, to learn whether the page you are starting from was created during that time period. If it was, please do not copy it. Instead, create a new page on the appropriate template, and copy and paste elements as needed to provide your new page with the correct content.


  1. Navigate to the existing page you want to copy.

  2. If you are not in "Read" mode on that page, then change to "Read" mode.

  3. Click the "Page & Template Management" icon and select "Copy/Move page..."

    The same menu choice is also used to move a page, that is, to change the subsite or sub-subsite that it is located within. If instead, you want to change the name of a page, without creating a new page, use the Rename Page... choice.

  4. Select the "Copy" radio button, if not already selected.

  5. Use the pop-out menu to select the subsite or sub-subsite within which the new page should be created. If the subsite or sub-subsite is gray, you do not have permission to create pages there. If the sub-subsite you want is not displayed, then click on "Cancel." After the subsite pagemaster has created the sub-subsite, you can return to this process for copying an existing page. In class, select your /demoX/ subsite.

  6. Click on the "Next" button.

  7. Fill out the page-creation dialog. The page's name will be part of the URL, as usual; the page's title will be used within CommonSpot to identify the page; the page's title-bar caption will be included in the HTML TITLE of the page, which is routinely the clickable text of the link leading to the page in search engine output. Therefore, exercise care in the choice of each. To the extent possible, choose a page title that is unique among your pages, indicative of the content, reasonably terse, and not obscured by the use of acronyms. When ready, click on the "Finish" button.

  8. Once the page is created, you can activate, revise, etc., as with any CommonSpot page.


Document Information

  1. Click on the "Knowledge Maps" icon to display the menu, and choose "Document Information" from the menu. You will see a variety of information about the current page, and will have the opportunity to change some of it. In particular, if you are in "Author" mode, this dialog is the one that permits you:

    • to withdraw a page from public view entirely (to "de-activate" it);

    • to change the ownership of the page. This is discussed in detail as part of the Advanced Pagemasters material.

  2. Click on the "Close" button at the bottom when you are done.


Locate a Page


Locate One of Your Own Pages

This is an efficient tool that allows you to quickly find and view any of your pages, templates, and binary documents; it is especially useful when you are the owner of multiple pages within one or more subsites.

  1. Click the "Page & Template Management" icon, and select "My Pages".

  2. Expand your list of pages by clicking the plus [+] symbol next to the "My Pages" item (or the "My Templates" or "My Documents" items).

  3. Click on a page title to locate the specified page.

  4. The selected page appears in the main browser window.

  5. Close or minimize the "My Pages" window in order to work on the selected page.

  6. You can also use the "My Pages" window to select one or more pages to be moved to a different sub-subsite, or to be deleted.


Locate Any Page in Your Subsite

This tool will let you quickly find and view any page in a particular subsite or sub-subsite, including both your own and other pagemasters' or content contributors' pages.

  1. Go to your subsite's admin page: http://author.admsrv.ohio.edu/demoX/admin.cfm (where "X" is the appropriate digit for your training subsite). When you do this for real, of course, you will replace "demoX" with your subsite's name.

  2. Observe that your subsite is selected in the upper right hand corner; if not, then choose it, or a particular sub-subsite, as you wish. The "Subsite Administration" page for the selected subsite or sub-subsite will appear.

  3. Click on the plus [+] sign next to the last heading, "Page, Image & Link Mangement Reports," to expand it.

  4. Select any of the first three links, "Pages by Site Hierarchy," "Pages by Grouped by Owner," or "Pages Grouped by Page/Document Type." (The other reports may prove useful in other situations.)

  5. The resulting dialog works quite similarly to the "My Pages" dialog just discussed: click to expand the sections of interest; click on the black text name of the page to display that page in the main window; click in the check-box to select one or more pages and then move or delete them all at once.


Walking the Template Hierarchy

When you are in "Read," "Edit," or "Author" mode, the Page and Template Managment menu includes the choice "Template Hierarchy...", which brings up a large dialog window that

You can navigate to any listed template or page by clicking on the appropriate linked text. By taking this menu choice in a sequence of pages and templates, you can navigate to any page related to the one you started with.


Back   Content Contributors Home   CommonSpot Tutorials Home   Next


Copyright © 2007 Ohio University. All Rights Reserved.



Dick Piccard revised this file (http://www.ohiou.edu/pagemasters/commonspot/pageint/newpages.html) on December 4, 2007.

Please E-Mail comments or suggestions to "webteam@ohio.edu".