Media library

Before inserting images, videos and files into a page you need to add them to your site's media library. Here's how.

Accessing the Group Media Library.
Off

This guide covers the following media types:


Images

    How to upload an image (step-by-step guide)

    1. Go to Media

    • Select Media from the tab menu
    • To edit a previously uploaded item, find the item, then click the Edit button.
    • To create a new media item then click the + Create media button.
    Click 'Create Media' to upload a new file, image or video

    2. Select type of media to upload

    • Select the type of media you want to create. Click on Image
    Select the type of media you want to create

    3. Choose file to upload

    • Click on the Choose file button. A popup box will appear allowing you to locate your image file. 
    Click the 'Choose File' button to upload your image

    4. Add information and crop image

    • Use the cropping tool to specify the crops of the image:
      • Landscape 16:9 (required) the most commonly-used crop
      • Homepage banner 8:3 - used on Home
      • Square 1:1 (required) - used on Staff profile
      • Central homepage banner 3:1
    • Add a meaningful name and alternative text.
    Web Support - Media - Crop Image Example Top

    5. Caption

    • Optionally use this field for a caption, for copyright, or for both.

    6. Save

    • Once all compulsory fields and cropping sizes have been completed click the blue Save button.
    Fill in all required fields and resize and crop your image

    Top tips for uploading images

    Size and quality:

    • Upload a high resolution, uncropped version of your picture.
    • The minimum permitted image size is 800x450px.  

    Descriptions:

    • Add a meaningful alternative text. This short description of the image will be used by screen readers and displayed when the image is not loaded, important for accessibility.
    • Add a meaningful image name. This will help you find it when inserting it on a page.
    • If your image is downloaded from the Asset Bank, make sure to add the image ID number to the Name field to prevent duplication e.g. 'Firth Court Rotunda 25468'.
    • Consider a consistent naming convention you can use within your department so that it's obvious where to find a file and what it contains.
      • Example naming convention: <date YYYYMMDD>+<DEPARTMENT>+<location>+<subject of image>+<version>
      • Example in use: 20190322 LAW Western Bank Library Student reading books 003

    Cropping:

    • Always use the cropping tool to specify three crops of the image - Landscape 16:9, Square 1:1 and Homepage banner 5:2. 

    Videos

    In order to optimise pages and the user experience for website visitors around the world, we strongly recommend using Kaltura to host videos instead of YouTube or Vimeo.

    Any video you create needs to be compliant with accessibility legislation.

    • To add videos follow steps 1 and 2 (above) but select Video Embed instead of Image.
    • YouTube, Vimeo and Kaltura videos can be added.
    • To add YouTube and Vimeo videos copy and paste the video URL into the Video Url or Kaltura 'iframe' embed field.
    • To add Kaltura videos copy and paste the entire embed code into the Video Url or Kaltura 'iframe' embed field. You can find the embed code in the video's sharing options.
    • Remember to add a meaningful video name. This will help you find it when inserting it on a page.
    • You can customise the thumbnail for your video by changing it in the platform on which the video is hosted - Kaltura, YouTube or Vimeo.

    Video playlists cannot be added at the moment. Live streams from YouTube and Kaltura can be added.


    Files

    Do not upload a file if its contents can be added on a regular website page. Files are harder for users to search for, are not mobile-friendly and make it harder for website visitors to act immediately on the task in hand. Files can also contain duplicate course content which is not CMA compliant.

    In particular, avoid uploading the following types of file:

    • course or department brochures
    • course timetables
    • module information

    Is a file the best way to communicate your content?

    Any file you upload needs to be compliant with accessibility legislation.

    • To add files follow steps 1 and 2 (above) but select File instead of Image.
    • Include a clear description of the file type and size, e.g. PGT Disrupted Studies form (doc, 62KB).
    • Special characters such as  ~ ! @ # $ % ^ & * ( ) ` ; < > ? , [ ] { } ' " and | should be avoided.
    • There is a 32 MB limit on files.
    • Make sure you keep the file up-to-date. If you need a file replaced or deleted, please contact digital.help@sheffield.ac.uk.

    Next step

    Create a page (step-by-step tutorial)

    Get in touch

    If you have CMS questions or are stuck then get in touch and we'll do our best to help.