0

I am trying to embed a responsive video how do i increase the width. it keeps coming in as 300 wide and not sure how to change that, The embed code is set to fit 100% of the container but not sure how to change the size of the container in dominknow

1846 0 5
Posted   2 years ago
  ●   Edited   2 years ago

Comments

( 0 )

Answers  ( 5 )

0
Posted   2 years ago

What's the code that you're using/pasting in?

Comments

( 0 )
0
avatar jhermes18   |    
Posted   2 years ago
  ●   Edited   2 years ago

not really sure how to share code since everytime i do it displays the video, but i was able to come up with solution by adding some custom css to the theme. For some reason the video is set at a max-width:300px; i just added code to change it to 100% which seems to be working

 

Comments

( 0 )
0
avatar Paul Schneider   |    
Posted   2 years ago

It will depend on your video, but for example YouTube.

The code will look something like this 

iframe width="860" height="450" src="https://www.youtube.com/embed/iemvnxDjrBY?wmode=opaque" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""

If you set the width to a percent - it is looking for its container to set the size as it isn't a responsive embed code so it doesn't work to just set it to 100% (you will see when you verify it will get set back to 350.  You can though change the code and set a certain size for the max size and then dominKnow will automatically shrink it with the container)

In this case I made the video 850 wide.

 

Comments

( 0 )
0
avatar jhermes18   |    
Posted   2 years ago

When i added the below code to the css in the theme settings it seemed to size the video to how i needed it. Will this cause problems in the final product?

 

#2675726_content_wrapper {

max-width:none !important;
}

.dki-authoring-content-wrapper   {
max-width:none !important; }

Comments

( 1 )
0
2 years ago     Paul Schneider     783   |   9  

Sorry we don't provide direct support for CSS modifications. We advise to test thoroughly and target as specific items as you can. Targeting items that are at higher levels in the hierarchy can cause a lot of problems. For your use case I suspect using the approach I suggested would provide a safer alternative..

0
avatar jhermes18   |    
Posted   2 years ago

well we are embedding the video from a platform called wistia. And when we gave it a fixed with, the video would get cut off when the course was scaled to the tablet or mobile sizes. 

Comments

( 1 )
0
2 years ago     Paul Schneider     783   |   9  

That is too bad. I tested the above with YouTube and it works great (confirmed on device as well). There might be additional settings in your Wistia code that could help. If the CSS option works, great, but as recommend, please test thoroughly.