Welcome!
-
-
- Learn Home
- Core Concepts
- Companies and Departments
- Courses
- Course Status and Visibility
- Sections
- Video Activities
- Reading Activities
- Document Activities
- Enrolling People in a Course
- Bulk Enroll With CSV
- Roles in a Course
- How Progress Is Tracked
- Course Reports
- Knowledge Base Overview
- Libraries and Folders
- Uploading Content Items
- Library Visibility
- AI Agent per Library
- My Courses
- Platform People
-
- Project Structure Template
- Table of Contents (TOC)
- Content Folder
- Introduction to Markdown
- Markdown Basics
- Markdown Lists
- Markdown Links
- Markdown Images
- Markdown Code
- Markdown Tables
- Markdown Equations
- Markdown Videos
- Markdown Embedded HTML
- VS Code Snippets
- Introduction to Styles
- Framed Narrations
- Markdown Configuration
- Editor Setup
-
Embedding Videos in Markdown with Lupo
Markdown has no syntax of its own for video, but Lupo reads the HTML <video> tag in a slide. When a slide contains a <video> tag, the video takes the place of the slide in the built video: the slide's own Markdown (headings, text, images) is not rendered, and the narration written in the slide's HTML comment is laid over the video. This section shows how to write that tag and how to time narration against the video.
External Video
The <video> tag is an HTML5 element used to embed videos into a webpage. In Lupo, the src attribute points at the video file: a public https:// URL, which Lupo downloads at build time (a Google Drive share link of the form drive.google.com/file/d/... is accepted), or the path of a file in your project, relative to the Markdown file. A file or URL that cannot be reached fails the build with an error naming the Markdown file and line.
Adding the controls attribute shows the standard play and pause controls in the Markdown preview; it has no effect on the built video.
The sound and the length of the built video are set with these attributes:
- Sound. By default the video's own sound is dropped and only the narration is heard.
no-mutedkeeps the original sound, mixed under the narration.mutedis the same as the default. - Length. By default the video is cut to the length of the narration or, if the narration runs longer, repeated until the narration ends.
video-durationkeeps the video's own length instead.repeatrepeats the video until the narration ends, which is also what the default does when the narration runs longer.
audio-duration, which appears in older examples, is not read by Lupo: the default already matches the video to the narration, so the attribute changes nothing.
If a slide contains more than one <video> tag, the videos play one after another as that slide, and the attributes are taken from the first tag.
Syntax
<video src="url or path" muted>Your device does not support video playback.</video>
For example:
---
marp: true
theme: customtheme
---
<video src="../universe.mp4" controls class="w-100">Your device does not support video playback.</video>
<!--
Welcome to our universe, a vast and wondrous place full of mysteries and surprises.
[[cheerful]] In this video, we will share with you some fun facts about the universe that will blow your mind. So, sit back, relax, and enjoy the show!
-->
Adding Narrations to Videos with Lupo
A narration line can be made to start at a chosen moment of the video. Write the time in double parentheses at the start of the line, followed by the narration text. The time is counted from the start of the slide, which for a video slide is the start of the video.
Each narration is one line of the HTML comment, without line breaks. Three forms are accepted, and each field is one or two digits:
((seconds)) — ((1)) starts at second 1. Seconds-only goes up to ((99)); for anything longer, use minutes and seconds, as in ((1:40)).
((minutes:seconds)) — ((1:3)) starts at 1:03.
((hours:minutes:seconds)) — ((1:2:3)) starts at 1:02:03.
Seconds can carry a decimal fraction of up to three digits: ((5.5)) starts at 5.5 seconds. Comma-separated forms such as ((1, 3)) are not accepted. A marker in any other shape stops the build with the error "Invalid time format in file … Please verify if the time format is ((h:m:s.ms))".
On a slide where you use time markers, give every narration line one. A line without a marker is placed at the running total of the lengths of the lines above it, counted from the start of the slide — not after the timed line before it. The full rules, including what happens when two narrations overlap, are on Framed Narrations.
For example:
---
marp: true
theme: customtheme
---
<video src="../universe.mp4" controls>Your device does not support video playback.</video>
<!--
((5)) Welcome to our universe, a vast and wondrous place full of mysteries and surprises.
((12)) [[cheerful]] In this video, we will share with you some fun facts about the universe that will blow your mind. So, sit back, relax, and enjoy the show!
-->