Advanced image layout (BETA)

You can use the new functionality for creating composite layouts in the blocks with standalone images. Thanks to this feature, you can add an extra image to an existing one. In other words, the composite image feature lets you enrich a standard illustration with additional elements, an interesting background, and more.

Note: This is a beta feature. We’d love to hear your feedback as we continue refining it.

Here’s how it works:

1. In the editor, select the image you want to work with and click it to open its controls.
2. On the control pane, click the Plus (+) icon to add a widget to the image. (If you hover over this icon, you’ll see a tooltip explaining how the feature works.)
3. Customize the widget to your liking.

Tip: When you add a widget to a block, all images in that block switch to absolute positioning. This means you can move them freely, adjust their width, height, focal point, and other properties.

Editing the image widget

To access the image widget settings, click on it. You’ll see a settings panel and resizing options.

To insert a new image into the widget, use the same steps as for any other image:

1. Click the Upload Image icon.
2. Choose a file from your computer or from the Image library.

Cropping is also supported in the image widget, as described in more detail in our Customizing your images article.

In the media settings, you can:

• Replace the image in the widget
• Add alt text
• Set a click action

To reorganize the image in relation to other elements in the block, click the Reorder icon. You can control whether your widget image overlaps the base image or sits in the background.

Note: If you choose Move backward, your main image must have a transparent background for your widget to remain visible.

To delete the widget from the canvas, click the Delete icon.

Here’s the video of the process.