Topics Map > Learning Technology > Canvas

Embedding Images in Canvas from OneDrive or Other External Sources

These are the steps to embedding externally hosted images in the Canvas text editor. This specifically details how to do so from your OneDrive account.

Canvas users have a limited amount of personal storage space (that is not tied to a specific course), so one way to work around this cap is to store your images in an external website. Every UW user has a gigabyte of storage space on their OneDrive account, so this makes OneDrive a preferred and secure way to host your files. You can share the OneDrive text link to your image, or you can embed the image directly in a webpage by doing the following:

1. Upload your image(s) to your OneDrive account or locate the image online you want to use.
You can access your OneDrive account through the UW-Parkside Logins page or through your Rangermail.

2. Open the full-size image that you want to embed by clicking on its thumbnail on your OneDrive page.
You'll want to open the full-size image first so you embed it at its highest quality instead of embedding the lower resolution thumbnail.

3. Right-click the image and select Copy Image Address.
Wording may slightly vary depending on which web browser you use.

4. Go to the page in Canvas where you want to embed the image. Click the spot in the text editor where you would like to place this image.
This requires a page with the rich text editor (the one with the formatting tools above it). Most text fields on Canvas use the rich text editor.

5. Click the Images icon, switch to the URL tab, and paste the image URL in the box that pops up.
Use the Attributes section to add alt text to the embedded image.
Click the Images icon on the rich text editor toolbar
Switch to the URL tab and paste the image URL. Click the Attributes section to add alt text

6. Click Update at the bottom of this box to embed the image. Remember to save your changes before exiting the page.

Keep in mind that your image will be at the mercy of the external website. If the website modifies the web address at all or deletes the image, your Canvas page will show a broken link instead of the embedded image. 

Keywords:Embed Image OneDrive Canvas   Doc ID:106267
Owner:Steve S.Group:UW Parkside
Created:2020-09-30 11:37 CDTUpdated:2021-07-22 09:07 CDT
Sites:UW Parkside
Feedback:  0   1