Skip to: Main Content Search Main Navigation Audience Navigation

Ohio University is open

Portion of West Union Street remains closed following multiple structure fire. More Information
 

V6 Building CommonSpot Pages with Classic Tools


Table of Contents


Insert Different Kinds of Page Elements

Simple Text Blocks


See the Rich Text Editor section, below, for a detailed discussion of creation and revision of formatted text blocks. For Simple Text Blocks:

  1. Login, navigate to the page you want to work on, click on the pencil tool icon at the upper-right, and select "Work on this Page" or "Work on this Page (All Changes)."

  2. Click on "Click to insert new element".
     
    If there is no such item, then click on the cell properties icon cell properties tool icon, and select "Insert/Copy Rows..." from the menu that pops out. Confirm that it is creating an empty row, choose whether to create the empty row before or after the element above which the cell properties icon cell properties tool icon was located, and then click on the "Finish" button.

  3. Observe the Element Gallery; scroll as needed and click on "Text Elements" to expand that part of the list.

  4. Click on "Simple Text Block" to select that choice.

  5. Click on "Click here to define the Simple Text Block element".

  6. Type different things into the header and text block fields of the resulting dialog box.

  7. Click on the "Save" button.

  8. Observe the results.

  9. Submit the changes for publication; because this is a new element, the containing layout table and cell will be modified, so choose "Submit Page"; in class, wait your turn to click on the "OK" button.

Using the Rich Text Editor to Import or Edit Existing Content


The Rich Text Editor is used to create and revise Formatted Text Block elements. As we have already discussed, Simple Text Blocks are elements that will re-wrap to fill the available space, and which are presented on-screen in a uniform type face. Formatted Text Blocks differ in that you can control the layout using standard HTML numbered and unnumbered list structures, forced new lines and paragraph breaks, type choices (face, size, and style), embedded links and images, etc.

You can use the Rich Text Editor directly for composition, or you can copy text from other software and paste it into the editor window. The current version of the Rich Text Editor works only with the Windows version of Microsoft Internet Explorer and with Mozilla-based browsers, such as Firefox, on Windows, Macintosh, and Linux.

  1. Login, navigate to the page you want to work on, click on the pencil tool icon at the upper-right, and select "Work on this Page" or "Work on this Page (All Changes)."

  2. Click on "Click to insert new element", and choose a Formatted Text Block from among the "Text Elements" category in the Element Gallery.

  3. Your page will now display "Click here to define the Formatted Text Block element"; click on that to bring up the Rich Text Editor lightbox.

  4. The figure here illustrates the Rich Text Editor lightbox, for a Formatted Text Block (without header):

    Rich Text Editor (V6)

    You can enter text into the text block (or header, if you are working with a text block that has one) by typing or by copying from another window and pasting. If text in the Text Block window has been selected, several of the toolbar buttons that are greyed-out in the illustration above will become active and be displayed with full intensity. As you can see, there are two rows of toolbar buttons, each row having a group to the left and a group to the right. If the lightbox is set too narrow to display all of the toolbar icons, the ones at the right end of each of the four groups will be concealed as necessary, but can be seen by clicking on the "overflow" icon () for that group.

  5. Typing new material:

    Beware special characters, such as "curly" or "smart" quotes and apostrophes, long dashes, solid bullets, etc. The numerical codes for such characters differ between Windows and Macintosh, so that if the raw character is placed into the text block, it will look fine to you, but will be an entirely different character when viewed by users of the other platform. There are special HTML codes that exhibit the same problem (e.g., "Ӓ" -- where many choices for the digits between the "#" and the ";" will generate different characters on different platforms); other special HTML codes are platform-agnostic (e.g., "&text;" -- where the text between the "&" and the ";" is case-sensitive and determines the character to be displayed). This problem can also occur with text from any of the methods discussed below.

  6. Copy and paste from a browser window:

    If the information you want to include on your page is already available on the Web (e.g., in the previous version of your subsite), then you can examine the page where it is already in place, run the mouse through the text to highlight it, and select "Copy" from the "Edit" menu (or use the equivalent keyboard short-cut). Then go to the page in CommonSpot where you want to include this text, follow steps one and two of this sequence, and then choose "Paste" from the "Edit" menu.

  7. Copy and paste raw HTML:

    You can get the raw HTML from a text editor, such as WordPad, if the HTML file is on your computer, or by selecting View Source in your browser. Only select and copy HTML sections that are between the <BODY> and </BODY> tags, not including those tags.

    Before pasting your HTML into the formatted text block entry area, click on the "HTML" button (the one with yellow and green segments split diagonally) in the upper-left quadrant of the toolbar. Please be aware that some HTML constructs will not survive unchanged when you save and re-edit the text block; one that fails is Definition List structures if the DT segment contains tags for H1, H2, etc. (We plan either to expand this item or to put a link here to a discussion of what HTML structures do and don't work, and possible work-arounds for those that don't work.)

  8. Copy and paste from Word:

    Choosing "formatted" when pasting will preserve as much as possible of the appearance of the original document for those of your audience who look at the page using Microsoft Internet Explorer on Windows, but will include Microsoft-specific and Windows-specific codes that will make your information more diffcult to read with other browsers and on other platforms.

  9. Font issues:

    If your font is too small, this will render the text unreadable for part of your audience. After pasting, use the mouse to highlight all the new text, and choose a font face that is sans-serif (e.g., "Default Font") and a font size of "Font size" (to let it use the default size) or "2 (11 px)" -- which is slightly larger than the default -- or larger. If you choose a serif font, be sure to choose a size of "2 (11 px)" or larger

    The "Default Font" is actually a comma-separated list of sans-serif faces (which are more easily read at small sizes), one of which is sure to be installed on all Macintosh systems, and another one of which is sure to be installed on all Windows systems. Please be aware that if you choose a face specification that is a list of multiple faces, such as "Default Font," the face menu will immediately change to the first one on the list that is installed on your computer. CommonSpot will still generate HTML, when the page is published, that includes the full list.

    The selection of font face and size choices available in CommonSpot may change in the future.

  10. When editing a formatted text block in "Normal" mode (not "HTML" mode), use the key combination "Shift-Enter" to create a line break that is not a paragraph break. When editing items in a bulleted list, you can use the "Shift-Enter" key combination two consecutive times to create a multi-paragraph list item, with no bullet for the new paragraph (e.g., see the prior item of this list).

  11. The tool with the chain icon is available when text is highlighted and is used to make that highlighted text link to another location. It will bring up the standard CommonSpot linking dialog box, discussed in the next section.

  12. Place your mouse over each of the other icons in the four quadrants of the toolbar. You will observe the short name for each that is displayed, in case the icon is not sufficiently suggestive.

Links


