Back to Tutorials

Optimising video for web

Getting video to work well for your browser

Have you subscribed to TheFrogBlog? Find out more

Microsoft OneDrive

Using OneDrive to host and stream videos is fairly straight-forward, although you do have to use the HTML widget.


Step 1

Upload your video to your OneDrive 


Step 2

Right-click on the video and choose either Share or Get a link



Step 3

In the pop-up, click on the Get a link section and change the drop-drop View link - no sign in required


Step 4

Copy the web address created


Step 5

Add an HTML widget to your FrogLearn page.   Add the following code:


<video  width="320" height="240" controls>
  <source src="your_oneDrive_movie.mp4" type"=video/mp4">
Your browser does not support the video tag.


Replace your_oneDrive_movie.mp4 with the link supplied in Step 4.

The width and height in the above example are set to 320 pixels by 240 pixels.  Hopefully you can see how straight they are to change to whatever size you wish.

Tutorials in this series...

product hubs

FrogProgress-600_600.png  FrogLearn 600_600.png  FrogPlay 600_600.png

Product updates

A sneak peek at the new Frog App and updates to the Frog interface.
Save time with pre-populated site templates
FrogLearn now has over 30 mobile themes
How we can work with Multi-Academy Trusts
Progress Hub - All about our student progress tracker
All about our student progress tracker
All about our online assessment system
Helpful information that relates to GDPR functionality inside the Frog platform
Get access and use all our in-platform Site templates
Save time with pre-populated site templates



Discover how Frog can be used for...