iFrame | UC Agriculture and Natural Resources

March 17th, 2025

Situations with Iframes:

Adding a remote video via the Insert Media button adds a Drupal-Media tag, that is actually in an iFrame that has no ability to change width and height, or add a Bootstrap Class that makes the video responsive. The Stiff Little Fingers video illustrates this.

2. If you add an iframe via the iframe button at the top of Ckeditor, you can then go into the Source and add attribute width="100%" height will remain a fixed height, and you'll have to play around with the height to get the size video you want.

3. Bootstrap class="embed-responsive" in a wrapping div does not work. And if you add the bootstrap class .embed-responsive-item in the iframe, it does not work and gets stripped out by CKEditor. This is what the code should look like:

4. You can use the Video Content type: but it doesn't allow responsive or fixed sizing.

5. You can use the Tool Content Type, and the iFrame option. Paste in the embed version of the YouTube link, and you get a nice giant video. the d-inline-block seems to have 100% width applied to it.