Video not playing URL from DAM | Community
Skip to main content
djohn98390536
New Participant
August 3, 2023
Solved

Video not playing URL from DAM

  • August 3, 2023
  • 3 replies
  • 1399 views

I am using the below code to display a video .It is working as expected when  it fetch video from external URL but not working when I give DAM video url. Please help to resolve the issue.

 

<iframe width="100%" height="100%" src="${config.videoUrl}" ></iframe>

 

 

Thanks.

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by Mahedi_Sabuj

Hi @djohn98390536, To display a video from the DAM in AEM, it is recommended to use the HTML5 video element. This approach ensures that the video is served securely and follows best practices for web development.

Here's an example of how you can use the HTML5 video element to display a video from AEM DAM:

<video width="100%" height="100%" controls>
    <source src="${config.videoUrl @ context = 'uri'}" type="video/mp4">
        <!-- Fallback content for browsers that don't support HTML5 video -->
        Your browser does not support the video tag.
</video>

3 replies

Shashi_Mulugu
New Participant
August 4, 2023

@djohn98390536 iframe works for YouTube videos where players for video gets inject by YouTube runtime along with responsive settings.

 

But in case of aem video, it's just a video file without any player attached to it. So you need to use any video player plugin and use this video url as source, ex html5 player or dynamic video component if you use Dynamic Media/Scene7.

Mahedi_Sabuj
Mahedi_SabujAccepted solution
New Participant
August 3, 2023

Hi @djohn98390536, To display a video from the DAM in AEM, it is recommended to use the HTML5 video element. This approach ensures that the video is served securely and follows best practices for web development.

Here's an example of how you can use the HTML5 video element to display a video from AEM DAM:

<video width="100%" height="100%" controls>
    <source src="${config.videoUrl @ context = 'uri'}" type="video/mp4">
        <!-- Fallback content for browsers that don't support HTML5 video -->
        Your browser does not support the video tag.
</video>

Mahedi Sabuj
EstebanBustamante
New Participant
August 3, 2023

Try by adding a context in your HTL code, something like below:

<iframe width="100%" height="100%" src="${config.videoUrl @ context='html'}" ></iframe>

If that not helps, please post what are you seeing in the browser console. 

 

Reference:
https://github.com/gabrielwalt/aem-sightly-style-guide/blob/master/README.md#3.2

Esteban Bustamante