Use the Image List module to show several images on your website. In this guide, you’ll learn how to add the module, pull in images from different sources, and make them stand out with custom transition effects or hover functions.

On this page:

• Content
• Design
• Settings

Add an empty row and then a new module, selecting "Image List" from the "Visuals" section:

To edit your Image List module after adding it, double-click the module or click the edit icon. You can then expand and edit the options under Content, Design, or Settings in the module overlay.

Content

You can add your image files under Content. You have two options here:

1. Images from theFile Manager: Click Select from File Library and choose from your existing images in the library. You can add several images at once.
2. Images from your local PC: Click Add or drop file to add files from your computer or drag and drop your image into the highlighted area. You can add several images at once.

If you click the small arrow next to an image in the Content section, you’ll see various editing options:

• Edit: You can edit the image, e.g., crop it.
• Replace: Here you can replace existing images and pick new ones directly from the File Manager.
• Remove: You can remove the image completely from the gallery if you want fewer images shown.
• Alternative text: Add an Alt text to help search engines "read" your images.
• Caption: The caption text becomes visible on your image when you enable hover effects with captions for your image list.
• Link Type and Link: Choose the type of link you want for your image from the dropdown. You can choose from External URL, Internal page, Email, and File. Read more about the four link types under the Image module. Enable the Open link in new tab option if you want the link to open in a new window. Activate the Set "nofollow" property if you don't want search engines to follow the link. This setting prevents the link from affecting the target's search engine ranking.

Design

In the Design section, you can change the background, border, and spacing of your Image List module. These adjustments apply locally to the module you just added. You also have the option to access Global Data directly to make adjustments for all image lists on your website.

Settings

Choose how many images should be visible at once, the number of columns (1-12) the images should be divided into, and the margin between your images. If the Amount of images shown is set to 0, the module will show all your images.

If you choose not to show all images at once, the editor automatically adds arrows on each side so visitors can scroll through. You can adjust the following transition settings:

• Show arrow navigation: Arrows are added to the sides of your image list.
• Show pagination dots: Dots are added at the bottom to help visitors navigate between slides.
• Auto change of slides: Your images will transition automatically without the visitor having to click.
• Pause transition on hover: The auto-slide pauses when a visitor hovers over the image list.
• Slide transition type: Choose how your images should change. You have three options: Sliding, slow fade, and fast fade. The default time between transitions is 5000 milliseconds (5 seconds). Increase the value if you want images to stay longer, or decrease it if they should slide faster. Please enter the value in milliseconds (1000 milliseconds = 1 second). Note that the examples above are set to 2000 milliseconds (2 seconds).
• Cropped or uncropped thumbnails: Choose whether your images should be shown as cropped or uncropped thumbnails. You can see a visual comparison of the two settings below.
• Hover effect: You can use the hover effect purely as a graphic feature or to display the caption text on top of the image.

Keywords: Image list, Gallery, Website editor, Visuals, Slideshow, Image editing, Linking, Alt text, Hover effect, Transition type, Design, ChurchDesk help, Thumbnails, Navigation

Updated on: 02/02/2026