AEM Cloud Sites: Body content not rendering in media-module component

This article explains how to resolve an issue where the body content in the media-module component doesn’t render correctly for end users on AEM Cloud Sites, even though the content appears as expected in other environments.

Description description

Environment

Adobe Experience Manager (AEM) Cloud Sites (all versions)

Symptoms

  • Body (RTE) content is missing or not rendered correctly for end users in the media-module component on published pages.
  • The same content displays as expected in other AEM Cloud Sites environments (such as Author and preview).
  • The issue is reproducible for all users and isn’t account-specific.
  • In the affected pages, only the expert title or other fields are rendered in the body container, while the authored biography or body paragraphs aren’t visible.
  • Viewing the page source confirms that the content is present in the delivery source, but the rendered DOM for end users omits the expected body content.

Cause

The issue is caused by the media-module.js component using a hard-coded row index (For example: rows[ 8]) as a fallback for the Body (RTE) content when Universal Editor field markers are missing in the published markup. If the row order changes or doesn’t match the expected structure, the wrong content (such as the expert title) is rendered in place of the body content.

Resolution resolution

Follow the steps below to resolve the issue:

  1. Review the implementation of your media-module.js component, specifically the logic responsible for selecting the row to render as the Body (RTE) content.
  2. Identify how the fallback logic selects the row when Universal Editor field markers are missing. For example, check if it uses a hard-coded index such as rows[ 8].
  3. Determine the correct row index for the Body (RTE) content in your current published markup. For example, if rows[ 9] contains the Body (RTE) content, update the fallback logic to select rows[ 9] instead of rows[ 8].
  4. Alternatively, consider implementing a position-independent fallback mechanism that identifies the Body (RTE) row based on content or structure, rather than relying on a fixed index. This approach makes the component more robust to future changes in row order.
  5. Test the updated logic in a Staging environment. Use browser developer tools to verify that the correct content is rendered in the .media-module-rte container.
  6. Once validated, deploy the updated component to Production.
  7. Monitor the affected pages to ensure the Body (RTE) content is now rendering correctly for end users.
recommendation-more-help
experience-cloud-kcs-help-kbarticles