atomic-result-image

This is for:

Developer

In this article

Properties

See Display results to learn more about customizing your result templates.

The atomic-result-image component renders an image from a result field.

Go to the interactive example

Properties

Property Attribute Description Type Default

Property	Attribute	Description	Type
`fallback`	`fallback`	An optional fallback image URL that will be used in case the specified image field is not available or encounters an error.	`string \| undefined`
`field` (required)	`field`	The result field which the component should use. This will look for the field in the Result object first, then in the Result.raw object. It is important to include the necessary field in the `atomic-search-interface` component.	`string`
`imageAltField`	`image-alt-field`	The result field that contains the alt text for the image. This will look for the field in the Result object first, then in the Result.raw object If the field is not specified, or does not contain a valid value, the alt text will be set to "Image for {productName}".	`string \| undefined`

fallback

An optional fallback image URL that will be used in case the specified image field is not available or encounters an error.

string | undefined

field (required)

field

The result field which the component should use. This will look for the field in the Result object first, then in the Result.raw object. It is important to include the necessary field in the atomic-search-interface component.

string

imageAltField

image-alt-field

The result field that contains the alt text for the image. This will look for the field in the Result object first, then in the Result.raw object

If the field is not specified, or does not contain a valid value, the alt text will be set to "Image for {productName}".

string | undefined