Rose Colored Glasses

Creating a Page Using the HTML Editor

This tutorial will assist you in posting pages to Angel courses. To print this page for reference click on the Print link located at the top right-hand-side of this window.

1. Open your sample course and click on the Materials tab.
2. Next click on the Settings link located under the "Instructor Overview" or "Meet the Instructor" content page created Week 3. The content page form will be displayed.
3. Click on the HTML Editor link below the Page Text field.
4. Paste or type your introduction information into the text area then edit the materials with the Word like functions located at the top of the editor.
   
   
   1. Text format – this function allows for the creation of headers and other text types. Highlight the text to be changed, click on the drop-down arrow next to the field, then click on the desired style.
   2. Font type – highlight the text to be changed, click on the drop-down arrow next to the field, then click on the desired style.
   3. Font size – highlight the text to be changed, click on the drop-down arrow next to the field, then click on the desired size.
   4. Spell check – works like most spell check tools
   5. Clean HTML content –
      When inserting one or more paragraphs already formatted
      by another word processor, say, Microsoft Word, the size of
      the HTML code could increase considerably. This phenomenon is due to the export
      methods used by the two applications, that insert into the HTML code many
      and mostly useless HTML tags. You can clean the
      text of these tags by using the “Clean HTML Code” option. The result is a cleaner and more accurate code.
   6. Undo and redo – Functions just like the undo and redo buttons in most PC software packages.
   7. Cut, copy and paste functions – These functions work like those found in Word.
   8. Font styles – These functions work like those found in Word.
   9. Horizontal line –
      this function allows you to insert horizontal lines into the page, in order to visually separate elements.
   10. Table tool – this tool will insert a table into the page where the cursor is placed.
       When the button is clicked a pop-up browser window will be displayed to help you set the number
       of rows and the number of columns, and the border width for the new table.
   11. Hyperlink tool –
       links can be applied either to text selections or to pictures. You can
       link your page to other site pages, to external sites, to downloadable
       files or to an anchor within the same page. To insert a link, you have
       to select the desired text/image and then click the Hyperlink button from the toolbar. A Link Inspector window will be displayed at the bottom of the screen. If linking to an external source paste the URL in the URL field. If linking to other content in the course click on the book icon to the right of the URL field, navigate to the materials, then click on the resource to be linked.
   12. Image tool –
       you can insert images into your page using the Insert
       Image function. After pressing the image button, a pop-up window will be displayed,
       to help you select the desired picture from your course library, or to
       upload a new one.
       
       
       
       To upload a new image and insert it into your page:
       1. Click on the Image icon. A Image Directory popup window will be displayed
       2. Click on the [Upload Image] button located at the bottom of the Image Directory popup window. The Upload Image popup will be displayed.
       3. Click on the [Browse] button. Your computer file menu will be displayed.
       4. Navigate to the image to be uploaded and click on the image. The file location of the image will be copied into the Upload Image popup.
       5. Click on the [Upload] button. The Upload Image popup will close and the Image Directory popup will be displayed with a thumbnail of the image.
       6. Double-click on the image and enter a short description of the image in the Alternate Text field.
       7. Click the [OK] button. The popup window will close and the HTML page will display the image.
   13. Text color and background selection tools – These functions work like those found in Word.
   14. Subscript and superscript tools – These functions work like those found in Word. The superscript and subscript formatting tools are useful for mathematical exponents and expressions. When superscript or subscript are active
       the button is highlighted. To remove the formatting select the
       button while the text highlighted.
   15. Math function tool – this tool is used for inserting special math elements such as
       auto-sizing parenthesis, radicals and more. The blue area of each element
       indicates where the currently selected text will be placed when the macro
       is inserted. To insert a math element simply select the text to which the
       element should be applied and click on the desired math element.
   16. Text alignment tools – These functions work like those found in Word.
   17. Bullet tools – These functions work like those found in Word.
   18. Text indent and outdent tools – These functions work like those found in Word.

Note: if you click on the question mark icon then on one of the tools a popup box defining the tool will be displayed.

5. Add your picture or an image that you would like to represent you to your introductory narrative. For assistance with this activity follow the steps noted in item 12 listed above.