Exercise 6.1 - Uploading and using media

In this exercise you will upload an image directly to the media library (Part 1) and then use that image when creating content (Part 2).

Part 1: Upload media file

  1. Navigate to the Media page by clicking on Content then Media on the Admin menu.

  2. Click the Add Media button at the top left of the page.

  3. Click Image to upload an image file.

  4. Upload an image file:

    1. Give it a short, descriptive name.

    2. Choose a file from your computer, using the Browse button.

    3. Click Open to upload the file.

  5. Add Alt text.

    Note Image alt text is required to enable screen readers and facilitate vision-impaired people.

  6. Click Save

Part 2: Add media to a Page

  1. Create a new Page following the instructions in Exercise 3.1

  2. Click on Banner and then expand "Banner featured image". There you will see an Add media button. Note - you may not have a "Banner" tab if you are not using CivicTheme. In that case, find any Media upload field and use that.

  3. Select the image and then click on Insert selected.

  4. Once the image is selected you will see a preview in your content like the this screenshot:

  5. Fill out any required fields for your Page and click the Save. The image now appears on the frontend. The location of the image may be different on your site depending on your theme.

  6. Navigate to Content → Files from the Admin menu and locate the image file you uploaded. It should be at the top of the list as it is the most recently added file. Note the name of the file.

  7. Next, click on the Media tab button and locate the Media entity that that points to the file you uploaded.

  8. Discuss with the trainer, why the Name of the file (from the Files tab) is different to the Media name (from the Media tab).

Tip: The Media entity allows you to enter a more user-friendly Name (and other metadata) rather than using the name of the file.

PreviousMedia libraryNextExercise 6.2 - Manage media - Bulk Operations

Last updated