While creating assignment descriptions using CodeHS Create, sometimes you may want to insert an image from your Google Drive. Since 'Sharing' an image from Google Drive does not actually provide a direct link, there are a few more steps involved in finding a direct link that you can embed using Markdown:
Finding the Image ID
To find the ID of an image file:
Navigate to the file on your Google Drive
Click the three dots located in the top right corner of the file
Select Preview from the menu
Click the three dots located in the upper right corner of the page
Select Open in New Window
Note: Double-check your Share permissions. General Access should be set to Anyone with the link:
In this new window's URL, the string of text after drive.google.com/file/d/
and before /view
is the ID of the image file.
For example, in the following URL:
https://drive.google.com/file/d/1uEpd4IzXgwCzfxwivCTzbM5_ViMPLjZY/view
This is the image ID:
1uEpd4IzXgwCzfxwivCTzbM5_ViMPLjZY
Insert into Embed Link
Once you have the image file ID, you can create a direct link to the image that can be used in Markdown or HTML.
To create a Direct Link, start with this URL:
https://drive.google.com/uc?export=view&id=<FILE_ID>
Utilizing the aforementioned image ID example, the final URL would look like this:
https://drive.google.com/uc?export=view&id=1uEpd4IzXgwCzfxwivCTzbM5_ViMPLjZY
⚡️ Using a Chromebook? You can save the image to your Chromebook and upload it directly into CodeHS.
Still have questions? Contact our team at hello@codehs.com to learn more!