Hello, everyone!I’m struggling to ensure that my videos display well for all participants regardless of the device they are using to complete the survey. I’m talking about smartphones, tablets, and laptops/desktops.I’ve embedded YouTube videos using the HTML code from YouTube.When the HTML code used a height of 315 and a width of 560, the videos were only partially displayed on my smartphone’s screen (Samsung A71).I found a suggestion here https://community.qualtrics.com/custom-code-12/resize-videos-to-fit-screen-24737 to change the width in the HTML code to “100%” and the height to “auto.”After that change, the videos started fitting on my Samsung phone screen, though the useful area of the video, the one with the picture showing information, became a bit smaller.At the same time, the computer version of the video became long and narrow, and the video itself occupies a very small part of the screen while about two-thirds of the area is black space:My question is: Is there any HTML code I could use to fix the issue of the reduced size of the video picture?P.S. I’m a rookie at coding.

You can use the code below to update the dimensions automatically:Qualtrics.SurveyEngine.addOnReady(function () {const quest = this;const qc = quest.getQuestionContainer();const iframe = qc.querySelector("iframe");iframe.style.height = "80vh";iframe.style.width = "80vw";});vh/vw refer to the % of total height/width of your screen.

Dear @ahmedA, thank you so much for the code!Because I don’t quite know how to code, may I exploit your expertise just a bit more?So far I’ve just pasted your code right before </iframe>, as below, but howdo I really add the code you’ve suggested?<strong>Please watch a short scientific report below:</strong><br /><br /><iframe height="auto" src="https://www.youtube.com/embed/zR8PaDw_8gA" width="100%">Qualtrics.SurveyEngine.addOnReady(function () { const quest = this; const qc = quest.getQuestionContainer(); const iframe = qc.querySelector("iframe"); iframe.style.height = "80vh"; iframe.style.width = "80vw";});</iframe>

How to make embedded YouTube video adjust to device screen size

How to make embedded YouTube video adjust to device screen size | Experience Community

Sign up

Login to the Community

Scanning file for viruses.

This file cannot be downloaded