Sample iframe Embed HTML
<html> <head> <title>Webcast - iframe Embedding Sample Page</title> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,400i,700,700i" rel="stylesheet" /> <link href="https://meyerweb.com/eric/tools/css/reset/reset.css/reset.css" rel="stylesheet" /> <link rel="shortcut icon" href="https://www.movingimage.com/wp-content/uploads/sites/2/2017/11/cropped-movingimage_favicon-2-192x192.png" /> <style> body { font-family: "Source Sans Pro"; } #header { /* this header is just an example, your CMS may introduce it's own header. The important thing is to know the height of the header */ background-image: url('https://webcast.movingimage.com/csr/img/system-info-icon.png'); background-repeat: no-repeat; background-color: #f5f5f5; border-bottom: 1px solid #009339; height: 60px; /* this value is important */ } .wbc-iframe-container { display: flex; /* essential, works with iframe selector to centre content in the page */ height: calc(100vh - 61px); /* sets the container height to the viewport less the main page header height and a tiny bit of margin */ } .wbc-iframe-container iframe { border-left: 1px solid #f5f5f5; border-right: 1px solid #f5f5f5; box-shadow: 0 2px 20px 0 rgba(0,0,0,.12),0 0 4px 0 rgba(0,0,0,.05); margin: auto; /* essential, works with the container selector to centre content in the page */ width: 80%; /* sets the width of the iframe and therefore its content, the Webcast */ } </style> </head> <body> <div id="header"> </div> <div class="wbc-iframe-container"> <!-- paste the iframe embed code from the Webcast > Languages tab below here --> <iframe id="wbc-iframe" title="Webcast - iframe Integration Example" src="https://webcast.movingimage.com/csr/#/webcast/5c8a630fe5b9df00125712c5/en" allowfullscreen="true" allow="fullscreen"></iframe> <!-- paste the iframe embed code from the Webcast > Languages tab above here --> </div> </body> </html>
We do not recommend embedding multiple Webcasts into a single page.