You can use CommonSpot to make a text or graphic element that is a link, or to make part of the text inside a formatted text block element to be a link. Those links can be to other places in the same CommonSpot page (a "jump"), to other CommonSpot pages, to binary documents within CommonSpot (e.g., PDF files or Excel spreadsheets), or to external Web resources that are not part of the CommonSpot content management system. All images can be made to be clickable links; for details, see the Images section. We first discuss the simplest case, a Link element. Most of the work is the same for building links in the other circumstances:

  1. To make a CommonSpot element that is a link, login and navigate to the page on which the link is to appear.

  2. Click on the pencil icon at the upper-right, and select "Work on this Page" or "Work on this Page (All Changes)."

  3. Scroll on the page to the place where you want to have the link appear.

  4. If there is no "empty" element at that location, click on the cell properties icon cell properties tool icon, and select "Insert/Copy Rows..." from the menu that pops out. Confirm that it is creating an empty row, choose whether to create the empty row before or after the element above which the cell properties icon cell properties tool icon was located, and then click on the "Finish" button.

  5. Click on "Click to insert new element".

  6. Click on "Link & List Elements" to expand that portion of the list.

  7. Select the type of link you want to create. To create a simple link, click on "Link"; in class, choose "Link."

  8. Click on "Click here to define the Link element".

  9. Fill in the "link header" with the text that you want to be the visible, clickable link, and then click on the "next" button.

  10. You will see the dialog for constructing the link, with the Link Action tab active:

    • When building a link to a bookmark on the current page, select a Type of "Page or Bookmark on Page" and then click on "Bookmark...". See the discussion of Jumps, below.

    • When building a link to another CommonSpot page, select a Type of "Page or Bookmark on Page" and then click on "Choose from current subsite" or "Choose" (which together replace the old Page Gallery).

    • When building a link to an already-uploaded document, select a Type of "Uploaded document" and then click on "Choose from current subsite" or "Choose" (which together replace the old Page Gallery); for details, see the discussion of links to binary files.

    • When building a link to a document file that has not already been uploaded into CommonSpot, select a Type of "New Uploaded File" and then click on "Next" at the lower right and proceed; for details, see the discussion of links to binary files.

    • When building a link to a bookmark on another CommonSpot page, first build the link to the page as discussed in the prior alternative, and then click on the "Bookmark" button. See the discussion of Jumps, below.

    • When building a link to a non-CommonSpot page, select a Type of "Unregistered URL or Relative Internal URL" (the last choice on that pop-up). Be sure to give the entire URL, starting with "http://".
       
      On the rare occasions when using this Type to build a link to a CommonSpot page, be careful to include neither the protocol nor the server specifications, so that your link will work unchanged on the authoring server or on the read-only public servers. When typing such an internal relative URL, you may use the "../" prefix to navigate among your sub-subsites, but we suggest that you generally use a URL starting with a slash ("/"). Please be aware that using this manual entry technique for CommonSpot pages means that the link is not managed by CommonSpot, and therefore will not be updated automatically for you if the destination page is moved to a different location or is renamed, and so would become a broken link if either of those events were to happen.

  11. Observe that the Insert Link lightbox includes a tab for "Link Window Properties." If you select that tab, you will see a check-box for "Open link in a new window"; and if you check it, you will then see a button for "New Window Properties..." Test the result, using Preview mode. You can, and sometimes should, specify numbers for the location (in pixels down and to the right from the upper-left corner of the screen) and size (in pixels of width and height) for the new window. The result of leaving all four numbers blank will usually be more satisfactory than the result of clicking on the "default" button.

    All browsers have back buttons, and all screens have a limited area, so in general, opening the link in a new window is a user-hostile behavior. You may decide to do it anyway, especially in cases where the link leads to a non-Ohio University site, or to an online process whose directions are in the page you are linking from.

  12. In class, choose a Type of "Page or Bookmark on Page," and then use the "Choose" button to select one of your other pages.

  13. When you have completed the Link Action and Link Window Properties, click on the "Save" button.

  14. If you click on the link while in "Preview" mode, you will be taken to the destination you have specified. It is wise to proofread all links by such tests, before submitting the change for publication!

E-mail Links


If in step 10 of the above sequence, you choose as the Type, "E-Mail Link," then the bottom part of the Edit Link lightbox will provide you with the opportunity to type in the e-mail address. You have two choices:

  • Type an ordinary e-mail address, such as "servicedesk@ohio.edu" (without the quotes).

  • Type an ordinary e-mail address followed by a subject specification, in the format shown here: "servicedesk@ohio.edu?subject=whatever subject you choose" (again, without the quotes).

When a subject specification is included (which we do suggest should usually be the case), the e-mail address you type must contain no spaces until after the first character following the "?subject=" (i.e., after the "w" of "whatever" in the example above). The subject text may contain the slash character ("/") with no special coding required. Often the path and filename part of the URL of the page the link is on will be an appropriate subject. Most browsers and e-mail software will place the subject you specified into the e-mail message's Subject field, and then provide the user the opportunity to revise it, if he or she wants to.

Marking and Using Jump Destinations


