Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 4 Next »


Table of Contents



Videos

Videos can be used either in a Text Module's Content Field, or in an Image Module. This section covers using them in Text Modules. Visit the Image Module link to see how to use embed codes in an Image Module.

YouTube videos and other media can be referenced or embedded into pages using the WYSIWYG editor. Before you can include a video into a Text Module, you need either the URL (web address) or the embed code.

Here are both a URL and an embed code example of the same YouTube video.

Source URL: https://www.youtube.com/watch?v=yON_E6NGzK4

Embed Code: <iframe width="854" height="480" src="https://www.youtube.com/embed/yON_E6NGzK4" frameborder="0" allowfullscreen></iframe>

The difference is that the embed code allows you more control over how large the image. However, it's recommended that the URL is used in the Source field to better accommodate responsiveness.

Click on the Insert/Edit Embedded Media button on the WYSIWG editor.



The Insert/Edit Embedded Media dialog will display.

Source URL Videos

Enter the URL for the Video in the Source field.

  • The Dimensions fields will automatically populate.
  • If you need to alter the size of the video, make sure Constrain Proportions remains checked and change the value in one of the Dimensions fields. The other dimension will update relative to the new value to maintain the correct aspect ratio.
  • Click Ok to add the video to the page. A still image of the video should display in the Text Module. If it doesn't, then something with the video or the URL is probably incorrect.

Embed Code Videos

Click on the Embed tab.

  • Copy the entire embed code. On YouTube and many other hosted video sites, right-clicking on the video will bring up your browser's shortcut menu. Select the option for Copy embed code. Selecting that option will copy the correct code to your computer's clipboard so you can paste it.
  • Copy and paste the entire embed code into the Embed Code Field.

An example of what your finished code would look like appears in the screenshot below.





  • No labels