Print Friendly, PDF & Email

Creating a File Using the HTML Editor

 

Using the Create a File option in the Content Tool allows you to create content that contains text, images, and video directly within iCollege. This means you don’t need any additional software to create content. 

The HTML Editor is the primary method of creating content iCollege, and the files created using the HTML Editor are saved in iCollege as HTML files.  By using the HTML editor, you can enter text, pictures, embed audio/video, or even embed HTML code. The HTML Editor has many icons that match those of common word processing software: bold, left justify, bullets, and so on. However, it’s important to remember the HTML Editor is not a word processor.  When you add pictures, links or embed videos, you are creating references (links)  to items that are stored internally in iCollege.  If those items are changed or deleted, the content will not display properly.

To learn about the features of the HTML editor, please view the video below. Step-by-step instructions are also provided after the video.


Create a File

  1. Click Content in the course navigation bar.
  2. Click Upload/Create.
  3. Click Create a File.
  4. In the Enter a Title field, type a title for your file.  If desired click the Browse for a Template button and choose a Daylight Template (assuming you chose to make the Daylight HTML Templates available).
  5. Enter your content (text, images, links, etc.) in the main box below the toolbar.
  6. Click Publish to make the page immediately available or Save as Draft to save your document and work on it later. The file is saved as a web page with the .html file extension.

HTML Editor Window


You can enhance your files by using Daylight templates and shortcuts, inserting images, and linking to internal or external content. 

Daylight Templates
When creating files directly within the iCollege Content Tool you can choose to use one of several templates to format your files. These templates can help to ensure that 1) your files are accessible 2) your files display well on mobile devices.

Scroll through the images below to see examples of the Daylight templates: 

Make Daylight Templates Available to the Content Tool

  1. Click Content in the course navigation bar.
  2. Click Settings.
  3. In the Content Authoring section, click Change Path.
  4. Select Shared Files, then click Daylight _HTML_Template.  Then click Select Path.
  5. Click Save.

Once you have completed these steps, several templates will be available for you to use when you create a file.

Available Template Options

 

Formatting Shortcuts with Daylight HTML Template
If you use the Daylight HTML Templates, you can also add elements such as accordions, two-column panels, and callouts to add special formatting to your file.  Scroll through the images below to see a few examples of the available elements .

You must access the HTML code view to use the special formatting.  Steps for accessing the HTML code view are provided below.

[imagetab width=”undefined” 
Inserting Images

Inserting Images

Inserting an image will simultaneously upload and store the image (file) in iCollege and create a link to it within the HTML editor. You will be able to use the image in other documents that you create within the course
without having to upload it again to iCollege.

Insert Images

To insert an image from your computer or external storage device:

  1. Click the Insert Image icon.
  2. Click My Computer.
  3. Click Upload.
  4. Locate the desired image and double-click it.
  5. Click Add to insert the image.
  6. To meet accessibility standards for screen readers, you are prompted to enter “Alternative Text” for the image. Type a brief description (2 – 5 words) of the image you uploaded.

To insert an image that you have already uploaded to iCollege:

  1. Click the Insert Image icon.
  2. Click Course Offering Files.Image from Course Offering Files
  3. Navigate to the image that you want to add. Click the radio button next to itAdd Image from Course Offering Files
  4. Click Add.
  5. To meet accessibility standards for screen readers, you are prompted to enter “Alternative Text” for the image. Type a brief description (2 – 5 words) of the image you uploaded.
  1. Click the Insert Quicklink icon.
  2. Click the appropriate tool and select the item that you want linked.
  3. To link to an external website, select URL.  
Inserting Links

Inserting Links

You can create an immediate link to many items within iCollege (specific quizzes, surveys, etc.) or to a website.  To create a link:

Inserting Links

  1. Click the Insert Quicklink icon.
  2. Click the appropriate tool and select the item that you want linked.
  3. To link to an external website, select URL.  
  4. Copy the complete web address (including http:// or https://) from the desired webpage, and paste it in the URL field.
  5. Enter a name for the link in the Title field, and click Insert.The link will appear in the document.