How to embed YouTube, Vimeo or Wistia videos

 

Videos are a great way to add rich and dynamic content to your prototypes. Marvel lets you embed videos directly from YouTube, Vimeo or Wistia.

 

How to embed video in Marvel:

  1. Hover over any image in your project
  2. Click Prototype
  3. Select any existing hotspot or click and drag anywhere on the image to draw a new hotspot
  4. Click Link to URL or embed
  5. Select Embed in the drop-down menu
  6. Paste your embed code from Youtube or Vimeo
  7. Click Save

 

Where to find the embed code on YouTube:

  1. Go to any video on YouTube
  2. Click 'Share'
  3. Click 'Embed'
  4. Copy the embed code

You can click Show More to access additional options such as removing the player controls.

Where to find the embed code on Vimeo:

  1. Go to any video on Vimeo
  2. Click 'Share'
  3. Copy the embed code

You can click Show Options to access additional options such as looping the video and labels. 

 

Where to find the embed code on Wistia:

  1. Go to any video on Vimeo
  2. Click the 'Share' icon
  3. Click 'Embed'
  4. Copy the embed code

You can click Show Options to access additional options such as looping the video and labels. 

 

Note - when copying the embed code, the entire embed code should be copied, so it should look like this when it's pasted into Marvel:

 


<iframe width="560" height="315" src="https://www.youtube.com/embed/Lm8p5rlrSkY" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

 

Was this article helpful?
6 out of 9 found this helpful