Responsive videos in articles

2 Comments

  • Karen D Snyder
    Comment actions Permalink

    We were able to make the videos responsive with some custom coding, following the information from Wes Drury in https://support.zendesk.com/hc/en-us/community/posts/210794867-Resize-Youtube-Video-in-Article.

    As the information from Wes states, we edited the code of the article, to enclose the <iframe> element with the link to the video, inside a <div> element with class "embed-container". Then we added the following CSS in style.css:

    .embed-container {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    max-width: 100%;
    }

    .embed-container iframe, .embed-container object, .embed-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    }

    The above made our embedded videos responsive for smaller screens.

    0
  • Luke Hutchings
    Comment actions Permalink

    Thank you very much! We are all set! 

    0

Please sign in to leave a comment.

Powered by Zendesk