Activity #2: Add photos and video

 

Welcome to Activity #2! During this activity, you will be completing part of the Goldy Gopher basic page - final version using information from the Goldy Gopher basic page - before version and the Documents and Files for Training.  

 

Add photos

Images are added to Drupal when you first upload them for use on a page. After you upload an image, it is stored in your media library and can be used on any other page of your website. You can use the "Upload Images to Image Fields" module on canvas to guide this process. 

Add a featured image

This image will appear in the upper right corner of your page, above the related content sidebar. 

Screenshot of featured image on basic page
Screenshot of image tab on basic page

 

  1. Download the Goldy_Featured.png image from the Documents and Files for Training.
  2. Navigate to the editing menu on your page. 
  3. Click on the "Images" tab. 
  4. Click the drop-down menu and "Select Media."
  5.  When the pop-up appears, click the "Upload" tab to upload the Goldy_Featured.png image from the downloads folder on your computer.
  6. In the Alt Text field, add the following description: Goldy Gopher poses with a golden cape. (Note: The Alt Text field typically describes what is happening in the photo)
  7. In the Name field, add the following text: Goldy Gopher featured image.
  8. Click Place.
  9. Click Save at the bottom of your editing page.
Screenshot of media library pop-up
Screenshot of upload image page

Note: If adding an image that already exists in your media library, simply choose the image from the pop-up window instead of uploading.

Add images within the body text

  1. Download the Goldy1954.jpg, Goldy1977.jpg, Goldy1990.jpg, and Goldy2019.jpg images from the Documents and Files for Training.
  2. Navigate to the editing menu on your page.
  3. Place your cursor after the "1954" heading and hit the return key.
  4. Click the "Media Browser" button on the toolbar (the star icon). 
Screenshot of image pop-up
  1. Follow the same process outlined above to upload and name Goldy1954.jpg. 
  2. When the pop-up window appears, select "Embedded Small" from the "Display as:" drop-down menu. 
  3. Click Embed. 
  4. Follow this same process for the rest of the images under their corresponding heading. 
  5. Click Save at the bottom of your editing page. 

Embed a YouTube video

For this process, you will be embedding this Goldy Gopher "Make a Wish!" video from the University's YouTube page. 

  1. Navigate to the editing menu on your page. 
  2. Highlight and delete the https://www.youtube.com/watch?v=INU8E5bGihc text.
  3. Click on the "Media Browser" button on the toolbar (the star icon).
  4. Click the "Create Embed" tab. 
  5. Copy and paste the URL from the Goldy Gopher "Make a Wish!" video into the URL field. 
  6. In the Name field, enter this text: Make a Wish!
  7. Select your department or unit. 
  8. Click Place, then Embed. 
  9. Click Save at the bottom of your editing page. 
Screenshot of video embed pop-up

Congratulations! You've completed Activity #2. Learn how to add related content and links in Activity #3