Photo Text
A display-only field combining an image with text, supporting multiple layout arrangements.
The Photo Text field displays an image alongside text content. It does not collect user input. Use it for hero sections, feature highlights, team member profiles, or any content that pairs a visual with a description.
Configuration
| Property | Type | Default | Description |
|---|---|---|---|
| label | string | -- | Heading text displayed above or beside the image |
| width | LayoutWidth | "full" | Horizontal space the field occupies |
| help | string | -- | Description text displayed alongside the image |
| imageUrl | string | -- | URL of the image to display |
| alt | string | -- | Alt text for the image (accessibility) |
| caption | string | -- | Caption text displayed below the image |
| layout | string | "left" | Image position: "left", "right", "center", or "full" |
| aspect | AspectRatio | -- | Image aspect ratio: "1:1", "3:4", "4:3", "9:16", or "16:9" |
Layout Options
The layout property controls how the image and text are arranged:
- left -- Image on the left, text on the right.
- right -- Image on the right, text on the left.
- center -- Image centered above the text.
- full -- Image spans the full width with text overlaid or below.
Example Usage
A feature highlight with an image on the left:
{
"type": "photoText",
"label": "Real-Time Collaboration",
"help": "Work together with your team in real time. See changes as they happen.",
"imageUrl": "https://example.com/collab.png",
"alt": "Team collaboration screenshot",
"layout": "left",
"aspect": "16:9"
}