Image module

Use the Image module to include single images on your website. If you want to include a group of images, use either the Image List module or the Gallery module. You can add an Image module by selecting Image under the category Visuals in the Add module overlay.

Hover the module and click on Content, Design or Settings on the dropdown to edit your Image module. 

Content

There are three ways of adding an image to the module:

• Upload a new image: click on Add or drop image to select an image from your computer or drag and drop your image on the outlined area. 
• Use existing image from File Library: click on Select from File Library and choose one of your existing images from the File Library.
• Use image from Global Data: toggle the option Use Global Data source and select either to include your cover photo or your logo that you've previously uploaded in Global Data. 

Remember to add an Alt text (alternative text) to your image as this will ensure that search engines can "read" your image. An Alt text should be brief and clearly describe what the image illustrates. 

Once you've added your image, you have the option to edit the image directly in the Editor. Click on Edit next to your image to get to the Image Editor.

If you regret adding the image to your website, you can either click on Replace to add a different image or click Remove. 

Add a link to your image: when using an image on your website, you have the option to add a link on it and make the image clickable for your visitors. To add a link to your image, toggle Enable link on image and a number of link options will become visible. 

Choose the type of link you want on your image from the dropdown. You have the following four link options:

• External URL: add a URL to an external page. This link type will by default activate the setting Open link in new tab to ensure that the visitor doesn't completely leave your website when they click your image.
• Internal page: link to a page on your website.
• Email: add an email address in the field. When the visitor clicks on the image, their default email client will open.
• File: include a file by clicking on Add or drop file to open your computer files or drop your file on the outlined area. When the visitor clicks on the image, they'll download the file.

Tick the option Open link in new tab to open your image in a new browser tab when clicked. Activate Set "nofollow" property if you don't want search engines to follow the hyperlink. When this setting is enabled, your link will not affect the target's search engine ranking.

Design

The size of the image refers to how much space it takes up within the column where it's placed. When the image size is set to 100% it spans the entire column width. Use the slider or type in your specific percentage in the field to adjust the size. The column height depends on the image dimensions. 

 
Image alignment allows you to choose the position of your image within the column. You have the option to left align, right align or centre your image. Use the float function to float your image left or right and allow other content to wrap around it.

Example of float:

Settings

In the Settings section you can add hover effects on your image. You can either use the hover effect as a purely graphical feature or to display the image caption text on top of the image.