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:
- Review the implementation of your
media-module.jscomponent, specifically the logic responsible for selecting the row to render as the Body (RTE) content. - 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]. - 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 selectrows[ 9]instead ofrows[ 8]. - 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.
- Test the updated logic in a Staging environment. Use browser developer tools to verify that the correct content is rendered in the
.media-module-rtecontainer. - Once validated, deploy the updated component to Production.
- Monitor the affected pages to ensure the Body (RTE) content is now rendering correctly for end users.
Related reading
recommendation-more-help
experience-cloud-kcs-help-kbarticles