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 images component allows you upload any number of images. Supported image file formats are JPG/JPEG, PNG, WebP, TIFF, AVIF, and SVG.

Images are stored and transcoded automatically, converted to responsive sizes that are available directly on a global content delivery network (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.

Images component

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.
  • Drag and drop images from the Assets panel of the catalogue's organizer sidebar.

Once added, you can click and drag on image thumbnails to reorder them as desired. When you hover over an image thumbnail, you’ll see several options. The icon in the bottom-left corner allows you to add the image to the Magic Paste lightbox. The pencil icon in the top-right corner lets you input metadata like alt text and caption, download the image, or see full image details within the Asset Organizer. The red X in the top right allows you to remove the image from the component.

Edit images component
People showing thumbs up

Need further assistance?

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

Join our slack community