Menu

E-Learning Unit

menu

Creating a Lightbox Gallery

Print Friendly, PDF & Email

For: StaffApplication: Design and Build , QMplusTagged: lightbox

The Lightbox gallery enables multiple images to be displayed as a photo gallery or album. When viewing a gallery you are presented with a series of thumbnails, click a thumbnail image to see it full size. Use the PREV and NEXT tabs to browse additional full size images.


 

Step 1: Adding a Lightbox gallery to your module page

  1. TURN EDITING ON via the slider in the top right of your screen.
  2. Select the topic where you would like to add your ‘Lightbox gallery’.
  3. Click on the Add an activity or resource option. Add_an_activity_or_resource
  4. Select Lightbox gallery. This will open the ‘Lightbox gallery’ option screen.

 

Step 2: Filling in the Lightbox gallery options screen

  1. Give the ‘Lightbox gallery’ a name. This name will appear on your course page.
  2. Add a description about your gallery images. 
  3. Click on the ADVANCED section to change the settings for layout and privacy: 
  4. Click SAVE AND DISPLAY

 

Tip: Two powerful options that are available through the advanced setting are: Automatically resize – large images will be automatically resized to fit the users screen, and Allow comments users comments are displayed at the bottom of the page.

 

Step 1: Adding images to your Lightbox gallery

  1. Before you get started, please crunch your images to ensure that they are of the best size and the resource loads quickly. To do so, please use a website such as tinypng.com
  2. Click on Add Images
  3. Click on Choose a File for file picker or drag and drop your images straight onto the page. 
  4. Locate your files in the usual way.
  5. Click on Add Images 
Tip: If you plan to upload multiple images from a PC then it would be advisable use Microsoft’s compressed (zipped) Folder tool. See the ‘Uploading multiple files as a zipped folder’ user guide for more information. Please note that zipped files do not need to be unzipped when using the Lightbox gallery.

 

Below is an example, with 10 images being used:

 

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