Before uploading an image, you must have permission from the copyright holder.

If the image contains identifiable people, they must also have given their written consent for their image to be used in this way.

Uploading Content Images

To upload an image into the main page content ("Body" field):

  1. Click the "Insert image" icon on the editor toolbar.
  2. Find the image and open it - this will upload it to the web server and insert it into the content.

You must also set the alternative (alt) text. This will be read aloud by screen readers (used by people who are blind or visually impaired), so it is important for accessibility (which is a legal requirement):

  1. Click the image that was inserted to select it.
  2. Click the "Change image alternative text" icon on the far left of the image toolbar.
  3. Enter a suitable description of the image - or enable "Decorative image" if the image is purely decorative and should not be read aloud.
  4. Click the tick ("Save") icon.

You should also set the desired image size:

  1. In the dropdown on the far right (which defaults to "Raw image"), select the appropriate size.

You can select "Original" to keep the original image size and get rid of the "Please select an image style" warning - but please be aware that large images may take longer to download, especially on slower mobile networks, so you should not use "Original" for very large photos.

Unfortunately, the selected image size is not currently reflected in the content editor, so you may also want to manually scale the preview to match by dragging the resize handle with your mouse. (We hope this will be made automatic in a future release.)

If desired, you can also change the image alignment, add a caption, and add a link using the toolbar icons. If you want the link to open the full size version of the image in a lightbox (modal popup):

  • Right-click the image in the editor
  • Click "Copy Image Link" (or similar)
  • Click the "Link image" icon on the toolbar
  • Paste the image link into the "Link URL" field (Ctrl+V, or right-click > Paste)
  • Click the tick ("Save") icon

Reusing Content Images

While it is possible to copy & paste images between pages, you are advised to re-upload each image to each page instead. This is because uploaded image permissions are inherited from the page they uploaded to - so if the original page is replaced or deleted in the future, the copy-pasted image will stop working on every page.

Adding Banner Images

You can also display one or more banner images at the top of the page, above the breadcrumbs. If you upload more than one image, they will be displayed as a slideshow.

  1. In the "Images" section above the content editor, click "Add media".
  2. Under "Add media", click "Browse".
  3. Find the required image and open it.
  4. Under "Alternative text", enter a suitable description of the image. This will be read aloud by screen readers (used by people who are blind or visually impaired), so it is important for accessibility (which is a legal requirement).
  5. Optionally, drag the crosshairs on the image to choose which part of the image should be cropped to fit in the banner. (The default is the very centre. Unfortunately the "Preview" button doesn't always work properly, and you may lose your changes, so we advise against using it for now.)
  6. Click "Save and Insert".

You can edit an existing image by clicking the pencil icon button, remove it by clicking the "Remove" button, and re-order images by dragging and dropping them.

Reusing Banner Images

To reuse a banner image from another page:

  1. Make a note of the filename of the image (e.g. "SCC00WCQ3I.jpg")
  2. In the "Images" section above the content editor, click "Add media"
  3. In the "Filename" box, enter the filename
  4. Click "Apply filters"
  5. Tick the image you wish to use (don't click the image itself - that will open a preview of it)
  6. Click "Insert Selected"

Sources of Images

As noted above, you must have permission from the copyright holder to use an image - you can't just find something you like online.

You may want to look in Oxford University Images (OUImages). You will need to register, and you generally need to include an image credit on the page.

You may also find the following rights-free stock image sites useful:

Please contact us with feedback and comments about this page. Last updated on 12 Apr 2024 15:22.