Image¶
Places an image in the report, from file management or an external URL.
Image components · element type img · binds through text templates, in Image Url and Alt text
Related: QR Code · Bar Code · Badge
Examples¶
// A different image per row
https://cdn.example.com/products/{$record.sku}.png
// Alt text that describes each row
Photo of {$record.productName}Browse files... fills in the URL from file management, and the image then travels with the report. For a logo in a page master, turn on Decorative so it is skipped by screen readers instead of announced on every page.
Options¶
| Option | Values | Default | Description |
|---|---|---|---|
| Image Url | URL or template | A sample image | External address, or Browse files... to pick from file management |
| Alt text | Text or template | Empty | What the image shows, for screen readers and the PDF tag tree |
| Decorative | On · Off | Off | Marks the image as carrying no information |
| Object fit | Fill · Cover · Contain · Scale Down | Not set | How the image scales inside its box |
| Style | CSS | Empty | Custom CSS applied to the image element |
Alt text and Decorative sit in the Accessibility section; Object fit and Style are under Styling.
Accessibility¶
An image left without Alt text is still described in the export — as simply "Image" — so a PDF never contains an image with no description at all. That fallback keeps the document valid; it does not make it useful.
- Say what the image shows, not that it is an image: "Signature of the approving manager", not "Signature image"
- Use a template when the image varies with the data, so every row is described correctly
- Keep it short. One sentence is usually enough; the surrounding text does the rest
Decorative and Alt text are alternatives, not companions — turning Decorative on disables the description, because the point is that there is nothing to say. It matters most in a page master: a described logo is announced on every single page, in the middle of the content the reader is following.
Notes¶
- Prefer file management over external URLs — the image loads faster and cannot disappear from under the report
- Object fit is what to reach for when an image is stretched or cropped oddly inside its container