How to Access Image Rendition in AEM

[Tushar_Kar]

[Thread Edited By Adobe]

/*Don’t forget to meet and greet your fellow peers virtually by telling them about yourself here. 

Go ahead and to it now: https://adobe.ly/3eDnB4v */

Actual Post:

we have different renditions of image created in dam by Dam Workflow in our project. Now when we want to access an image in page how will we know which rendition to access dynamically depending on the device. Is it something which UI decides or is it something AEM decides. And how does it work with dispatcher.

Any help is highly appreciated.

[smacdonald2008 · Accepted solution]

See this section of the docs: 

https://docs.adobe.com/docs/en/aem/6-2/author/assets/managing-assets-touch-ui.html

To select different renditions - use the URL that corresponds to the image. Each rendition will have a different URL. 

As far a dynamic rendering of different images based on the device, I am checking that and will post back (or make sure someone else does). 

[Feike_Visser1]

JavaDoc: https://docs.adobe.com/docs/en/aem/6-1/ref/javadoc/com/day/cq/dam/api/Asset.html

[Abhishek_Dweved]

Are you accessing the uploaded image by file reference ? Or you are showing it using OOTB Image / Text & Image /Adaptive Image components.

If you are using OOTB components to show the image it will automatically show the best rendition as per the resolution of the screen.

You can use selectors with image path for accessing image rendition based on your requirements.

For more information , you can refer following

https://helpx.adobe.com/experience-manager/using/aem-dam-image-components.html

https://docs.adobe.com/docs/en/aem/6-2/develop/mobile-web/responsive.html#Scaling Images for the Current Viewport Size

[smacdonald2008]

For AEM Assets - i recommend that you watch this Ask the AEM Community Experts on Assets as well:

http://scottsdigitalcommunity.blogspot.com/2016/09/ask-aem-community-expert-session-best.html

[Tushar_Kar]

        Thanks a lot for your help

[jameswilk]

How do you do this in HTL?

[kumarsampath_r]

Hi Scott,

I know am responding on a pretty old thread.

But any pointers towards -

​will be really helpful

[ekta_aggarwal]

Hi,

We can achieve this using adaptive image component. I can share the sample code and configuration, if required.

[manoj_singh3]

Hi Ekta,

Kindly share the sample code along with configurations.

[ekta_aggarwal]

You can refer "Implementing Adaptive Images in AEM" in the below documentation:

https://helpx.adobe.com/in/experience-manager/6-3/sites/developing/using/responsive.htmlhttps://helpx.adobe.com/in/experience-manager/6-3/sites/developing/using/responsive.html