Media¶
Placeable in Canvas
An image or video with an optional caption, a ratio lock, and a click-to-play facade for YouTube and Vimeo that keeps third-party scripts off the page until the visitor asks for them.
Loading…Props¶
| Prop | Required | Type | Description | Example |
|---|---|---|---|---|
image |
Optional | object or string | The image to show. | |
mobile_image |
Optional | object or string | Optional image for phones. | |
video_url |
Optional | string | A YouTube or Vimeo link, or a link to a video file. | |
poster_image |
Optional | object or string | Image shown before the video plays. | |
caption |
Optional | string | Optional caption below the media. | Photo caption goes here. |
color_scheme |
Optional | enum | Dark puts this on a dark background with light text. Defaults to light. |
light, dark |
aspect_ratio |
Optional | enum | Crop to a shape, or choose Auto to keep the original shape. Defaults to 4:3. |
auto, 16:9, 3:2, 4:3, 1:1, 3:4, 9:16 |
Built on the shared Video Facade partial.
image follows aspect_ratio, 4:3 unless you choose otherwise · at Auto, an empty slot or a YouTube/Vimeo video holds 16:9 · poster_image match video
caption is a visible caption, not alt text — alt comes from image. → Full accessibility guidelines
Empty slots are deliberate, not broken
With nothing selected, Media renders a tinted stand-in: a fine tooth over a gradient derived from --theme-color-primary, with corner registration marks and a mono label naming the kind and ratio. It is meant to read as an intentional placeholder in the page builder.
Tokens used by this component
| Token | Default |
|---|---|
--ixm-media-caption-* |
(several — see full reference) |
--ixm-media-placeholder-* |
(several — see full reference) |
--ixm-media-radius |
0 |