Image Only

Image of the image only module online

This module displays one image. The image will try to fill the space it's been given at all times, so some content can be cut off at different screen sizes. You can use the crop-insert option to help with this, or shoot images which have plenty of extra content around the main subject of the image, where it matters less if / when it gets cut off.

There are also multiple options to define how this image cropping behaviour works, detailed under ‘Height' below.

Grid Version

There is a grid variant of this module.

Enabling / Disabling

Like all modules, this module can be enabled / disabled. Please see the corresponding section of the documentation to find out more about this functionality.

Image

Image of the image only image

Here you can select the image for your module.

Height

Unconstrained

Image of the image only height constrained option

Normally, the image only module will have a maximum height, to fit in with the other modules' heights on your site. In some situations, you may need to be able to display the whole image's height, which this option allows.

The module will still try to fill all horizontal space with the image, but the height will not be constrained, which works well for dislaying large portrait-content, like posters.

Constrained

In this instance, the module will be the same height as other modules, looking the best design-wise, but this could cut off quite a bit of content from the image. Landscape imagery is most suitable for this.

Interstitial

For interstitial images we recommend using transparent PNGs. These are intended as small images that can be used to add visual variance to website sections that are too repetitive or lack imagery otherwise.

Image Width

If you have chosen an ‘Interstitial' type of image only module, you can set a width for the interstitial element, allowing you to fine-tune different kinds of image assets.

Module Height

If you have chosen an ‘Interstitial' type of image only module, you can set a height for the module, allowing you to fine-tune the amount of vertical white space that will be shown around the image.

Tip

Please do not forget to hit one of the save buttons, to make sure the changes you have made are actually saved. Why not keep a window with your preview open, to see the changes in realtime?