The Image Gallery module allows you to show a slideshow of images in a pop-up box.
Images that you wish to display in the gallery can be .jpg, .pjpeg, .jpeg, .png, or .gif files and should be uploaded directly to the module not in Resources Manager.
- To begin select Manage for your version, followed by Interactivity.
- Select the Media module category from the Interactivity Module palette.
- Select Image Gallery in pop-up.
- Click and drag the area into the position that you would like to make interactive.
- Drag files into the box or select Add Files to add images ready to be uploaded.
- Once done, select Start Upload to upload the files.
- You can reorder an image using the sorting icon that appears to the left of an image. Simply click and drag into place.
- An image can be deleted by selecting the bin icon.
- If you wish to add more images select Upload Images.
- Select Save to save your module.
The title of the image will default to the file name but this can be altered in the Caption field and can be up to 200 characters long including spaces. You can also set the position to appear at the top or bottom of each image using the Position drop-down list.
Select the Settings palette for the following options:
Give the module a concise and informative name.
Set the gap between pictures in the slideshow. This value must be set but will be ignored if the gallery is not auto playing.
- Display info
Specify how the caption should be displayed. 'On Hover' allows the reader to hover over an information icon to reveal the caption.
- Info text colour
Set a text colour that contrasts with the border colour of the module to ensure the text is legible.
- Auto play
Cycle through the images automatically. If this is not set, readers must click through manually. An auto-playing slideshow can be paused at any point.
If loop is selected the slideshow will continue playing endlessly until it is closed. If loop is not selected, the gallery will close after one cycle through all of the images.
- Pop-up width/height
The pop-up size is always set to one value to avoid obscure sizes. The larger dimension (width or height) of the image will be assigned the value in this field. The smaller dimension will be sized automatically based on the ratio of the image.