E-mail this pageCreating Web Content
Before you start to create content, you should always take care to ensure that the active subweb (indicated towards the top of Widget's right window) is the one in which you want that content to reside. This will make it easier for you to find the content later, and will make it easier for you to assemble the pages that use that content. If the active subweb isn't the correct one, navigate through the folder list in the left window and click on the correct subweb. The You are here
designation should change accordingly.
Once you have determined that you are working in the correct subweb, the process of creating new content begins with clicking on the Create Content
button. Doing so will introduce a window offering you the chance to specify a title for the content you are about to create. 
There are few restraints on the title you give your content pieces. Although the site visitor will never see the titles you give content pieces, you will find it easier later to incorporate that content onto a page if you give it a title that is clear and descriptive.
Once you've given a title to the content you're about to create, click the Create Content button to actually get to the work of creating it. The screen that appears will show you the Widget web content editor.
Using the editor
The Widget web content editor is a WYSIWYG (what you see is what you get) tool for creating HTML. Conveniently, it requires no knowledge of HTML of the user, and it features a toolbar featuring, for the better part, a range of familiar icons and functions.
|
Cut , Copy , and Paste . These work just as they do in any other windows application. The corresponding shortcut keys (CTRL+X, CTRL+C, CTRL+V) also work. Note, though, that if you are pasting from a Microsoft Word document, you are better served by the Paste from Word button (see below). |
|
Undo , Redo . These functions should also be familiar from other Windows applications. The corresponding keyboard shortcuts (CTRL+Z, CTRL+Y) also work. |
|
Bold , Underline , Italics . More familiar functions. A word needn't be highlighted to apply these functions--the cursor needs only to be positioned somewhere within the word. The buttons toggle their respective formatting on and off. Note that you should avoid using underlining on web pages, since that is the common designation for hyperlinks. The keyboard shortcuts do not work for these buttons. |
|
Numbered List , Bulleted List . These are used, as in other Windows applications, to create numbered or bulleted lists. The numbered list option creates only numbered lists in the WYSIWYG mode. To create an ordered list that uses letters, you'll first have to create a numbered list and then click on the "Source" tab on the bottom of the screen, find the ordered list tag (it looks like this: <ol> ), and add type="a" for lowercase letters, type="A" for uppercase letters, or type="i" for Roman Numerals--i.e. <ol type="A"> |
|
Decrease Indent, Increase Indent. This creates a "blockquote" tag in HTML, and is used to create indented passages. It works as it does in Windows word processors. |
|
Superscript , Subscript . Select the character(s) to which you wish to apply the formatting, and then click the button. |
|
Align Left , Align Center , Align Right , Justify . These options work as they would in a word processor, but should be used sparingly, if at all. The default left alignment of text is standard on the web site; and, face it, centering the text on a web page just makes the page look silly. |
|
Insert Horizontal Line . This does just what you'd think it would--it inserts a horizontal line. Use this sparingly. |
|
Create or Modify Link . To create a hyperlink, select the word or words that you'd like your site visitors to click on, and then click this button. You'll be met with a Link Manager dialog asking you to specify the URL (i.e. the full web address of the page you'd like to link to), a Target Window , and an Anchor (a specific marked location on the destination page, if one exists). You can pick the Target Window from the drop-down list--"_blank" will give you a link to a new window, while leaving the Target Window field blank will create a link that will load the destination page in the place of the current page. The only vital piece of information here is the URL . The example below creates this link to the default.asp page on the research web server .
To edit or remove an existing link, first select the text that is currently linked, and then click on the Create or Modify Link button. |
|
Insert/Modify Anchor . This allows you to create "Anchors" on longer pages, allowing you (and others) to create links to a point, for instance, halfway down a page.
The Anchor Name should be a single word (no spaces or punctuation marks). Ideally, you should probably be creating shorter pages than relying on anchor tags to help visitors navigate through masses of material. |
|
Create E-mail Link . To create an e-mail lin, first select the word or words you would like the site visitor to click on, and then click on the Create Email Link button.
You'll be presented with a dialog asking you to specify an e-mail address (to whom the mail will be sent) and an optional subject line (allowing you to stipulate a default subject line for all messages sent from that web page. |
|
Format Text . HTML really doesn't want you to go wild with your formatting, and it relies upon a fairly simple, regular set of format designators for most of its work. To apply a format, first select the word/words to which the format should be applied, and then select the desired format from the drop-dwn list. The format specified as "Normal" will cover the bulk of your text, except for headings, and these, not surprisingly, should be formatted with one of the heading formats. You pick your heading level based on sound principles: a heading 5 shouldn't be chosen just because you like the size of it, but rather because you've somewhere got a heading 4 that has two subsections. If you consider that the web template already assigns heading 1, your first heading in any given content piece should be a heading 1 or a heading 2, and new heading levels should only be employed if you are dealing with subsections of previous headings. |
|
Style . You can probably disregard this section, as the special styles defined here are for special purposes. If you need to use them, you'll be told to use them. |
|
Table Functions . This button introduces a range of table creation and formatting options that won't be discussed here since we'd really, really, really like to see an end to using tables for layout purposes. |
|
Form Functions . This button introduces a range of form creation functions too involved to be covered in this brief overview. |
|
Insert/Modify Image . If an image has been selected, this button will introduce the "Image Properties" dialog, in which the image's dimensions, alignment, and alternate textual representation can be set. If no image has been selected, this button will introduce the Insert Image dialog. If the image you wish to include in your content has already been uploaded, you'll be able to pick it from a screen featuring thumbnails of all images uploaded to the active folder. If the image hasn't been uploaded yet, you can, from the same Insert Image dialog, select an image from your hard drive, upload it, and then select it for inclusion with your content. For more on Images, please see the Working with Images section of this site. |
|
Insert Special Characters . This provides a rather sparsely populated list of special characters that you can pop onto your web page by selecting one of them. |
|
Clean HTML Code. If you aren't creating your work directly in Widget, it's a good idea to click the Clean HTML Code button before saving your work. This function serves to ensure that the HTML code meets web site standards. |
|
Paste from Word. This paste option, unlike the one above, strips away the unwelcome formatting elements that often appear in Word documents, and it helps to ensure that your content won't suddenly be overcome by unmanageable font changes. |
At the bottom of the editor's editing window, there are three tabs. The default (Edit), gives you a WYSIWYG editing window to work with. The Source tab lets you see and edit the underlying HTML code. And the Preview tab lets you see how the page looks.
Finally, beneath the editing window, you'll see Save and Save As... buttons. These do what you'd expect them to do. Don't forget to save your work. Once you click the Save or Save As... buttons, your web content will be saved, and you'll be returned to a view of all items in the currently active subweb.