The HTML Editor

The HTML Editor is used to create web pages within your course(s). There are 3 feature components that the HTML Editor is available:

Journal
My Personal Homepage

Discussions

Locating the HTML Editor

To find the HTML Editor in the Journal area, click on the Journal link on the Navigation bar of your course. 

Click on the Add Entry button within either the Personal tab or the Course tab.

The HTML Editor icon is located above the upper right corner of the Content textbox. How to use the editor will be explained with the Discussions component.

To find the HTML Editor in the My Personal Homepage component, click on the My Personal Homepage link from the Welcome area on either the My Home page or the Course Home page.

Create a new web page by clicking on the New icon.

Type a name for your web page file and click on the OK button.

To locate the HTML Editor, look to the far right side of the web page file name and click in the Edit icon. How to use the editor will be explained with the Discussions tool. 

To find the HTML Editor in the Discussions area, click on the Discussions link from the Navigation bar.

Click on a Topic link from a Discussions Forum.

Click on a Discussion Message that has been posted or create a new message by clicking on the Add Message button.

This training will use the Reply to a message feature. Before you reply to the message, select Without Message from the Dropdown menu. Click on the Reply button.

Click on the HTML Editor icon that is located above the text box area in the upper right corner.

The HTML Editor will open in its own window.  The tool options across the top of the editor are similar to a word processing application.

· Cut, Copy, or Paste text

· Undo, Redo, Left Justify, Center Justify, or Right Justify text

· Numbered Lists, Bullet lists, Outdent, Indent, Superscript, Subscript, or Spell Check text

Some of the tool options on the second line are:

• Paragraph Style, Font Style, and Font Size
• Bold, Italics, Underline, and Font Color

The rest of the tool options in the second row will be discussed individually.  The first tool is the Insert a Picture from Website. Click on the button.

The Insert Image window will open.  You will need to specify the URL location of the picture you want to insert.

Open a new browser and find the location of the picture.  Right click your mouse on the picture and then select Properties from the menu.

In the Properties window, highlight the URL address and then place your mouse over the highlighted area and right click the mouse.  Select Copy from the menu.  Click on the Cancel button of the Properties window.

In the Insert Image window, highlight the URL text in the textbox and then right click your mouse on the highlighted area and select Paste.  The picture URL address will be pasted into the textbox.

Enter a short description of the picture in the Alternative Text textbox.  Then click on the Insert button.

The image will display in the HTML Editor.  Click on the Insert button.

In the body of the Reply message you will notice HTML coding; this is normal.  Click on the Submit button.

The next tool option is the Insert Table button. 

Click on the Insert Table button. A dropdown menu containing empty white boxes represent table cells.  Choose the amount of rows and columns you need by dragging your mouse over the cells.  The chosen cells will be colored. Click on the left mouse button to select the colored cells.

The table will appear in the HTML Editor. Click inside one of the cells and begin to type.  Do the same for the other cells.

If you wish to change the properties of the table cells, place your mouse over the table and right your mouse to gain access to the properties menu.  Select Set Cell Properties.

Make the necessary changes and click on the Update button.

The next tool option is the Insert URL Link button. 

1. Type in a link title for the URL in the Link Caption textbox.
2. Type in the full URL address of the desired website in the URL textbox.
3. Select the option you want for the Open In options. (Whole Window, Same Window or New Window)
4. Click on the Insert button

The link will be imbedded into the HTML page.

The next tool option is the Insert Symbol button. 

Click on the symbol you want to use and then click on the Insert Button.

The last tool option is the Insert Equation button.  In order for the equation editor to function properly, you will need to have Java Runtime loaded on your computer. (http://www.java.com/en/download/manual.jsp)

Create your equation using the buttons along the top of the editor.  Click on the button and select the appropriate equation symbol.

When you are done creating the equation, click on the Insert button.