Skip to main content
More in Learn

Images Component

The images component manages multiple images with alt text and captions. The images can be arranged in your preferred order.

Images Component Usage

The image component allows you upload any number of images. Images are stored and transcoded automatically, converted to responsive sizes that are available directly on a global CDN. This is ideal for using responsive images with srcset.

  • Automatically transcodes images to multiple sizes
  • Generates WebP variants automatically
  • Multiple images can be arranged as you wish

When adding this component to a shape, specify a name (required) and description (optional) indicative of the sort of content you wish for it to contain. This description will be visible to those who build content based off of this shape.

This component is not translatable, meaning that the same images/metadata will be stored for all translations. Refer to our languages page for more information.

As an editorial user, you can add images to this component in multiple ways:

  • Drag and drop images from your machine onto the component.
  • Click the Drag and drop images prompt to browse your file system for images.
  • Magic Paste images from elsewhere in your tenant.

Use the button in the bottom-right corner of the component to switch between List view and Row view. Within List view, you can optionally enter Alt and Caption text for each image. In Row view, you can click on image thumbnails to access their metadata, and click and drag on them to reorder them. You can also hover over an image thumbnail and click on the trash can icon to delete it from the component.

People showing thumbs up

Need further assistance?

Ask the Crystallize team or other enthusiasts in our slack community.

Join our slack community