HTML Editor

 



About the HTML Editor | Top

The HTML editor provides word-processor-like features that display text and graphics the same as they will appear in a browser. Depending on administrator settings, the HTML editor may be available in the following tools: Discussions, Mail, Student Homepages, and Student Presentations. The What You See Is What You Get (WYSIWYG) Hypertext Markup Language (HTML) editor allows you to create and publish content on the Web without having to know HTML.

For more information about the HTML editor, on the HTML editor toolbar, click About About button. The About dialog box appears.

About the different views in HTML editor | Top

The HTML editor allows you to work on your content in two different ways—using WYSIWYG view, which displays text and graphics as they will appear in a browser, or using HTML View, which displays the HTML code.

To change the view in which you're working, on the HTML editor status bar, click WYSIWYG or HTML View.

Expanding or shrinking the toolbar | Top

If you want to expand or shrink the toolbar in the HTML editor, click Shrink the toolbar Shrink the toolbar button or Expand the toolbar Expand the toolbar button. The toolbar shrinks or expands.

Showing all paragraph marks | Top

You can show or hide paragraph marks and other formatting marks. Showing paragraph marks helps you see where each paragraph ends. To show all paragraph marks, click Show All Show All button. The paragraph marks and other formatting marks show.

Using the HTML editor on a Macintosh | Top

If you are working on a Macintosh, before you exit the HTML editor, make sure you save your changes by clicking Save Save button. If you exit the HTML editor without saving, any changes you made in the HTML editor will disappear.
HTML editor will disappear.

Entering Text | Top

You can enter text in the HTML editor the same way you enter text in a word processor.

  1. In the tool, click HTML editor. The HTML editor appears.
  2. In the editing area, enter your text.

Formatting Text | Top

Changing the font of text | Top

Note: The default font type is Serif.

  1. Select the text you want to change.
  2. From the Font Type drop-down list Font Type drop-down list, select a font type. The selected text is modified.

Changing the size of text | Top

Note: The default font size is 12.

  1. Select the text you want to change.
  2. From the Font Size drop-down list Font Size drop-down list, select a font size. The selected text is modified.

Applying bold formatting to text | Top

  1. Select the text you want to change.
  2. From the toolbar, click Bold Bold button. The selected text is bold.

Applying italic formatting to text | Top

  1. Select the text you want to change.
  2. From the toolbar, click Italic Italic button. The selected text is italic.

Underlining text | Top

  1. Select the text you want to change.
  2. From the toolbar, click Underline Underline button. The selected text is underlined.

Changing the color of text | Top

  1. Select the text you want to change.
  2. From the toolbar, click Font Color Font Color button. The Colors dialog box appears.
  3. Under Standard Colors, click a color. Note: If you mouse over a color, the color's name and hexadecimal code appear in the dialog box's title bar.
    The color of the selected text changes.
    • If you want to add a custom color:
      1. In the RGB text box, enter a hexadecimal code.
      2. Click Add to custom colors.
      3. Under Custom Colors, click the custom color. The color of the selected text changes.

Formatting Paragraphs | Top

Applying a paragraph format | Top

  1. Click the paragraph you want to change.
  2. From the Paragraph Format drop-down list Paragraph Format button, select a format. The selected paragraph is modified.

Aligning text with the left margin | Top

  1. Select the text you want to change.
  2. From the toolbar, click Align Left Align Left button. The text is aligned to the left.

Centering text | Top

  1. Select the text you want to change.
  2. From the toolbar, click Center Center button. The text is centered.

Aligning text with the right margin | Top

  1. Select the text you want to change.
  2. From the toolbar, click Align Right Align Right button. The text is aligned to the right.

Increasing the left indent of an entire paragraph | Top

  1. Select the paragraph you want to change.
  2. From the toolbar, click Increase Indent Increase Indent button. The indent increases.

Decreasing the left indent of an entire paragraph | Top

  1. Select the paragraph you want to change.
  2. From the toolbar, click Decrease Indent Decrease Indent button. The indent decreases.

Adding Bullets or Numbers to a List | Top

  1. In the editing area, click where you want the list to appear, or select the item(s) you want to add bullets or numbers to.
  2. From the toolbar, do one of the following:
    • To add bullets, click Bullets Bullets button.
    • To add a numbered list, click Numbered List Numbered List button.
    • To add an alphabetical lists, click Alphabetical List Alphabetical List button.

    Note: When you press Enter to add the next list item, the HTML editor automatically inserts the next bullet or number. When you want to finish the list, click Bullets Bullets button, Numbered List Numbered List button, or Alphabetical List Alphabetical List button again.

Moving or Copying Text and Images | Top

  1. Select the item you want to move or copy.
  2. Do one of the following:
    • To move the item, from the toolbar, click Cut Cut button.
    • To copy the item, from the toolbar, click Copy Copy button.
  3. Click where you want the item to appear.
  4. From the toolbar, click Paste Paste button.

