HTML Editor in Desire2Learn

Version 10.3 and Higher

The HTML editor in Desire2Learn is available when creating content files or editing titles and descriptions. The tools in the Editor allow the user to create, edit and format text and images in a WYSIWYG (What You See Is What You Get) environment that are automatically displayed in the various Desire2Learn contexts. Additionally, the editor creates the HTML source code allowing a writer to toggle back and forth between WYSIWYG and source editing tools.

The HTML Editor integrates with all Learning Environment tools that have HTML content creation capabilities. For example, the HTML Editor is available when editing discussion topics, creating custom instructions for dropbox folders, creating module titles and content topics.

There are several ways to access the HTML Editor:

  • Click on any applicable text field.
  • Select Edit HTML from the dropdown menu for a content item.
  • Some tools activate the HTML Editor automatically.

HTML Editor screenshot
HTML Editor in Desire2Learn

Click inside the main area of the HTML Editor and begin adding content.

Additional information on the HTML Editor can be found at HTML Editor in the Desire2Learn Online Resource Center.  Following this link will direct you away from the UW-Platteville ICET Website.

HTML Editor Views

The HTML Editor has three ways in which you can view content:

  1. Design View
  2. Source Editor View
  3. Preview

The Design View loads automatically when the HTML Editor is accessed. Use the HTML Editor design view to quickly create and format content without needing any prior knowledge of HTML. Enter content and use the available controls to apply formatting to text, insert images and tables, and create links. Click the Show All Components/Hide Extra Components icon show hide all icon to view additional controls.

Text can be typed directly into the HTML editor or copy and pasted from another location. When composing content as text in another application (such as a word processor), copy and paste unformatted content into the HTML Editor using the following paste features:

  • Use the Paste as Plain Text icon  to paste formatted content as plain text.
  • To copy and paste content directly from Microsoft Word, use the  Paste from Word icon .
  • Media can be added to the text using the Insert Stuff menu Insert stuff icon

Note: It is recommended that any formatting be removed before copying and pasting text into the HTML Editor. Copying formatted text from word processing applications and pasting it into the HTML Editor can add disruptive code to the application.

HTML Screenshot of Design View
HTML Editor Design View

The Source Editor View can be accessed by clicking the  HTML Source Editor icon . This view displays the code that structures and formats content. Users with experience using HTML who prefer to author content in HTML or apply styles from a cascading style sheet (CSS) may choose to use this view. HTML-based content from another application can also be copied and pasted into the HTML Source Editor.

Screenshot of HTML Source Editor View
HTML Source Editor View

Click the  Preview icon  to display a preview of the HTML content in a new window to ensure that it displays as expected prior to saving any changes.

Screenshot of HTML Preview window
HTML Editor Preview

Using the Spell Checker in the HTML Editor

Click the Check Spelling icon . The Spell Checker identifies spelling errors in red font, highlighting the first misspelled word in yellow. Suggested replacement text displays in the Suggestions drop-down list.

Spell Check popup window
Spell Checker Window

Inserting equations in the HTML Editor

The Equation Editor is used to insert mathematical equations within the HTML Editor. The Editor has three options: MathML, LaTeX, or graphical equation editor.

Access the Equation Editor by clicking on the icon  and choosing one of the following math formats:

  1. MathML is a standard adopted by the World Wide Web Consortium (W3C) which uses XML to describe mathematical notation by capturing both its structure and content. This enables MathML to support visual display and assistive technology access. 
  2. LaTeX is a typesetting system based on TeX. It provides a text syntax for complex mathematical formulae. 
  3. The Graphical Equation Editor is a Javascript-based application that features a tool bar equipped with a selection of buttons. This tool bar provides the necessary elements to construct equations quickly and easily. Each button in the Equation Editor tool bar opens a palette of related mathematical symbols.

Note: Before using the Graphical Equation Editor, ensure that Javascript is enabled and the pop-up blocker is disabled.

The equations will be displayed as a symbol block in the HTML Editor window, but will appear as a mathematical equation after Publish is clicked.

Equation Editor screen shot
Graphic Equation Editor

If you need further assistance, contact or phone 608.342.1792

Footer Anchor