Step One: Copy Embed Code from YouTube or Other Source
For YouTube Videos:
- Find the Video you want to embed, click "SHARE"
- Click "Embed"
- COPY the embed code from the box
Step Two - Paste the EMBED CODE into the SOURCE of your content editor.
- In the Admin, navigate to the page you wish to place the video on
- Add a new Content Editor to the page or Edit an existing Item
- Click the "SOURCE" tab (this allows you to view or edit the content in code form)
- PASTE your EMBED code here
Step Three: Adjust the Size for the Embed
When adjusting the size for your embedded video, make sure that the width and height - underlined in blue in the image below - is appropriate for the area on your website in which the video will appear. "100%" for the width and "416" for the height are the preferred to have the video fit in the stack item for most pages when viewing them on desktop or mobile; however, you may have to adjust the height to something smaller if you plan to place it in the right/left column or in the columns within a three-column layout. For instance, the height can be:
- "270" in the left/right column for a two-column layout,
- "200" in the left/right column for a three-column layout, or
- "315" in the middle section for a three-column layout
If you ever need to go back and adjust the width and height for your video, you can right-click your iFrame box of your video and select "iFrame Properties" to make the changes - aside from going into the "SOURCE" section to make the changes.
Are you unsure of the appropriate size for the embed of your video? Contact Envisionwise / LinkedUpRadio at email@example.com or at 217-239-0975.
6 - Click "SAVE CHANGES"
NOTE: If the menu of your site seems to disappear behind your embedded YouTube video, add the parameter in the example below:
Example iFrame code:
<iframe title="YouTube video player" width="525" height="325" src="http://www.youtube.com/embed/ucowE8dtNqM" frameborder=”0″ allowfullscreen></iframe>
Code With Fix Applied:
<iframe title="YouTube video player" width="100%" height="416" src="http://www.youtube.com/embed/ucowE8dtNqM?wmode=transparent" frameborder="0" allowfullscreen></iframe>