The Brightspace HTML Text Editor

Relevant to: faculty and staff

This article contains information considered accurate at the time of publishing. Technology updates, changes in University security practices, policies and procedures may effect the information in this article - updates to articles are scheduled on a periodic basis and will address any required changes.

Introduction

The Brightspace learning management system is Web-based and uses HTML (Hyper Text Markup Language) to create and edit Discussion Posts and most content that will be displayed as a web page. The Brightspace WYSIWYG (What You See Is What You Get) HTML editor removes the need for users to understand HTML programming to create webpages while allowing individuals familiar with HTML the option to work directly with the code.

What to know about the HTML Text Editor

Since HTML editors are formatting for a web page, there are some key do's and don'ts to keep in mind. Important things to remember about text editors:

  • What you see in the text box, may not look the same when displayed as a full web page in a browser.
  • Keep formatting simple. Use the formatting options in the tool bar of the editor, it insures the final display will be accessible to all students while meeting any specific formatting options for APA and MLA citations.
  • Do not copy and paste highly formatted text from WORD. The editor will interpret the formatting into HTML code and complex formatting can result in strange code that will affect how the page is displayed. Simple is better when copying and pasting content. It is recommended to copy and paste from Word into Notepad or TextEdit to strip out complex formatting or to paste text using the keyboard shortcut Control-Shift-V on Windows or Command-Control-V on Mac to paste copied text without formatting.
  • Create tables using the table icon and enter the content. Never copy and paste a table from a WORD document or an internet site. (Again, think extra code that can cause issues).

Brightspace Editor Layout

Use the Brightspace editor to:

  • Insert images.
  • Add hyperlinks to text, files or URLs.
  • Add tables.
  • Change Text -- text header, size, font and more.
  • Embed LEARNscape video.

Most Commonly Used Features

Screenshot of the most commonly used features in the Brightspace text editor.

  1. Bold/Italics/Underline: Select the text and click to add bold/italics/underlining or use the Control+B/Control+I/Control+U keys shortcut.
  2. List: Create a bulleted or numbered list.
  3. Insert Stuff: Add media such as a LEARNscape media file, YouTube video, Brightspace video note, or other links.
  4. Quicklink: Use to link selected text to a file in Brightspace or an external resource. You can also use Quicklinks to link to activities and resources you have added to your Brightspace course. For instance, you can link to an "Ask the Instructor" discussion topic in a different activity's description by using Quicklinks.
  5. Image: To add an image, click and then select the image from file picker.
  6. Table: Click to add a table to a page.
  7. Source Code: Click to view and edit the HTML code
  8. Undo/Redo: Undo or Redo any action within the text box.

Add Table Borders

Brightspace content pages containing tables may not properly display cell border row or column lines. If you are adding a table to your content, follow these instructions to add border lines for your table.

 

  1. In the HTML Editor, select the Table icon to insert and create initial properties for the table.
  2. Select any cell of the table you wish to add borders to and select the Table icon again to open a dropdown menu.
  3. From the dropdown menu, select Table Properties.
  4. Under the General Tab, you can define the border width by typing a number in the Border width box (this measurement is in pixels).
  5. Under the Advanced Tab select the Border Style you wish from the dropdown menu, then the border color from the color picker.
  6. The Background Color controls the cell color.
  7. Once satisfied, select Save and your choices should be displayed automatically in the HTML editor.
  8. To save your settings, select Save and Close.
Print Article