HTML | How to create an online file using HTML templates in Brightspace

In Brightspace you can create files online to provide information to your students. These files are called HTML files and have pre-programmed templates to choose from.

The advantage of these online HTML files is that they are easily editable by you or other course lecturers /coordinators without the need to download and upload the file (as is the case with Word or PDF). In the HTML file, you can also add links to other Brightspace content (such as modules, content items, quizzes, assignments, etc), images and videos. You can manage the HTML file in your Brightspace content as you would do with any other content item, meaning you can add restrictions and/or start dates.

Furthermore, when the course is copied these files are copied as well, including all the functionalities of the original course content item (with the links to the Brightspace content updated to the current course copy, content item restrictions and/or start dates).

This article shows how to:

How to create the Brightspace HTML file

Navigate to your Brightspace course, then in the green navigation bar

  1. Click on Content in your course
  2. Go to the module where you want to add an HTML file
  3. Click Upload/Create

A drop-down menu will open

  1. Click Create a File
To access the Create a File function in Brightspace click the Content in the navigation bar, then select the module for placing the file, then click the button Upload/Create and from the list click on Create a File.

This will lead you to the HTML editor, then:

  1. Write the title of your file (editable afterwards)
  2. Click the button Select a Document Template to choose from the list of pre-programmed templates
  3. Click the [pre-programmed template] you want to use

It is advised to use HTML templates as it would improve viewing in different screens (PC, mobile, and tablet). The content placed without an HTML template will not be responsive to the different sizes of the screens the reader might use.

In the Create a File page click first in the field to enter a title for the file, then click the button next to it called Select a Document Template and select the template you want to use.

After selecting a pre-programmed template from the list you can start editing the template with text, images, videos, links, etc. In the image below you can see an example of a file that is using the template 03_text-with-images.

tamplate example: Text with images

Each pre-programmed template comes with instructions at the end of the template text to explain how to create it.

Brightspace pre-programmed HTML templates

The pre-programmed templates have been created to provide simple and quick structure to most common uses of content creation (for videos, for text with images, simple text, etc).

If you decide to change the template after you already selected one and have added text, or other content, you will loose all your work as the new template replaces completely the previous template and its content.

Template name Short description

01_course-contacts

 The Course Contacts template includes a list of fields where you can add contact details ( course role / Email/ Work phone / Office location / Office hours) and photos of the educators.

02_text-with-banner

 The template is a general-purpose layout for content that includes text. It provides format for body text, main heading and subheadings.
03_text_with_images This template provides you with a structure to combine text and images in a certain way.
Images can be added to any of your HTML files to create visual interest and help break up text-heavy courses.
04_videos-full-page The Video template includes a layout for an embedded YouTube video, which can scale in any browser or mobile device. Embedding videos in this manner is a great way to present video content, while accompanying it with supporting context, explanations and activities.
05_intro  The template provides a layout that allows you to communicate the learning structure, requirements, completion criteria, as well as the “What’s in it for me?”, meaning the value to the learner.
06_conclusion  The template is a general-purpose layout for content that includes text.  Ideal to use for conclusion in a module.
07_C+Basic The template is a general-purpose layout for content that includes text. It provides a format for body text, boullet points and a Creator + Callout element
08_accordion_menu_not creator+ The template provides a layout for a textual content that can be arranged under fold-able sections into one, two, or three columns.

All templates, except the 08_accordion, are compatible and can be combined with elements from the Creator+.

For more information about Creator+ visit the article How to set up Creator +

How to add content to the template

You can use the HTML editor to make quick and easy changes without needing any prior knowledge of HTML. Enter your content and use the available controls to add links, pictures, equations, and apply formatting to your text.

For overview of HTML editor control please visit: About the HTML Editor

What do you want to do? How to do it

Add text 

 How to add text in the Editor

Add an image

 How to Insert Image in the Editor

Add a video
(YuJa, YouTube, Video Note, mp4)
  1. Embedded in the content: Use the    
  2. As an URL: How to insert Quicklinks in the Editor

Add links to Brightspace content
(modules, quizzes, assignments, content items, discussion forums, ...)

 How to insert Quicklinks in the Editor

Add links to External learning tools
(FeedbackFruits, JoVE, Cengage)

 How to insert Quicklinks in the Editor

Add an equation

 How to insert a Graphical Equation to the Editor

After each change do not forget to click the button Save at the bottom of the page to confirm your edits. The system does not auto-save progress!

The created HTML file will appear in your Manage Files of your Brightspace course with the name you saved it when you created it.

 

Now you know how to create an online HTML file in your Brightspace course!

Want to know more about the content management in Brightspace?

Please visit:

0 Comments

Add your comment

This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.