Image

The Image component allows you to add and manage images on your CMS pages, supporting uploads and asset reuse.

What is the Image component?

The Image component is the simplest way to add an image to your CMS page. You can upload new images or reuse assets already in your library.

Open the CMS editor where you want to add or edit an Image component.

Drag the Image component onto your page.

Upload a new image or use the asset manager to select a previously uploaded image.

Adjust settings as needed (alt text, size, etc.).

Save your changes in the editor.

Here is a video on how you combine an image with a link block

Image Component Settings

All Image components support the standard CMS settings below. Use these tabs to control layout, typography, and display for your image:

General

cms general

Selectors

In this box you can add classes that are defined elsewhere on the site to a specific page.

ID

ID is used to direct user to an element of the page or identify it for future use, so you can link to this aspect of the page.

Styles

Styles are used to add a specific style not predefined in a class. You can add style settings which can be applied against any component. Below are a list of styles you can add:

Margin (either just "margin:" or specific sides of a component like "margin-top:" or "margin-left:")
Padding (either just "padding:" or specific sides of a component like "padding-top:" or "padding-left:")
Max Width
Font
Border
ID

Examples:

max-width: 352px!important;
margin-bottom: 0 auto;
padding-top: 30px;

To center an image: margin:auto;
To center text/markdown: text-align: center;
To make a component go edge-to-edge: margin-left:-15px;margin-right:-15px