Orientation Home Log In My Home My Course Home Assignments: About Assignments: Accessing and Submitting Attendance Calendar Chat Checklists Classlist Content HTML Editor Discussion: About Discussion: Access Discussion: Posting New Discussion: Respond Email: Basics Email: Read, Reply, Manage Email: Folders Email - Send Using Classlist Grades Groups Progress Summary Quizzes: About / Access Quizzes: FAQ Quizzes: Summary Quizzes: Start Quiz Quizzes: View Attempt Self Assessment Surveys Accessibility _

Online Campus - HTML Editor

About the HTML Editor

The HTML Editor integrates with all Online Campus tools that have HTML content creation capabilities. For example, the HTML Editor is available when you post to discussion topics or compose emails.

HTML Editor Interface

Depending on your screen resolution, you may not see all the available tools in the HTML editor. So show all tools select the Show Extra Components button. It resembles an ellipsis (three dots). Show Extra Components button If you do not see the icon, all choices are available.

Insert Options

  1. Insert Stuff: Insert a variety of document.
  2. Insert Image: Add an image to your document. From your computer, within your course, or the internet.
  3. Insert Quicklink: Add a link to a page on the internet.
  4. Drop-Down: The drop-down menu next to this button allows you to insert special symbols (for example, Greek alphabet characters.
  5. Insert Symbol: Used to insert special characters such as ©, €, ∞, and other symbols not included on the standard keyboard.
  6. Insert Line: Add horizontal line.
  7. Insert Attributes: Add alternative text to images already added to your page.

Paragraph Styles

Paragraph Styles

Paragraph Styles: Used to specify the text formatting. Use this button to add headings.

Text Formatting Options

Bold, Italic, Underline, Subscript, Superscript options

  1. Bold: Make your text bold.
  2. Italic: Make your text italic.
  3. Underline: Add underlining to your text.

Select the drop arrow to access items 4-6

  1. Strikethrough: Strikethrough selected text.
  2. Subscript: Add a subscript.
  3. Superscript: Add a superscript.

Align Text Options

Align Text Options

  1. Indent: Indent your text.
  2. Outdent: Outdent your text. (Move it to the right.)
  3. Unordered List: Create a bulleted list.

Select the drop arrow to access items 4-10

  1. Ordered List: Create a numbered list.
  2. Align Left: Align your text to the left.
  3. Align Right: Aligns your text to the right.
  4. Align Center: Center align your text.
  5. Align Full: Justify your text equally between the left and right margins.
  6. Paragraph Left to Right: Add text from left to right.
  7. Paragraph Right to Left: Add text from right to left.

Change Font

Font Family, Font Size, Font Color options

To access all the options for the following items, select the drop arrow next to each item.

  1. Font Family: Change the font (e.g., Arial, Times New Roman, etc.)
  2. Size: Change the text size.
    • Note: It is best to use the preformatted headings for text that is introducing a subject. Headings provide important accessibility attributes.
  3. Color: Change the text color. 
    • Note: Be sure to look at the WCAG information when changing text color. Abiding by WCAG recommendations means your text will be accessible to more people.

Tables

Insert table option

Tables should be used sparingly due to accessibility reasons.

Note: All tables should have a row or column that designates the information in the table and should be tagged using the accessibility checker tool. Adding tagged cells to label data allows a person using a screen reader to understand the information that is being presented.

  1. Select the Insert Table option
  2. Select an initial number of rows and columns.
    • You can add rows and columns using the Table Properties option.

Table Properties

Table Properties

Once a table is added, use the additional table options available customize and edit your table

Add Mathematical Text

Add Mathematical Text

Insert Graphical Equation: Add Mathematical text through the D2L graphical equation editor. 

Note: If you know other mathematical markup languages, click the down caret to access equation editors employing LaTeX or MathML languages.

Undo and Redo

Undo and Redo options

  1. Undo: Undo your most recent action.

Select the drop arrow to use the redo option

  1. Redo: Redo the most recent action

Cut and Copy

Cut and Copy

  1. Copy and cut selected text.
  2. Copy selected text.

How to Paste Copied Items in the Online Campus HTML Editor

When pasting items in the HTML editor, you need to be aware that sometimes unintended code can be pasted behind the scene. Code left behind the sceen may affect the formatting of the item that was pasted and makes the HTML editor not function correctly when you try to format other texts in other parts in the HTML editor. The unintended code may also be read by a screen reader.

The best practice is to remove any formatting associated with the copied text and paste as plain text. You will be able to format using the Online Campus HTML editor.

To paste copied text in Online Campus

  1. Access the HTML editor in Online Campus.
  2. Place the cursor on the location where you would like to paste the text.
  3. Press CTRL, Shift, and V keyboard keys at the same time. This removes any formatting that may interfere with others being able to read your text... Especially if they use assistive technology.
    • If you use a mouse, you can right-click the location and select the appropriate paste option.

To paste an image in Online Campus

  1. Place the cursor on the location where you would like to paste the image.
  2. Press CTRL, and the V keyboard keys at the same time.
  3.  Use the Check Accessibility option to apply alternative text.

Note: If you use a mouse, you can right-click the location and select the appropriate paste