Expand my Community achievements bar.

Adobe Summit 2025: AEM Session Recordings Are Live! Missed a session or want to revisit your favorites? Watch the latest recordings now.

Mark Solution

This conversation has been locked due to inactivity. Please create a new post.

SOLVED

Dynamic Media - PNG image with transparent background - Served with white

Avatar

Level 4

Hello Team,

We are using dynamic media in our project. and we are exploring DM. I am facing one issue that is we have uploaded image with transparent background on AEM DAM. But when it served from DM, getting white background. 

 

I tried adding manually fmt=png-alpha to remove white background. But not sure how to get this dynamically append as query param for all png images. OR is there a better way to handle white background ?. Also not sure whether its an issue in the DM product where it converts transparent background image to white background image?

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

Probably then you need to add this param along with bfc and fmt

fmt=png-alpha&bfc=on

You can update the existing component or use sling rewriter to get the images and update the url while generating url

e.g. https://github.com/arunpatidar02/aem63app-repo/blob/master/java/CustomLinkChecker.java  

 

Arun Patidar

AEM LinksLinkedIn

View solution in original post

8 Replies

Avatar

Community Advisor

Hi,

Is this in Safari or Chrome browser?

 

I have seen this issue with monochromatic image only in Safari.DM returns 403 instead of actual image.

Arun Patidar

AEM LinksLinkedIn

Avatar

Level 4

Hi @arunpatidar this is happening all browsers, tested on chrome, safari, firefox.

Avatar

Community Advisor

What response do you get from DM? Error or white image?

Arun Patidar

AEM LinksLinkedIn

Avatar

Level 4

I am getting the image but with the white background 

Avatar

Correct answer by
Community Advisor

Probably then you need to add this param along with bfc and fmt

fmt=png-alpha&bfc=on

You can update the existing component or use sling rewriter to get the images and update the url while generating url

e.g. https://github.com/arunpatidar02/aem63app-repo/blob/master/java/CustomLinkChecker.java  

 

Arun Patidar

AEM LinksLinkedIn

Avatar

Employee Advisor

Hi @pradeepmoolemane ,

 

Please go through below URL

https://blogs.perficient.com/2019/03/07/aem-6-4-challenges-with-dynamic-media-scene7-integration/

 

You can add format.

 

Hope this helps!!

Thanks

Avatar

Community Advisor

Hi @pradeepmoolemane - Good Job, you have rightly identified the solution to rendering the transparent images by using fmt=png-alpha. Now, there are multiple solutions to apply this formatting for all the pngs but the simplest could be to have a utility that detects the DAM image extension and renders a corresponding DM URL with the fmt option suffixed and use it in all the components leveraging DM images.

Let me know, if you have any other questions!

Avatar

Level 4

Resolved by extending image preset selection option to teaser component and preset setup configured with png-alpha.