AEM Dynamic Media:PNGの透明度が白い背景で表示される

この記事では、Adobe Experience Manager Dynamic Mediaで、透明な背景を持つPNG画像が白い背景で表示される問題に対処する方法について説明します。

説明 description

環境

Adobe Experience Manager(AEM) Dynamic Media (すべてのバージョン)

症状

  • 背景が透明なPNG画像がDAMにアップロードされ、アセットプレビューで透明に表示されます。
  • これらの画像がweb ページで使用されたり、ダイレクト配信URLを介してアクセスされたりすると、透明度は白い背景に置き換えられます。
  • 配信URLでfmt=png-alpha パラメーターを使用しても、問題が解決しない場合があります。
  • エラーメッセージは表示されません。問題は画像レンダリングです。

原因

デフォルトでは、Dynamic Mediaは、fmt=png-alphaを使用して透明度を明示的に要求しない限り、背景が不透明な画像を返します。 このパラメーターが見つからないか、正しく設定されていない場合、背景は白く表示されます。

解決策 resolution

問題を解決するには、次の手順に従います。

  1. 画像配信URLにfmt=png-alpha パラメーターが含まれていることを確認して、アルファの透明性を持つPNGを明示的に要求します。
  2. 画像プリセットを使用する場合は、プリセットがアルファ透明度でPNGを出力するように設定されていることを確認します。 必要に応じて、プリセットを更新してfmt=png-alphaを含めます。
  3. URLまたはプリセットを更新した後、ブラウザーキャッシュと任意のCDN キャッシュをクリアして、最新の画像が提供されるようにします。
  4. 画像を基本的なHTML ページに埋め込み、AEM UIの外側で透明度が正しくレンダリングされていることを確認します。 ここに透明度が正しく表示される場合、ページのCSSまたは背景の設定に問題がある可能性があります。
  5. ImageServerの設定を確認します。 デフォルトでは、透明度が明示的に要求されない場合、ImageServerは不透明な背景色の画像を返します(デフォルトは白です)。 要求またはプリセットを更新して、必要なアセットに対して常に透明性が要求されるようにします。

これらの手順を完了したら、Web ページにPNGの透明度が正しく表示されることを確認します。

recommendation-more-help
experience-cloud-kcs-help-kbarticles