Embed code based on video attribute
Aug 17, 2020
Hi all,
I'm trying to embed a code for a video (mp4 + location, not a streaming url), but I get an error message saying the embed code is incorrect. It is an HTML5 code based on a video attribute rather than an iframe attribute.
Is Storyline 360 not able to handle these kinds of embed code at all? I never had issues with an iframe code, but this one just isn't working.
The code I have is :
<video controls controlslist="nodownload" poster="https://s3.eu-west-1.amazonaws.com/assetbank-vanderlande-repurposed/9d0%2FKfuuyYs5dHFzyxLfRKTO788zkmZWGhUX%2Ejpg" src="https://s3.eu-west-1.amazonaws.com/assetbank-vanderlande-repurposed/239%2FAvc3PBhGaulMX7K3gLWju3kWu01k8XKw%2Emp4" width="1920" height="1076">Your browser does not support the HTML5 video element.</video>
Best regards,
Joyce
1 Reply
Hi Joyce, I think the embed methods you are using are for vimeo and youtube embed codes and not for <video> elements.
You can insert your video using a web object, here's an example: https://www.dropbox.com/t/2oPgvrijgA9a0GV9
You can see it in action here: https://360.articulate.com/review/content/8c670b96-10ab-46d1-86f5-d60507ef2cb5/review
You need to be careful with the sizes you set to avoid scroll bards. If comfortable with CSS, I'd recommend making the video fluid: https://css-tricks.com/fluid-width-video/
In the example I've created, the imported web object (the index.html file) contains your <video> tags. The dimension in the video are width="1200" height="673". The web object dimensions are slightly large. I'm not sure why this is necassary, but it avoids scroll bars: 1220x684. As mentioned though, I'd look at fluid video so you don't need to worry about scrollbars at all.
One thing to remember, if you ever edit the index.html, you must rename the folder video-embed-00, just increment by one each time and then re-import your webobject.
This discussion is closed. You can start a new discussion or contact Articulate Support.