Forum Discussion
Storyline Player in Canva
Hello E-Learning Heroes!
The code we use to insert Storyline interactives into our Canvas LMS makes the learning objects very small on the screen for students. Is there a code that will embed the Storyline file at full screen instead of having margins?
I have attached an image where you can see the black rectangle takes up the whole screen but when it is played it has wide margins and comes in smaller.
Here is the code we use: <iframe frameborder="0" name="Matching" width="100%" height="540" src="https://cms.gavirtualschool.org/DEV21/CTAE/APCompSciPrinc_21/Objects/ComputersandtheirHistory_ComputerPartsMatchingImages/story_html5.html"></iframe>
Thanks!
Im not sure if this helps... but uploading the Scorm to the files folder and then referring to it like this...
<iframe class="ef-file-preview-frame ef-file-preview-frame-html attachment-html-iframe></iframe>" style="width: 100%; height: 940px; overflow: hidden;" src="https://tilburguniversity.instructure.com/courses/7608/files/804895/download" data-api-endpoint="https://tilburguniversity.instructure.com/api/v1/courses/7608/files/804895" data-api-returntype="File"></iframe>
Works on our CanvasLMS.Hi Math! Thanks for the advice, how are you doing this?? Could you send me a step by step?? We have a CMS that we upload the exported .storyline files to, then embedd them in Canvas. I don't know how to create SCROM files, or what all to upload to files etc...Would I still upload to our CMS? @mathnotermans
This is EXACTLY what I am looking for! Thanks for your help!
I published as Scorm.... uploaded that into the files folder...unzipped all there...so it still is Scorm...and then embedding the html... you really need to upload to Instructure Canvas. Else for sure this won't work.
Hello Danielle!
Thank you for including a screenshot! I see exactly what you're talking about. I'm not seeing any issues with the code that you're using, so it would be helpful to see your .story file so I can test it in another LMS environment.
You can either attach it to this discussion or privately in a support case.
Hi Lauren,
Here is one of our files, but this happens with every .story file. We are just looking for a player code to embed in Canvas that will allow the interactive to fill the screen and not have the margins. Are there any other codes we could try. I put the one we use above. Thanks so much.
Hello Danielle!
Thank you for sharing your .story file! I've uploaded it to SCORM cloud which is another LMS environment. Here is the invite link for you to see the behavior in SCORM cloud. I see the extra margins, however those shift depending on the browser size. With the Player being responsive, the change in margins is expected since each learner will have a different window size.
When I open just the .storyline I can get a full-screen version as well. BUT when I embed it in Canvas, it has large margins and makes the text small and students can't see it as well. I'm trying to figure out how to make the interactive large in Canvas. Any ideas? I don't know how to make SCORM files, can you help me there?