Inserting Text from Another Source | Top

You can insert text from another source into the editing area.

  1. Copy the text from the other source.
  2. In the editing area, click where you want the content to appear.
  3. From the toolbar, click Insert Text Insert Text button. The Paste Text from Clipboard dialog box appears.
  4. Paste the text into the dialog box by pressing CTRL+V.
  5. Do one of the following:
    • If the text is in plain text format, select Plain Text.
    • If the text is in HTML format, select HTML.
  6. Click Ok. The text is inserted.

Inserting a Symbol | Top

  1. In the editing area, click where you want to insert a symbol.
  2. From the toolbar, click Insert Symbol Insert Symbol button. The Insert Symbol dialog box appears.
  3. Click the symbol you want to insert. The symbol appears in the Insert box.
  4. Click Insert. The symbol is inserted.
  5. To close the Insert Symbol dialog box, click Close.

Inserting an Image| Top

  1. In the editing area, click where you want to insert an image.
  2. From the toolbar, click Insert Image Insert Image button. The Insert Image dialog box appears.
  3. In the Source text box, do one of the following:
    • If the image is saved in the main My-Files folder, enter the filename of the image. For example, to insert an image named Europe_map.gif, which is saved in the main My-Files folder, enter Europe_map.gif.
    • If the image is saved in a folder in My-Files, enter the path and filename of the image. For example, to insert an image named Asia_map.gif, which is saved in a folder named Maps in the main My-Files folder, enter Maps/Asia_map.gif.
    • If the image is on a different web site, enter the full address of the web site, the path, and the filename of the image.
  4. In the ALT-String text box, enter a short description of the image. This text displays in a browser when you mouse over the image.
  5. In the Border Width text box, enter the width of the border in pixels.
  6. In the Size text boxes, enter the width and height of the image in pixels, and click Ok. The image is inserted.

Inserting a Horizontal Line | Top

  1. In the editing area, click where you want to insert a horizontal line.
  2. From the toolbar, click Insert Horizontal Line Insert Horizontal Line button. A horizontal line is inserted.

Inserting and Modifying a Table | Top

Inserting a table | Top

  1. In the editing area, click where you want to insert a table.
  2. From the toolbar, click Insert Table Insert Table button. The Table Properties dialog box appears.
  3. Select the desired number of rows and columns; the table, row, column, cell, and color properties, and click Ok. The table is inserted.

Inserting the default table | Top

The HTML editor's default table has four columns and three rows.

  1. In the editing area, click where you want to insert the default table.
  2. From the toolbar, click Insert Default Table Insert Default Table button. The table is inserted.

Adding a row to a table | Top

  1. In the table, click in a cell above or below where you want to insert the row.
  2. From the toolbar, click Insert Row Insert Row button. The Insert Row dialog box appears.
  3. Select the position in which you want to insert the row and click Insert Row. The row is inserted.

Adding a column to a table | Top

  1. In the table, click in a cell to the left or right of where you want to insert the column.
  2. From the toolbar, click Insert Column Insert Column button. The Insert Column dialog box appears.
  3. Select the position in which you want to insert the column and click Insert Column. The column is inserted.

Inserting a Hyperlink | Top

You can create a link from text or an image to another document or web site.

  1. Select the text or image you want to represent the hyperlink.
  2. From the toolbar, click Insert Hyperlink Insert Hyperlink button. The Insert Hyperlink dialog box appears.
  3. In the Href text box, do one of the following:
    • If you want to insert a link to an HTML document saved in the main My-Files folder:
      1. Delete http://.
      2. Enter the filename of the document. For example, to insert a link to an HTML document named European_history.html, which is saved in the main My-Files folder, enter European_history.html.
    • If you want to insert a link to an HTML document saved in a folder within the main My-Files folder:
      1. Delete http://.
      2. Enter the path and filename of the document. For example, to insert a link to an HTML document named Asian_history.html, which is saved in a folder named History in the main My-Files folder, enter History/Asian_history.html.
    • If you want to insert a link to a web site, enter the full address of the web site, including the protocol http:// or https://.
  4. To the right of the Target text box, click Target button and select the location in which you want the link to appear.
  5. Click Ok. The hyperlink is inserted.

Inserting HTML | Top

You can insert an external HTML page.

  1. In the editing area, click where you want to insert the HTML file.
  2. From the toolbar, click Insert HTML Insert HTML button. The Insert HTML file at current position dialog box appears.
  3. In the URL text box, following http://, enter the full address of the web site, the path, and the filename of page.
  4. Click Ok. The page is inserted.

Checking Spelling | Top

  1. From the toolbar, click Spelling Check Spelling Check button. If the HTML editor finds a possible spelling error, the Check Spelling dialog box appears.
  2. Make your changes.
  3. When the spell check is complete, click Ok.