How to make dynamic media image responsive

Avatar

Avatar
Validate 1
Level 1
LaMind3
Level 1

Like

1 like

Total Posts

15 posts

Correct reply

0 solutions
Top badges earned
Validate 1
Boost 1
View profile

Avatar
Validate 1
Level 1
LaMind3
Level 1

Like

1 like

Total Posts

15 posts

Correct reply

0 solutions
Top badges earned
Validate 1
Boost 1
View profile
LaMind3
Level 1

10-12-2020

I have integrated Dynamic Media scene7 Mode with my AEM 6.5.5.0 environment. I have created few presets(480 x 250, 300 x 250, 330 x 100) and these presets are getting rendered on page. But what I see is the images are not responsive i.e.  every time I resize the browser window, the image size and width do not change. Aren't these dynamic media images supposed to be responsive ?How can I achieve responsiveness of images with dynamic media integration. 

Accepted Solutions (1)

Accepted Solutions (1)

Avatar

Avatar
Give Back 5
Level 4
praveenjain
Level 4

Likes

37 likes

Total Posts

36 posts

Correct reply

10 solutions
Top badges earned
Give Back 5
Give Back 3
Give Back
Ignite 1
Boost 5
View profile

Avatar
Give Back 5
Level 4
praveenjain
Level 4

Likes

37 likes

Total Posts

36 posts

Correct reply

10 solutions
Top badges earned
Give Back 5
Give Back 3
Give Back
Ignite 1
Boost 5
View profile
praveenjain
Level 4

24-12-2020

We define some required renditions [presets]  in Dynamic media.

Now when any image is uploaded, it dynamically generates same image of those all renditions.

It generates URL for all renditions and which ever url is used it shows that specific rendition only

 

Now from Site our custom JS should take care of responsive functionality and decide based on screen size which rendition to be picked up and generate thet scene7 ulr dynamically [if img tag is used in html], else picture tag can be used where we can hardcode different renditions for different endpoints [tab/mobile/desktop].

 

Eaxample:

1) http://<server>.scene7.com/is/content/<company>/<filename>.some-rendition.format

2) http://<server>.scene7.com/is/content/<company>/<filename>/preset-name

 

In case needs details on how to integrate dynamic media with aem click here

 

Regards

Praveen

Answers (1)

Answers (1)

Avatar

Avatar
Validate 1
Level 2
shaileshb584084
Level 2

Likes

14 likes

Total Posts

18 posts

Correct reply

2 solutions
Top badges earned
Validate 1
Give Back
Boost 5
Boost 3
Boost 10
View profile

Avatar
Validate 1
Level 2
shaileshb584084
Level 2

Likes

14 likes

Total Posts

18 posts

Correct reply

2 solutions
Top badges earned
Validate 1
Give Back
Boost 5
Boost 3
Boost 10
View profile
shaileshb584084
Level 2

10-12-2020

Hi,

 

Here you need to choose an image preset that is responsive (designated by the RESS button after you select it).

 

There is a step by step documentation available which describes how you can get the responsive images with dynamic media.

 

Reference:- https://experienceleague.adobe.com/docs/experience-manager-64/assets/dynamic/image-presets.html?lang...

 

Thanks