A "Jump" is a link to a location within a page (using an anchor tag with HREF ending in #whatever). In order to be reachable by a jump link, the target location must be "bookmarked," so that it will be rendered using an anchor tag with NAME="whatever". There are two ways to build bookmarks into CommonSpot pages, each of which has its own way to build the link to reach it:

A. Target is the Start of a CommonSpot Element


If the target location you want is the start (upper-left corner) of a CommonSpot element, then build the bookmark first, before starting the link creation process, by giving the element a name:

  1. Login, navigate to the page with the element you wish to mark, and choose "Work on this Page" or "Work on this Page (All Changes)."

  2. Scroll down to that element.

  3. Click on the element properties icon Element Properties Tool Icon for the existing element that you want to mark.

  4. On the menu that pops out; click on "more..."; and then select "Element Name..."

  5. The name you give the element may contain letters and digits; it must include no special characters (periods, hyphens, and underscores should be OK, but not spaces or question marks, etc.). The name you give will be the visible text in the Jump destination selection menu, when building the link, and it may also be the last part of the URL for the jump (hence you should treat it as publicly visible). Jump destinations are case-sensitive, so note or remember which letters you made uppercase, and which lowercase.

  6. Click on the "Save" button.

Then you build the link by clicking on the "Bookmark" button in the Link Action view (for bookmarks on other pages you first build the link to the page in question, as described above, and then add the bookmark specification):

Once the element is named, you can build a link that will take your reader directly to that element:

  1. Login and navigate to the page that is to contain the jump to the element you just marked. It can be the same page, or a different page. Choose "Work on this Page" or "Work on this Page (All Changes)."

  2. Click on the element properties tool icon of an existing link, and choose "Link" to edit it (or create a new link element, as described above).

  3. Adjust the header text, if appropriate, and then click on "Next."

  4. If the jump is to go to a different page, create (or edit) the link to go to the correct page, using the Choose dialog.

    If the jump is to go to a different place within the same page, create (or edit) the link, ensuring that it does not go to a different page (you can choose the "No Link" option if necessary, to cancel an existing link to another page, and then re-edit).

  5. Click on the "Bookmark" button. By default, you will select from the set of choices in the pop-up; these are the top of the document and each named element on the target page. Observe that the name you gave your element is now available as a choice, and choose it. Click on "Select Bookmark" to return to the link-editing process.

  6. Finish the link-editing process and click on the "Save" button.

  7. Submit the change for publication; in class, wait your turn to click on the "OK" button.

  8. Choose "Read" mode and click on the link to test it. Examine the URL in the browser display. If the element you marked is too close to the bottom of the page, it may not have scrolled up to the top of the window; if necessary, re-size the window to convince yourself that it is working as it should.

B. Target is Inside a Formatted Text Block


If the target location you want is in the interior of a Formatted Text Block, then build the bookmark first, before starting the link creation process:  

  1. While editing that Formatted Text Block in the Rich Text Editor, move the insertion point to the location you wish to bookmark.

  2. Click on the "Anchor" button (that button is in the lower-left quadrant of the toolbar, and may well be hidden in the overflow tools collection -- RTE Menu Expansion Tool Icon -- for that quadrant); it will be identified by the pop-up text block if you let mouse hover over it.

  3. Observe the "Please enter anchor name:" and type a name that consists of letters, digits, periods, hyphens, or underscores, but no spaces or other punctuation. Jump destinations are case-sensitive, so note or remember which letters you made uppercase, and which lowercase.

  4. You may also enter the full anchor tag in the HTML view (<A NAME="label"></A> -- be sure that the label you give does not duplicate one used anywhere else in the same page, and that it has no spaces or punctuation marks). 

  5. Click on the "Save" button.

Then you build the link:

  1. Login and navigate to the page that is to contain the jump to the element you just marked. It can be the same page, or a different page. Choose "Work on this Page" or "Work on this Page (All Changes)."

  2. Click on the element properties tool icon of an existing link, and choose "Link" to edit it (or create a new link element, as described above).

  3. Adjust the header text, if appropriate, and then click on "Next."

  4. If the jump is to go to a specific place within a different page, create (or edit) the link to go to the correct page, using the Choose dialog.

    If the jump is to go to a different place within the same page, create (or edit) the link, ensuring that it does not go to a different page (you can choose the "No Link" option if necessary, to cancel an existing link to another page, and then re-edit).

  5. Click on the Bookmark button.

  6. Select, "Enter bookmark manually" (a future version of CommonSpot may include tools to create jumps to bookmarked locations within a Formatted Text Block by selecting from a pop-up -- as is already possible for named elements -- but for now, you must create the jump manually).

  7. Type the name you gave (without quotes, and without a leading "#") with the NAME attribute in the HTML view, or the name you gave for the RTE's "Anchor" process; remember that names are case-sensitive.

  8. Click on "Select Bookmark" to return to the link-editing process.

  9. Finish the link-editing process and click on the "Save" button.

  10. Choose "Preview" mode and click on the link to test it. Examine the URL in the browser display. If the place you marked is too close to the bottom of the page, it may not have scrolled up to the top of the window; if necessary, re-size the window to convince yourself that it is working as it should.

  11. Submit the change for publication; in class, wait your turn to click on the "OK" button.

C. Target is in a Non-CommonSpot Page


If the target is in a non-CommonSpot page, then find out from the pagemaster, or by using your browser's "view source" function, what the name is for the closest existing anchor tag that is prior to the point where you want your reader to begin reading. If the separation is too large, you may decide to ask the pagemaster to add an anchor tag at the location you would prefer.

Then build the link on your page by proceeding as described above for links in general; in step 10, select Type "Unregistered URL or Relative Internal URL" (the last entry on the Type pop-up selection tool) and type a link that includes the entire URL -- the protocol specification (e.g., "http://"), the server domain name, and the full "path and filename" parts of the URL for the page, followed by a "#" and then by the anchor's name, all with no spaces. The anchor's name must be typed in with the identical mixture of upper and lower case that you found in the HTML code of the target page.

Binary Files as Clickable Resources


If you will want your link to go to an uploaded document (PDF, MS Word, MS Excel, MS PowerPoint, etc.) that is not already in CommonSpot, then verify that the document is in a file whose name contains no spaces or punctuation marks, except perhaps hyphen ("-") or underscore ("_") characters, and whose name ends with the conventional file extension for that type of file (e.g., ".doc", ".pdf", or ".xls", etc.).

You may choose to upload it in advance:

  1. Login and navigate to the page on which the link is to appear; select "View Page in CommonSpot," "Work on this Page," or "Work on this Page (All Changes)."

  2. Click on the "New" button on the full-width toolbar and select "Uploaded Document...".

  3. Select the subsite into which to upload the document; it should default to the current subsite; click "Next" at the lower right.

  4. Click on the "Browse..." button and select the file.

  5. Provide a title that is terse, descriptive, and unique; complete the rest of the "Upload New Document" lightbox; click on "Next" in the lower right.

  6. The lightbox will close when the upload is completed.

  7. Next, build the link, making the choices appropriate to link to an already-uploaded document, as discussed next.

You can also upload the binary document file while building the link.  The following instructions include variations for both approaches:

  1. Login and navigate to the page on which the link is to appear; select "Work on this Page" or "Work on this Page (All Changes)."

  2. Find a "Click to insert new element" at an appropriate location for the the link; if there is no such item, then click on the cell properties icon cell properties tool icon, and select "Insert/Copy Rows..." from the menu that pops out. Confirm that it is creating an empty row, choose whether to create the empty row before or after the element above which the cell properties icon cell properties tool icon was located, and then click on the "Finish" button.

  3. Click on "Click to insert new element".

  4. Click on "Link & List Elements" to expand that portion of the list.

  5. Select the type of link you want to create. To create a simple link, click on "Link"; in class, choose "Link."

  6. Click on "Click here to define the Link element".

  7. Fill in the "link header" with the text that you want to be the visible, clickable link, and then click on the "next" button. It is kind to include, if the surrounding text does not, some indication of the type and size of the file.

  8. You will see the dialog for constructing the link, with the Link Action tab active:

    • When building a link to a file that has already been uploaded into CommonSpot (either according to the method described above, or while building a prior link), select a Type of "Uploaded document" and then click on "Choose from current subsite" or "Choose" (which together replace the old Page Gallery); click on the "Next" button; go to step 12.

    • When building a link to a file that hasn't yet been, but should now be, uploaded into CommonSpot, select a Type of "New Uploaded File"; click on the "Next" button; go to step 9.

    • When building a link to a file that is already online, but not in CommonSpot, select a Type of "Unregistered URL or Relative Internal URL" (the last choice on that pop-up). Fill in the URL for the file; be sure to give the entire URL, starting with "http://"; click on the "Next" button; go to step 14.

  9. The document needs to be uploaded, so click on the "Browse" button and select your document file; click on the "Open" button to select the file.

  10. Once selected, choose the category (typically "Other Document"), give it a title, and click on the orange down-arrow to pre-fill the other fields. The title should be descriptive and unique within CommonSpot.

  11. Click on the "Next" button to complete the upload and link-building process. Go to step 14.

  12. If you are linking to a document that is already in CommonSpot, click on either "Choose from current subsite..." or "Choose..."; in the list of documents (which will not include CommonSpot pages), click to highlight the one you want, and then click on "Use Highlighted Page."

  13. Observe the title and URL at the bottom of the Insert Link lightbox, and click on "Save."

  14. When ready, click on the yellow work-in-progress icon to publish the change; in class, wait your turn to click on the "OK" button.

People using Internet Explorer on Windows may find that a Word document, for example, opens within the browser window. Others will find that it downloads the file and then launches Word to open the document. Still others will have to select whether to save or open the file. These variations are likely to be consistent for any one user (depending on their software versions and configuration settings), so they should not be taken by surprise, but it is impossible for you to predict what will happen for all your users, so be careful to choose a wording that will apply to any of these variations (e.g., identify the link by file type and size, but don't say, "to open").

"Printer-Friendly Version" Links


Depending on the choices you make about elements to include and the width to specify for the page, it may be impossible for some of your viewers to print the page in portrait mode without cropping or shrinking. This issue is printer, browser, and platform sensitive, but the overall trend for the past fifteen years has been for Macintosh and Windows systems to become more similar in their behavior, and for both to produce readable printed text from wider and wider page layout design widths. In 2011, you can reasonably expect any page that is 670 pixels or narrower to be reasonably printer-friendly.

For pages that are based on the old "official_pages1" template, you may have "printer-friendly version" links included in the page display. If you want them, but don't have them, or if you have them, but don't want them, please contact servicedesk@ohio.edu for assistance.

For pages that are built on the new, "manage" style CommonSpot templates, printer-friendliness is built-in, through the Cascading Style Sheets.

Image Gallery


CommonSpot maintains a collection of images that are available for placement on your pages. These images may be uploaded to the server in the act of placing them on a particular page, or they may be pre-uploaded for future placement. Whenever uploaded, they are placed into a folder on the server named "images" that is within the particular subsite that houses the page being worked on when the image-uploading process is started. It is therefore generally wise to ensure that whenever you pre-upload images for use within a particular subsite, you start by navigating to a page in that subsite. (If at some time in the future, the subsite is removed from the server, all of the images in that subsite will be removed, too, whether they are used only on pages in that subsite, or they are used on pages in another subsite.)

There are two groups of images: 

  • those that are available to all CommonSpot content contributors and pagemasters, and

  • those that are available to you alone.

You can add images to the collection. Depending on your account permissions in CommonSpot, you may be able to set any of your images to be available to all CommonSpot users. Even if you have permission to designate images as public images, it is probably not a good idea, because doing so will increase the number of images that you and everyone else has to wade through while choosing images from the public gallery to use on their pages, and a public image is subject to modification (e.g., "upload a new version") by any content contributor or pagemaster; see step 9, below. To see the available images and upload new ones:

  1. Login and navigate to a page in the subsite you are working on.

  2. Select "View Page in CommonSpot," "Work on this Page," or "Work on this Page (All Changes)."

  3. Click on the "Tools" button in the full-width toolbar and choose, "Find Images...".

  4. In the resulting lightbox, make your selections to prune or expand the list of images that you will see, and select the layout of the display. If you don't see an opportunity to impose the restrictions you want, click on "Show More" at the lower-left.

  5. Click on the "Search" button. The default display will be several columns and as many rows as needed. Each image's cell will include a standard-sized "thumbnail" image at the top, some text information about the image, and at the bottom of the cell, three tool icons and a check-box. You can quickly change the "Show As:" selection to alternative presentations.

  6. If you don't want to upload a new image, then when you are done looking at the existing images, click on the blue "X" at the upper right for "Image Search" or lower right. This will return you to the same dialog box you used in step 4.

  7. To add a new image to the gallery, from your computer's disk drive:

    First verify that the document is in a file whose name contains no spaces or punctuation marks, except perhaps hyphen ("-") or underscore ("_") characters, and whose name ends with the conventional file extension for that type of file (e.g., ".gif", ".jpg", ".jpeg", or ".png" -- be sure those letters are lowercase, to avoid a bug);

    Second, in the "Find Image - Search Results" display, click on "Upload New Image" in the lower-left.

  8. Click on the "browse" button to navigate on your computer's disk drives to find the image file you want to upload. Click on the "Open" button to select it.

  9. Modify the other characteristics, as appropriate:

    The "Target Subsite" will default to the subsite of the page you were working on, not to the subsite you searched to generate the list of images you were looking at when you clicked on "Upload New Image."

    The "Description" will default to the filename, which is sometimes a good choice; that field will end up as the default for the "Flyover Text" when you place the image on a page, so a real description is best.

    Be sure to look for the check-box near the bottom, "Include in Public Image Gallery": if you are authorized to create public images, that will be checked by default, and must be cleared if you don't want the image to be public (see the discussion immediately prior to these steps).

  10. Click on the "Next" button.

  11. Observe that the graphic you have just uploaded is now included in the count of "My Images."

  12. When you are looking at the gallery of images, you will see a trash-can icon for each one. Clicking on that icon will delete the image.

Image Elements


  1. Login and navigate to the page you want to add the image on.

  2. Select "Work on this Page" or "Work on this Page (All Changes)."

  3. Click on "Click to insert new element"; if there is no such item, then click on the cell properties icon cell properties tool icon, and select "Insert/Copy Rows..." from the menu that pops out. Confirm that it is creating an empty row, choose whether to create the empty row before or after the element above which the cell properties icon cell properties tool icon was located, and then click on the "Finish" button.

  4. The Element Gallery will appear; click to expand the image elements. Then click on the appropriate type of image element; in class, choose "Single Image".

  5. Click on the text, "Click here to define the Single Image element," to select the actual image you will use.

  6. Click on the "Choose..." button to select an existing image, or the "New..." button to upload a new image. See the discussion of the Image Gallery, above. In class, use the "Choose..." button next to "Image" to bring up the Image Gallery.

  7. Adjust any of the search parameters, as needed, and then click on the "Search" button at the lower right to access an image that you have already uploaded.

  8. Click on the image you want to use, and then click on the "Use Highlighted Image" button at the lower right.

  9. Type appropriate "flyover text" into the box; this text will be displayed while the image is loading; will be displayed by non-graphic browsers at the location where the image would otherwise appear; and will be annunciated by the text-to-speech software of browsers used by visually impaired readers. If the image is a space-filler, cosmetic adornment, or should otherwise not be presented to visually impaired readers, leave the "flyover text" blank. CommonSpot will generate an ALT="" attribute inside the IMG tag in such cases, concealing the presence of the graphic in text-based and speaking browsers.

  10. If you want to have this image be a clickable link, then click on the "Edit" button in the Link section, to the right and just below the flyover text box, towards the bottom of the dialog box.

  11. Click the "Save" button when done.

  12. When ready, click on the yellow work-in-progress icon to publish the change; in class, wait your turn to click on the "OK" button.

  13. If you want to add (or change the text of) the image's "header" or "caption," then click on the Element Properties icon for the image element, and select "Caption"; you will have an opportunity to type or revise the text.

  14. If you want to change the font of the text of the image's "header" or "caption," then click on the Element Properties icon for the image element, and select "Fonts"; you will have an opportunity to specify the font used for the caption text.

  15. If you want to change the location of the image's "header" or "caption," then click on the Element Properties icon for the image element, and select "Layout Properties..."; the resulting dialog will display the various choices; click the "Save" button when you have made your selection. The change takes effect immediately, and is therefore not recorded in the Version History.

  16. If you want to upload a new version of an existing image, go to the page where it is used, in Firefox (as of July 12, 2011, this feature is broken in at least some versions of Internet Explorer), bring up the Image Properties lightbox, and observe the "upload new version" button at the upper-right. If the new image is a different size, you may have to first Save the use of the new image, and then come back in later to use the "Re-scan Image Size" button. We will update this item when this aspect of CommonSpot is fixed.

Tabular Layout Elements


  1. If necessary, login, navigate to the page you want to work on, and select "Work on this Page."

  2. Click on "Click to insert new element."

  3. In the Element Gallery, click on "Layout Elements" to expand that list. (The "Multi-section" layout element essentially just gives you a formatted text block with header, so we won't pay any further attention to that choice.)

  4. Click on "Tabular Layout" and observe that your page now has the text "Click here to define the Tabular Layout element."

  5. Click there to define the layout. You will have control of all the usual HTML table attributes. Be aware that using a table makes the display of your page more browser-dependent. Specifying table or cell widths in pixels may make it impossible to print in portrait mode without cropping for some of your audience, and may force the browser to wrap text within the cells differently for some of your audience than others. In class, select two rows and two columns, and specify small non-zero border, cellpadding, and cellspacing values.

  6. Click on the "Save" button when you are done.

  7. Observe the new "Click to insert new element" choices, one in each table cell.

You will be able to use the element properties icon to revise the layout properties later. Whenever you use tables for layout, bear in mind that text browsers, such as are often used by visually impaired people, may ignore table tags, and consequently may display items with no separation that you think of as separated. CommonSpot will display additional tools if you click on the down arrow icon (gray_arrow_down) at the top-right corner of the table.

 

Copying and Pasting Whole Elements


Sometimes you will want to have two pages, or two places on one page, with very similar elements. If you create one of them first, you can then copy the whole element and paste it into the other location. Any changes that you make after copying and pasting will affect only the element that you edit, not the other copy. One possible use for this technique is the boilerplate, where only the filename and date might be different from one page to the next.

  1. Login, navigate to the page with the existing element that you want to copy, and choose "Work on this Page" or "Work on this Page (All Changes)."

  2. Click on the element properties icon for the existing element that you want to copy, and then click on "more" to expand the menu.

  3. Select "Copy Element" from the menu; beware, the "Delete Element" choice is adjacent. A small lightbox will display to confirm that you have copied the element; close it.

  4. If the page where you want to paste the copied element is a different page, then select "View Page as Published" on this page before you navigate to the page where you want to paste the copied element.

  5. Select "Work on this Page" or "Work on this Page (All Changes)" on the receiving page, if it is not already selected.

  6. Find the place on the page where you want to place the copied element. If there is no "empty" element, click on the cell properties icon cell properties tool icon, and select "Insert/Copy Rows..." from the menu that pops out. Confirm that it is creating an empty row, choose whether to create the empty row before or after the element above which the cell properties icon cell properties tool icon was located, and then click on the "Finish" button.

  7. Click on "Click to insert new element". Observe that above the regular list of element categories, there is a choice "Paste Copied Element". Take that choice.

  8. Observe the replica element; you may now revise it as appropriate.

  9. When ready, click on the yellow work-in-progress icon to publish the change; in class, wait your turn to click on the "OK" button.

Deleting Elements


  1. Login, navigate to the page with the existing element that you want to copy, and choose "Work on this Page" or "Work on this Page (All Changes)."

  2. Click on the element properties icon () for the existing element that you want to delete; click on "more."

  3. Select "Delete Element" from the pop-out menu.

  4. A dialog box prompts for confirmation.

  5. Click "Yes" to delete the selected element.

  6. Click on the yellow "Work-in progress" icon to publish the change.

  7. Select "Submit Page."

  8. Type the comments in the dialog box.

  9. In class, wait your turn to click on the "Submit" button.

 

Pop-Up Menus


Pop-up menus and drop-down link lists are both multiple choices that appear ("pop-up") when the mouse is clicked on a specific location. Both of these menus are implemented with Javascript, and thus will work only with browsers that have the Javascript capability, and have that feature turned on; this is clearly the majority of your audience, but not all of it. Pop-up Menus can generate choices on-screen whose type face is extremely difficult to read when viewed with some browsers, so if you do decide to use pop-up menus, be sure to set the type face, as discussed in steps 11-14, below. Both Pop-up Menus and Drop-down lists are created and used within the context of a single page; if you will want to use the same pop-up menu on multiple pages, those pages should share a template, and the pop-up menu should be constructed in that template. Drop-down link lists are a specific choice from the Hyperlink section of the Element Gallery, which you will find works quite similarly to the Pop-up Menus as discussed in detail next.

Pop-up Menus will not work with the Lynx browser, nor with any modern browser whose user has decided not to trust scripting. Further, many search engines will not follow any links pointed to by the pop-up menu choices. You should therefore not use them on any page intended for viewing by a general audience, unless you also provide conventional links that lead to the same destinations, either directly or by way of an intermediate navigational page. They may be appropriate to use in cases where you know that everyone looking at your page will be using Internet Explorer (e.g., students in a specific teaching lab where personal assistance is available for visually impaired students). A future version of CommonSpot may be enhanced so that non-scripting browsers will have a functioning link to the first choice in the pop-up menu. Once that is in place, you can, if you haven't already done so, place the navigational page with links to other choices as the first choice in the menu, and not need to have any other link to that page.

  1. Login, navigate to the page where you want to define the pop-up menu, and choose "Work on this Page" or "Work on this Page (All Changes).

  2. Click the "Manage" button in the content-spanning toolbar; select "Pop-Up Menus..."

  3. Click on "Add Menu..." and specify a menu name. If you know what you want, you can change the other characteristics at this time; if not, then you can edit them later.

  4. Click on the "Save" button.

  5. Observe the yellow work-in-progress tool for the menu you just created; click on it and select either "Submit entire element for publication..." or "Submit entire page for publication..."; fill in the publication comment and click on "Submit." (You may be able to skip this step.)

  6. Click on the pencil icon for the menu you just created, and select "add menu item".

  7. Complete the information in the "new menu item" window: the "item text" will be the visible choice for that item on the menu.

  8. Click on the pencil icon to establish the link destination for that item; as usual, you may link to an existing page, a newly uploaded document, etc.; in class, link choice A to existing page "sampleA.cfm," etc. Click on the "Save" button of the Insert Link lightbox when you have established the destination.

  9. Click on the "Save" button of the New Menu Item lightbox when you are done working on that item. 

  10. Repeat steps 6 through 9 as needed to include as many choices in the pop-up menu as you want to at this time. You will be able to add choices later, and when you do, they will appear "immediately" in all places where that pop-up menu is linked.

  11. Click on the pencil icon for Page Level Menu Properties above the menu (or list of menus).

  12. Toward the top of the Edit Page-Level Menu Properties lightbox, you will find the opportunity to specify the "Separator Color"; type in "#000000" (without the qoutes; that is a pound sign, which is required, followed by six zeros, with no spaces). This works around a bug in Internet Explorer 6.

  13. About halfway down the Page-Level Menu Properties dialog box you will find "Font, Size & Attributes"; select "Ohio Default" for Font, a size of "x-small" or larger, and clear the bold and italic check-boxes if they are already checked.

  14. Click on "Save."

  15. Click on any of the yellow work-in-progress icons and submit the entire page for publication; in class, wait your turn to click on the "OK" button.

  16. Click on the "Close" button for the "Manage Pop-Up Menus" dialog box. 

  17. Go to the place on the page where you want to have the pop-up menu appear, and click on "Click to insert new element" (if that choice is not available, you may have to add a row or column).

  18. Build your new link as usual, choosing "Link" as the page element type. 

  19. Click to define the link element; fill in the Link Header (the text to be linked); and click "Next".

  20. In the Link Action lightbox, choose a Type of "Link to Pop-Up Menu" and choose the pop-up menu you want to use there from the list of available choices (which will include any pop-up menu that is defined on this page or any of the templates that it is derived from); then click "Save" to create a link to the pop-up menu.

  21. Use Preview mode to check your work.

  22. Click on the yellow work-in-progress icon to "Submit entire page for publication"; in class, wait your turn to click on the "OK" button.

  23. Select "View Page as Published" and click on the link to display the pop-up menu options.

If the CommonSpot tool icon menus fail to collapse when you move the mouse off of the gray block, just use the browser's "Refresh Page" function.

Image Grids


[As of August 12, 2011, Image Grid authoring is broken in V6.2, using either IE8 or FF3.6; we will complete the updating of this section after it is fixed.]

An image grid consists of a set of images that are grouped together on a page, either horizontally or vertically. An image grid is typically used as a navigational tool, so that each image is linked (to a specific place on the current page, to another page, to send E-mail, etc.). Because the image grid is a single element, you can copy and paste the whole collection of linked images in one step to save time. You might do this, for example, if you want to have those navigational choices at both the top and bottom of your page. Using an image grid instead of a table of individual images will improve system performance going into "Author" or "Edit" mode by reducing the number of CommonSpot tool icon menus that have to be constructed.

  1. Login, navigate to the page where you want to define the pop-up menu, and choose "Work on this Page" or "Work on this Page (All Changes).

  2. Select "Click to insert new element".

  3. Click to expand "Image Elements"; inspect the available options. 

  4. Click on "Image Grid".

  5. Click on "Click here to define the Image Grid element."

  6. In the resulting dialog box, click on "Add Image".

  7. Start the process of picking the image by clicking on the "Choose..." button or the "New..." button.

  8. Choose the image.

  9. In the "Image Properties" dialog box, type some appropriate text into the box, "Alternate Image Text (Flyover Text)". You can also control the white space around the image, although some browsers may not obey those commands. If you encounter that problem, please contact OIT by e-mail to servicedesk@ohio.edu or calling 3-1222 on campus.

  10. Click on the "Edit" button for the link and set up the link appropriately.

  11. Click on the "Finish" button.

  12. Go back to step 5 if you want to add more images to the grid; otherwise, click on the "OK" button.

  13. Once you have one or more images in the grid, then you can jump to step 5, above, in order to add more images, by clicking on any of those images while viewing the page in "Author" or "Edit" mode.

  14. Choose "Layout Properties" from the Image Grid's "Element Properties" menu in order to select vertical or horizontal alignment.

Changes that Take Effect Immediately


Some changes do not require approval for "Publication," and are not recorded in the Version History. They must therefore be un-done or re-created by hand, if necessary. In particular, at the present time those changes include the following:

  1. Page Background Color.

  2. Page Primary Table Width -- from layout properties on the page, or with some base templates, from the render options.

  3. Image layout and header location.

  4. Element inheritance security restrictions.

Validate Links


  1. Click the "Tools & Information" tab to display the menu, and then select "Validate Links".

  2. CommonSpot will scan the page checking for the reachability of links and images, and will report on what it finds.

  3. Remember that CommonSpot can only tell you whether a page was found, or not. It cannot tell you whether the intended page was found!

Referring Pages


  1. Click the "Tools & Information" tab to display the menu, and then click "Referring Pages".

  2. You will see a list of all those CommonSpot pages that contain a link to the current page, where the link was constructed by using the "Page Gallery" or the "Page Finder" mechanism. Links that were created by manually typing in the relative URL are not managed by CommonSpot, and so will not result in the referring page being listed by this mechanism.

    As of December 20, 2011, the lists are sometimes falsely empty, or are incomplete. A listed page almost certainly does have a link leading to the current page, but un-listed pages may also have links. We are working with PaperThin to resolve this issue. We will update this paragraph as the facts change.

  3. You can select some or all of those pages, by clicking in the corresponding check-box, and then change the destination of the existing link to the current page, so that the link goes instead to some other page. After using, for example, the Page Gallery or the Page Finder, to specify the new destination of the links that used to lead to the current page, you must click on the "save" button to make those changes effective.

    At first glance this CommonSpot feature appears to raise a security issue -- you linking from your page to some other CommonSpot page gives the author of that page the ability to change your page. However, the only thing that other person can change is the destination of a link on your page, and so if a CommonSpot subsite has a major re-organization, the various links in to it from CommonSpot pages can be fixed more rapidly.

Create and Populate Page Sets


CommonSpot provides tools for managing groups of pages, known as "Page Sets." This is most likely to be useful when a group of pages share related content. Such Page Sets are first defined by identifying the pages that are members of the set, and then in those pages or in other pages, you can add page elements that provide a Table of Contents, an Index, or Navigational links to the members of the page set. The Navigation links are "Previous," "Top," and "Next," implementing the conventional "wagon wheel" scheme, with the first page in the page set acting as the "hub" of the wheel.

Before building a new page set, it is essential that at least one of the pages to be included in the page set already exist, so that you can create the page set. You can add pages to the set, and change the ordering of the pages in the set after it has been created, and after links are already in place on one or more pages -- those links will be updated appropriately as you add pages to the page set. The next section discusses the technique for managing existing page sets.

  1. First create one or more of the pages that you plan to include in the page set.

  2. Click the "My Content" button in the content-spanning toolbar; select "My Page Sets...". Observe the summary report listing all page sets that you own that are in the default subsite itself (not in any child sub-subsites); usually there are none.

  3. Select the appropriate subsite, within which you want to create the new Page Set, and click "Filter". Observe the updated list of Page Set titles, if any (you will have to name the new set uniquely).

  4. Click on Create New Page Set, in the lower-left.

  5. Enter the category, name, title, description, and keywords for the page set. A future version of CommonSpot may provide for limited-scope page sets, but in the current version of CommonSpot, all page sets are system-wide, so you must choose a name that will not collide with any other existing page set name.

  6. Click on the "Next" button.

  7. Observe the "Page Set Members" Window, with no members listed. You can close the window at this point, and come back to add the members later, or you can add one or more members now.

  8. Click on "Add Members" at the lower-left.

  9. Choose the site, category, and particular item; repeat as needed. The list of pages available to be added to the page set will include all those meeting the criteria you have specified, except that the list will not include any of the pages that are already in this or any other page set (no page may be in more than one page set: if it were, there would be no way to identify the "next page"). In class, add the "index" page first.

  10. Click on the Page Title to view that page as published.

  11. Click on the pencil icon at the right to choose work on the page (my changes, all changes, or approval).

  12. Click on white space or the subsite name to select a member (the row will be highlighted), and then drag it up or down to change the sequence.

  13. Click on the tool icon immediately to the right of the pencil to remove that member from the page set.

  14. When done, click on the "Close" button.

Use Page Sets


  1. Login and navigate to a page where you want to have links to the pages in the page set, either a member of the set in which you want to have navigational links for the set, or a page in which you want to have an index or a table of contents for the page set.

  2. Select "Work on this Page" or "Work on this Page (All Changes)."

  3. If there is no "Click to insert new element" at the location where you want to have the links for the page set, create a new row or column as discussed previously.

  4. Click on "Click to insert new element".

  5. In the Element Gallery, expand the category of "page set elements", and make your choice (in class, choose "page set contents," not index or navigation links).

  6. Click on "Click here to define the Page Set Contents element" (or whatever type you chose in the previous step).

  7. Choose "Select an existing Page Set" and then select from the pop-up that appears.

  8. Click on the "Save" button.

  9. When ready, click on the yellow work-in-progress icon to publish the change; in class, wait your turn to click on the "OK" button.

If you have placed Page Set navigational, contents, or index links on any of your pages, and one or more members of the page set are moved, that is, relocated to a different sub-subsite, CommonSpot will automatically update the links to reach the page in its new location.

Manage Page Sets


After building a page set, you can come back and add or remove members, or change the ordering of the pages in the set:

  1. Click the "My Content" button in the content-spanning toolbar; select "My Page Sets...". 

    • Observe the summary report listing all page sets that you own that are in the default subsite itself (not in any child sub-subsites); usually there are none.

    • Click to check the "Include Child Subsites" box and then click on the "Filter" button; you will see a list of all page sets that you own.
  2. Click on the linked number of Members to add, remove, or change the ordering of the pages in the set, as described in steps 7 through 14, above.

  3. The other tool icons at the right end of the row for your page set enable other tasks. 

  4. The rightmost item is a check-box; when one or more rows' boxes are checked, the "More Actions..." pop-up will let you delete, move, or change ownership of the selected page sets, all at once.

  5. Click on the "Close" button when finished with the "My Page Sets" lightbox.

  6. If you need to work with a page set that isn't yours, click on the Tools button in the full-width toolbar and choose "Find...".

    • Click the "Show More" link in the lower-left corner.

    • In the "Show" section, click to un-check everything except Page Sets.

    • Select the appropriate subsite, and check, or clear, "Include Child Subsites," as appropriate.

    • Click on "Search" at the lower right.

    • Identify the page set you want to work with, and then use the appropriate tool icon at the right end of that row.

Style Sheets


Style sheets are a mechanism to exercise consistent control of several features (e.g., type face, type color, type size for plain text and each level of header), overriding the browser's defaults, within a page or group of pages. Style sheets can be included in the HEAD section of the HTML for each page, or stored in separate files. Unfortunately, style sheets are platform- and browser-specific, and some combinations of location and browser will render your page unreadable or unprintable. Because you will usually have no control, and very limited knowledge, of the platform and browser used by your audience, we urge that you not use style sheets beyond what is created automatically on your behalf by CommonSpot, or provided by OIT staff. Instead, we suggest that you put your effort into keeping the content of your pages complete and up to date.


Insert More Different Kinds of Page Elements


Scheduled Elements


Scheduled elements provide a mechanism to control the display of content based on date and time, audience, page category, subsite, and browser.

[This segment is a work-in-progress; we hope that the following is useful, but please do be aware that it is not yet complete, and has not yet been fully updated for V6.]

  1. Select "Click to Insert New Element".

  2. Expand the "Miscellaneous Elements" category, and click "Schedule/Personalize" from the list.

  3. Click on the tool icon at the upper-left of "schedule/personalize"; choose from "Elements," "Criteria," and "Layout."

  4. [...] here to define the scheduled elements",

  5. Click on "Elements"; then click on "Add New Element." Enter an element name that is unique within that page, and choose an element type, for example, "Formatted Text Block" (which lives in the Text Elements category, just below the middle of the list -- in the current implementation, the sequence of categories is pseudorandom, you will just have to scroll back and forth until you find what you want).

  6. Once the element is in place on the list, it will have two tool icons, a pencil to permit revising the name or removing it from the list, and tiny-gear-wheel-with-spectacles to force it to be rendered for editing.

  7. Click to force the element to be rendered for editing, and then close the element lightbox.

  8. On the page, click on "Click here to define the Formatted Text Block (without header) element."

  9. Use the Rich Text Editor as usual with a Formatted Text Block, and click on "Save" when done.

  10. Submit the page when ready.

  11. Click on the tool icon for "schedule/personalize"; select "Criteria."

  12. Observe the list of elements; each element's pencil tool permits adjusting the order of the elements, and provides the ability to edit the selection criteria for that element. If you change the rendering criteria, you will see a yellow work-in-progress tool in this lightbox; submit as appropriate. You may select based on subsite -- but be aware that the order of subsites in the pop-up list is pseudorandom in the current implementation.

Floating Flash


The discussion of this topic is now in its own file.

Custom Elements


Custom elements require system administrator action to set up, but can then provide a mechanism for sharing content elements among multiple pages, so that a single revision of the element is displayed on all the pages right away. If you have need of such shared content, beyond that described below, please contact OIT by E-mail to servicedesk@ohio.edu.

Global Edit Text Field


[As of August 12, 2011, this fails in V6.2; we hope that PaperThin will fix it soon; once it is fixed, this section will be updated for V6.]

The element gallery now includes a sharable element, the "Global Edit Text Field." With it you can create content that appears on multiple pages, and revisions may be made on any of those pages, the changes appearing on all of them. When used as described below, the changes can be "tracked" in the comments field of the Version History, but only on the page where the change was made, and the changes are not restorable through the Version History mechanism.

  1. Go to one of the pages you want to have the shared content appear on, and select "Edit" mode.

  2. Scroll to the place where you want it to appear.

  3. If there is no "empty" element at that location, click on the cell properties icon , and select "Insert/Copy Rows..." from the menu that pops out. Confirm that it is creating an empty row, choose whether to create the empty row before or after the element above which the cell properties icon was located, and then click on the "Finish" button.

  4. Click on "click here to add an element".

  5. Click to expand the Text Elements section of the Element Gallery.

  6. Click on the title to choose "Global Edit Text Field."

  7. Click on the phantom to create your initial content.

  8. Click on the "Finish" button when done.

  9. Click on the yellow work-in-progress icon, and select "Submit entire page for publication" (do not select "Submit change for publication"). Be sure that you fill in the comments field; this is the only way to track what you have done.

  10. Follow the instructions to copy and paste an element, pasting it into another page, or another place on the same page, where you want it to appear.

  11. On that other page, click on the yellow work-in-progress icon, and select "Submit entire page for publication" (do not select "Submit change for publication"). Be sure that you fill in the comments field; this is the only way to track what you have done.

  12. From now on, you can update that content while in author mode on any of the pages where it appears. The update will appear on all pages as soon as you select "Submit the entire page for publication"; do be sure to fill in the comments.

Simple Forms


Simple forms provide a way to collect and display information. As the name implies, the features and options provided are simple, which makes it easier to learn, but does not provide the advanced capabilities of a full application programming environment.

You will need to create two pages, one for data entry and one for display.

We have not yet documented here the methods to use to collect information that is not intended to be immediately available to the general public. (Restricting access to the data results display page is a likely approach.)

  1. Choose an existing page or create a new page for data entry, and set its layout as you wish.

  2. Click on "click to insert new element" and expand the "Form & Data Sheet Elements" section of the Element Gallery.

  3. Select "Simple Form".

  4. Click on "Click here to define the Simple Form element".

  5. Select "Create new simple form" and click the "Next" button.

  6. Enter a name for the form, which should start with your subsite name. 

    Later, when you have your results page created, you will come back and select "submit to page," but for now choose "Display message on submission."

    Click the "Specify Message..." button to provide initial text; when finished, click on the "Save" button at the lower-right. That text will replace the form itself when the page reloads following submission of the form.

    Click for now in the check-box to select "Send email notification upon submission."

    Be sure that the sender's E-mail is selected to be the E-mail address of the user submitting the form, if known, and provide a valid e-mail address for use otherwise.

    You can just have the form information E-mailed to an address or addresses of your choice. E-mail submission of form information is also supported in two other ways, as described at http://www.ohio.edu//oit/webservices/static/append5.cfm.

  7. Click on the "Save" button; the page will re-display with a yellow work-in-progress icon ("+") for the simple form element's properties.

  8. Click that icon and select "Edit Fields."

  9. Click the "Add New Field" link.

  10. Choose a Type, enter a Field Name, and enter a Label (other aspects are optional).

  11. Click on the "Add Field" button; the list of form fields will now include the new field.

  12. Repeat steps 9 - 11 to create additional fields as needed.

  13. Click on the "Close" button.

  14. Choose an existing page or create a new page for data display, and set its layout as you wish.

  15. Click on "click to insert new element" and expand the "Form & Data Sheet Elements" section of the Element Gallery.

  16. Select "Data Sheet".

  17. Click on "Click here to define the Data Sheet element".

  18. Click on "Add data sheet view" in the lower-left.

  19. Enter a name and description -- name sure the name starts with your subsite.

  20. Check the "Private" or "Default" check-boxes; select the data source to be "Form Result/Custom Element Sheet."

  21. Click the "Next" button.

  22. Choose the simple form that you created in steps 1 - 13. This may be easier if you first select a Source Type of "Simple Forms" and then click on "Filter" at the upper-right. When you have selected the simple form, click on the "Next" button.

  23. Select and sequence the columns as you prefer for display.

  24. Click on the "Save" button.

  25. Click on the "Close" button.

  26. Build a link, either as a direct link element, or within a Formatted Text Block, that will take your reader to the data entry page that you created in steps 1 - 13.

  27. Click on the yellow work-in-progress icon and submit the entire page for publication.

  28. Change to read mode and click on the "Return to data entry page" link.

  29. Select "Author" mode if not still in that mode.

  30. Click on the form's element properties tool (element properties tool icon) and select "form" to bring up the "Create/Select Simple Form" lightbox; select the "Select SImple Form/Custom Element" choice; and click on the "Next" button.

  31. Select a Source Type of "Simple Forms" and then click on "Filter" at the upper-right. When you have selected the simple form, click on the "Next" button.

  32. Change the form action to "Submit to a specified page" and click on the "Choose..." button to bring up a list of your pages. Choose the display page that you created in steps 14 - 27, and then click on "Use Highlighted Page."

    Observe the path and filename specification for the page you have selected.

    You could also at this time turn off sending of the e-mail, but we suggest you make that a separate revision cycle, after confirming experimentally that the submission to the page is working as expected.

  33. Click on the "Save" button in the Simple Form Action lightbox.

  34. Click on the yellow work-in-progress icon and submit the entire page for publication.

  35. Return to "Read" mode and experiment!