Insert Media

Insert an Image

    1. Position your cursor in the text box at the point you want to embed the image.

      Screenshot of the editor with the cursor in the desired location that the image will go in.

    2. Click on the Insert/Edit Image icon. This displays the image properties dialog box

      Screenshot of the toolbar with the Insert/Edit Image icon highlighted.

    3. Select the image file or paste the image URL.

      Upload & embed an image file

      Click Browse Server to embed an image file.

      Screenshot of the image properties pop-up with the Browse Server button highlighted.


      Select the folder where you want to store the image file then click on the Upload File icon.

      Screenshot of the server pop-up with the upload button highlighted.


      Locate and select the image file on your computer, then click Open.

      Screenshot of the file browser with the desired file selected and the open button highlighted.


      The uploaded file will be selected. Click OK to continue

      Screenshot of the server pop-up with the OK button highlighted.


      Embed a web image

      Paste the copied image URL into the box marked URL. (Use CTRL-V - PC or COMMAND-V - MAC to paste.)

      Screenshot of the image properties window with the URL inserted.

    4. Modify image properties. (Optional)

      Adjust the image width and height if needed and add an alternative text for screen readers.

      Set the Alignment (left or right) for the image if you want to surround the image with text.

      This returns the display to the text box with the embedded image.

      Set the Alignment.

      Set the Alignment.

      Example of additional text displayed next to a left-aligned image.

      Example of additional text displayed next to a left-aligned image.

Back to Top

Insert a video file

Videos can be embedded into a text-box using the Rich Text Editor. Currently, supported video file types include .MP4, .FLA, .F4V, .3GPP, .M4V and .MOV.

  1. Upload the desired video to the resources page in mp4 format and copy the link address (Right click the resources file and select 'Copy Link').

    Screenshot of the text window with the cursor where the MP4 will be placed.

  2. In the Rich Text Editor, click on Source.

    Screenshot of the toolbar with the Insert/Edit Movie icon highlighted.

  3. Position your cursor and paste your copied text into the box (CTRL-V on PC or COMMAND-V on MAC).

    Screenshot of the movie properties pop-up with the Browse Server button highlighted.

  4. Copy and paste this code directly below the link:

    <video width="500" height="315" controls> <source src="ReplaceThisText.mp4" type="video/mp4"> </video>

  5. Copy the OWL video link pasted in step 3. and use it to replace the text called 'ReplaceThisText.mp4'.

    Note: Only replace the text between the quotation marks, not the marks themselves.

    Screenshot of the file browser with the desired video selected and the open button highlighted.

  6. Remove the extra OWL video link pasted in step 3.

    Screenshot of the server popup with a loading bar as the file uploads.

  7. Click Save at the bottom of the page in order to save your changes.

  8. The embedded video should now be viewable.

Back to Top

Insert a video file with captions

Videos with captions can be embedded into a text-box using the Rich Text Editor. Currently, supported video file types include .MP4, .FLA, .F4V, .3GPP, .M4V and .MOV. The only supported caption file type is .VTT.

  1. Upload the desired video file (in .MP4 format) and the desired caption file (in .VTT format) to the resources page.

    Screenshot of the text window with the cursor where the MP4 will be placed.

  2. Copy the link address of the video file (Right click the resources file and select Copy Link).

    Screenshot of the text window with the cursor where the MP4 will be placed.

  3. In the Rich Text Editor, click on Source.

    Screenshot of the toolbar with the Insert/Edit Movie icon highlighted.

  4. Position your cursor and paste your copied text into the box (CTRL-V on PC or COMMAND-V on MAC).

    Screenshot of the movie properties pop-up with the Browse Server button highlighted.

  5. In another tab or browser window, navigate to resources and copy the link address of the caption file.

    Screenshot of the movie properties pop-up with the Browse Server button highlighted.

  6. Return to your original tab containing the Rich Text Editor, paste the caption link directly underneath the link pasted in step 4.

    Note: Make sure before progressing that the rich text editor contains two links: the first for the video resource file, the second for the caption resource file.

    Screenshot of the toolbar with the Insert/Edit Movie icon highlighted.

  7. Copy and paste this code directly below the link:

    <video controls="" height="315" width="500"><source src="REPLACETHISTEXT.mp4" /> <track default="" kind="captions" label="English" src="REPLACETHISTEXT.vtt" srclang="en-us" /></video>

  8. Copy the video resource link pasted in step 4. and use it to replace the text called 'ReplaceThisText.mp4'.

    Copy the video resource link pasted in step 6. and use it to replace the text called 'ReplaceThisText.vtt'.

    Note: Only replace the text between the quotation marks, not the marks themselves.

    Screenshot of the file browser with the desired video selected and the open button highlighted.

  9. Remove the extra OWL video links pasted in step 4. & 6.

    Screenshot of the server popup with a loading bar as the file uploads.

  10. Click Save at the bottom of the page in order to save your changes.

  11. The embedded video with captions should now be viewable.

    Click the three dots at the bottom right of the video window to enable or disable captions.

    Screenshot of the server popup with a loading bar as the file uploads.
Back to Top

Insert a Youtube/Web Video

  1. Locate the Youtube video you would like to embed and click Share.

    Click Embed and copy the Youtube embed code to your computer's clipboard (CTRL-C - PC or COMMAND-C MAC).

    Note: It is recommended to remove the check mark next to "Show suggested videos when the video finishes"


    Click Share to display the video-sharing panel.

    Screenshot of a youtube video with the share button highlighted.



    Click Embed to display the video embed code.

    Screenshot of the youtube share options with Embed highlighted.



    Copy the embed code.

    Screenshot of the video's embed code higlighted.

  2. In the Rich Text Editor, click Source.

    Clicking source will display the HTML code for the text box.

    In the text box, click Source.

  3. Position the cursor.

    Position your cursor where you would like the video embedded, then paste the YouTube embed code (CTRL-V - PC or COMMAND-V - MAC).

    Position the cursor.

  4. Click Save at the bottom of the page in order to save your changes.

    The embedded YouTube video should now be viewable.

    Note: you may have to reload the page in order for the video to appear.

    Click Source again.
Back to Top

Insert an audio file

  1. In the text box, position your cursor where you want to embed the audio file.

    Screenshot of text editor with cursor positioned in desired location.

  2. Click the Insert/Edit Movie icon.

    This displays the Movie Properties dialog box.

    Screenshot of the text editor with the insert/edit movie button highlighted.

  3. Click Browse Server. This displays the Entity Picker dialog box.

    Screenshot of the movie properties pup-up with the browse server button highlighted.

  4. Click the Upload file icon.

    Screenshot of the server pop-up with the upload button highlighted.

  5. Select the audio file you want to embed in the text box. Once you have located and selected the audio file, click Open to upload it.

    Screenshot of the file selection window with a file selected and the open button highlighted.

  6. Once the file finishes uploading, it will show in the file directory listing and will be selected by default. Click OK to continue.

    Screenshot of the server pop-up window with the OK button highlighted.

  7. Set the Height to 35, and then click OK.

    Screenshot of the movie properties window with the Height set to 35, and the OK button highlighted.

  8. View the embedded audio file in the editor. The editing display will show a place-holder for the audio marked "Movie". When the text box item is published the embedded audio player will be displayed.

    Screenshot of the embedded audio file in the editor.
Back to Top