To set up a snippet to display embedded videos you 

1. get your embed code 

2. click the blue button (Top right in the back of the site) and select snippet from the options.

decide how many videos you want per row and copy the snippet mark up from 

2 column, 3 column, 4 column

I'll use the 2 column code as an example.  Replace the bolded part with the embed code

<div class="teasers teasers--2-col">
<div class="teaser__content">
<!-- Content goes in here -->
<sup class="kicker__headline">Sub Heading One</sup>
<h2>Heading Column One</h2>
<p>This content is an example of content that could be placed for different column or grid layouts.</p>
</div>
<div class="teaser__content">
<!-- Content goes in here -->
<sup class="kicker__headline">Sub Heading Two</sup>
<h2>Heading Column Two</h2>
<p>This content is an example of content that could be placed for different column or grid layouts.</p>
</div>
</div>

Here is what the snippet looks like after the video code has been added 

<div class="teasers teasers--2-col">
<div class="teaser__content">
<!-- Content goes in here -->
<style>.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%; }</style><div class='embed-container'><iframe src='https://www.youtube.com/embed/undefined' frameborder='0' allowfullscreen></iframe></div>
</div>
<div class="teaser__content">
<!-- Content goes in here -->
<style>.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%; }</style><div class='embed-container'><iframe src='https://www.youtube.com/embed/undefined' frameborder='0' allowfullscreen></iframe></div>
</div><br