Menu

E-Learning Unit

menu

Adding text, images and video using a label

Print Friendly, PDF & Email

For: StaffApplication: Design and Build , QMplusTagged: getting started , image , label , video

Labels are a very flexible feature of QMplus, enabling you to enhance your course page with explanatory text, images or videos. They can also help in breaking up lengthy pages of content making them easier to read.

Adding a label

  1. Turn editing on via the slider (top right of your screen).
  2. Go to the topic where you would like your text to be displayed and click Add an activity or resource and then select Label from the activity picker, you will find it in the Resource sections towards the bottom of the list

image of add activity or resource

Adding text

After adding your label, enter your label text into the text editor. You can style your text using the visual editing tools. Image of add a new label
The text will appear at the bottom of the topic where you added it. Position it where it is required using drag and drop.

image of new label

Tips for text labels

As labels place the content directly on to the course page, we recommend that they are used for short pieces of text, for signposting or for breaking up blocks of content. If you are writing a lot of text, you should consider using a Page or a Book for your content.

Using the “Header 3” style from the drop-down menu in the editor will give you an heading which can be really useful for breaking pages with lots of items on them.

Further guidance about adding accessible text to labels can be found on the WebAIM website and the archived accessibility guides from the former JISC TechDis service.

image of text header

Adding an image

After adding your label, click on the Insert/edit image button in the editor.

image of how to add image in text editor

  1. Click on the Browse repositories. You will then be able to upload an image from your computer, your private files area or from Dropbox. image of file picker another image of file picker
  2. Once you have selected an image to use, a preview will appear in the window.
  3. Add a description of your image (in web terms this is called ‘Alt’ text.) Unless your image is decorative you should enter a description. You can read more about using ALT text on images on the U of Minnesota.
  4. Resize the image to the appropriate pixel dimensions, then click ‘Save Image’

Image of image properties

There are a number of different settings for adjusting the image, but the most useful are:

  1. Alignment: select an alignment from the drop-down menu. This will control how the image is aligned any text
  2. Dimensions: set the size you’d like your image to be. Keep the constrain proportions checkbox checked, this will ensure your image scales properly
  3. Horizontal space: use this setting to create some space around the image.

In the editor window, you will see your re-sized image. You can add text as usual by clicking and typing in the editor window. Once you are happy, click the Save and return to course button.

Tips for images If you are uploading your own images, be careful with file sizes. For onscreen viewing, images do not have to be high resolution. Make sure you reduce the size of your image before uploading it to QMplus. You can do this in an image editing package or you can use a service such as tinypng.com. It shouldn’t need to be more than about 100k. Placing lots of large images on your course page will slow the page down.

If you are using a lot of images in your QMplus course area, you might want to consider using a Lightbox Gallery, or even a Glossary to organise them instead of placing them in labels. The Lightbox Gallery in particular is designed to display images in a more flexible way than is possible with a label.

More information about accessible learning materials is available from the WebAim and archived TechDIS websites as well as the JISC website.

Embedding a video

Once you have turned editing on and added a label resource, Click on the QMplus Media icon in the editor (See image below).

image of embedding kaltura video

 

 

To upload a video – Click on Add Media (top right) -> Select Media Upload

Kaltura2

Click on Choose a file to upload -> Add the title and description -> Select Back to browse and Embed -> Click on the Select button next to the video you just uploaded -> Select Embed Media button (bottom left). See image below

Kaltura3

Once you add the video you will see the Label editor window. Click on ‘Save and Return to Course’. You will see the video on your course page. You can play the video after it has finished processing.

Tips for videosWe do not recommend using multiple labels to embed videos onto your course page as this can make your page slow to load. If you have a lot of videos, we recommend that you consider using Pages or Books to organise them.

Although you can upload a video file to QMplus by clicking on the “upload a file” option in the file picker, you should not do this. We now have a special service called QMplus Media, where you can upload videos which you can then embed into your QMplus course page. QMplus Media is designed to handle video files, can ensure that the files will play properly on different types of devices and can also handle lots of people accessing the same file at the same time. See our guide on Uploading a video to QMplus Media for more details.

the University of Kansas has some good advice about making videos accessible.

Did this answer your query? If not, you can raise a ticket on the online Helpdesk or email: its-helpdesk@qmul.ac.uk . Alternatively you can also request a particular guide or highlight an error in this guide using our guides request tracker.

Produced by the the E-Learning Unit at Queen Mary University of London.
QP026-image015

Return to top