How to have more than one image in the authoring dialog?

Question

So I have a generic image component that is used by other components whenever they want to render images. I'm trying to update it to support remote images, so it has a data-sly-use.image="com.adobe.cq.wcm.core.components.models.Image", and the image's src is set to image.src so that it works with remote images. The issue that I'm dealing with is when there's more than one image in an authoring dialog.

The way I would deal with this for local images was having a different name for the fileReferenceParameter field, but I'm not sure how to get around that for remote images. For some reason, image.src references the latest uploaded image so there doesn't seem to be a way to differentiate between all the images.

EstebanBustamante · Accepted Answer

I think the easiest way to handle this situation would be to avoid updating the dialog. Instead, consider using two images. You might want to use a "wrapper" component where you can add multiple image components. This way, you won't have to update anything in the image component. Some examples of this pattern include the carousel and tabs components from the core components.

I hope this helps.

kautuk_sahni · Answer

@ishaja Did you find the suggestions from users helpful? Please let us know if more information is required. Otherwise, please mark the answer as correct for posterity. If you have found out solution yourself, please share it with the community.

Sign up

Login with SSO

Login to the community

Login with SSO

Scanning file for viruses.

This file cannot be downloaded