How do I embed Panopto videos in Moodle?

1. Before you begin, it is a good idea to have to hand the unique 32 character alphanumeric code for your Panopto video. When viewing the video, copy the id code from your browser URL box.
   
   
   
2. Next, in Moodle (with Edit Mode on) select Add a new activity or resource where you want to embed the Panopto video, and then select Text and media area.
3. Click the arrow from the top left of the Atto editor.
   
   
   
4. And then click the HTML icon from the bottom row.
   
   
   
5. Copy the HTML code below, and paste into the HTML editor in Moodle.

<div class="container">
 <div class="embed-responsive embed-responsive-16by9"><iframe src="https://brookes.cloud.panopto.eu/Panopto/Pages/Embed.aspx?id=paste-the-ID-here" allow="autoplay" allowfullscreen="allowfullscreen"></iframe>
 </div>
</div>

6. If you have not done so already, find the Panopto link of the video you want to add to Moodle and copy the 32 character alphanumeric code that appears after id=

Example

If the link is brookes.cloud.panopto.eu/Panopto/Pages/Viewer.aspx?id=abc47239-5c9d-42b0-8fbf-b08400fe7d0a, then only copy abc47239-5c9d-42b0-8fbf-b08400fe7d0a

7. In the HTML code you pasted into Moodle, replace the textpaste-the-ID-herewith the 32 character alphanumeric ID you copied earlier.
8. Save changes.
9. Your video should now appear embedded into your Moodle scroll (see below). You can drag and drop it where needed.