---
title: "Add demo videos to Mintlify, GitBook and Docusaurus docs | tday"
description: "Which docs sections need a video, the embed code each docs platform takes (MDX, HTML, GitBook, a link), and four ways to keep demos in your docs current."
url: https://tday.com/blog/add-demo-videos-to-your-docs
markdown: https://tday.com/blog/add-demo-videos-to-your-docs.md
last_updated: 2026-11-10
---
# How to add demo videos to your docs: Mintlify, GitBook, Docusaurus and more
Which docs sections need a video, the embed code each docs platform takes (MDX, HTML, GitBook, a link), and four ways to keep demos in your docs current.
By the tday team Published November 10, 2026 7 min read
## The short answer
Record one short narrated demo per docs page and embed its player under each heading. Use the MDX iframe for Mintlify, Docusaurus, Nextra, Fern and ReadMe, and the HTML iframe for plain HTML pages. GitBook, Notion and Confluence take the share link, and show it as a link card for now. A tday embed plays the demo's newest take and can open at a section's first line, so you paste it once and a re-record updates every page that shows it.
## Key takeaways
- Only some docs sections need a video: the ones that show something being done in the app. tday reads your docs and marks them.
- An .mdx page needs the MDX form of the iframe. The HTML form sets style as a string, which breaks an MDX page when it renders.
- GitBook pages take no HTML. Add an embed block with the share link instead.
- Embed the demo, not a file. A tday embed keeps working after a re-record, and its ?c= anchor names a line, never a timestamp.
- There are four ways in: paste it yourself, have your coding agent edit your docs repo, merge a pull request tday opens, or add one script to your docs site. The last two need Growth or above.
Embedding a video in docs is one line of code. That is not why most docs have no videos. They have none because someone has to record a demo for every page, put each one under the right heading, and do it all again when the product changes.
So this guide covers the easy part, the embed code, and the hard part, the upkeep. The example is tday's own docs: 25 sections across 13 pages.
Watch [Give every docs page its demo](https://tday.com/c5wkyqvd) (2:09), a demo of tday recorded by a coding agent with tday.
## Which docs sections need a demo
A section needs a video when it shows something being done in the app: connecting an account, inviting a teammate, setting up a workflow. A concept page, a reference table or a list of limits is better as text.
tday makes this call for you. It reads your documentation, splits each page into sections and marks the ones that show something being done. You can overrule it on any section. There are three ways to connect your docs:
| Option | What tday reads |
| --- | --- |
| Website address | Your public docs, through their sidebar, `llms.txt` or sitemap |
| Mintlify | Your Mintlify site through its own API, private pages included, kept current as it changes |
| GitBook | Your GitBook site through its API, private pages included |
Connect docs by address, or through Mintlify or GitBook.
## Record one demo per docs page
On the Docs page, **Record all pages** gives you a prompt for your coding agent. The ask is one line:
```text
Use tday to make demo videos for our docs: run demo_docs, then record the demos it lists
```
`demo_docs` answers with what is left to record. First comes a new take of each demo whose docs changed since it was recorded. Then one demo per docs page, in your docs' order, with up to 6 sections each. It lists 25 demos at a time.
Your agent starts one demo instance of your app, resets its data to your seed before each demo, and tags every narrated line with the docs section it shows. That tag is what lets an embed start at the right place.
Record all pages: an install line, the editors it opens in, and the rules the agent records by.
## The embed code each docs platform takes
An embed frames the demo's player, which is the share link with `/e/` before the id. Leave out `height`: the frame takes its height from its width.
For MDX pages (Mintlify, Docusaurus, Nextra, Fern, ReadMe):
```jsx
```
For plain HTML pages:
```html
```
For GitBook, which takes no HTML, an embed block of the share link:
```text
{% embed url="https://tday.com/ab12cd34" %}
```
| Docs platform | Use |
| --- | --- |
| Mintlify, Docusaurus, Nextra, Fern, ReadMe (.mdx) | The MDX iframe |
| A plain HTML site | The HTML iframe |
| GitBook | An embed block with the share link |
| Notion, Confluence | Paste the share link |
The mistake to avoid is pasting the HTML form into an `.mdx` file. It sets `style` as a string, and the page breaks when it renders. tday's **Copy embed** puts the form your site uses first.
GitBook, Notion and Confluence show a tday link as a link card for now, not a player. The card opens the share page, which plays the demo.
Copy embed, in the form your docs take.
## Start the video at the right section
A reader of a page's third section should not have to sit through the first two. A tday embed for a docs section adds `?c=` with the id of that section's first narrated line, so the player opens there:
```text
https://tday.com/e/ab12cd34?c=b4
```
It names the line, never a timestamp. So it still opens in the right place after the demo is recorded again and the timing moves.
## Four ways to put demos in your docs
| Way | Who edits your docs | Plans |
| --- | --- | --- |
| Copy embed | You, by pasting | Every plan |
| Your coding agent | Your agent, in your docs repo, as a diff you approve | Every plan |
| A change to review | tday, as a pull request (Mintlify) or change request (GitBook) you merge | Growth and above |
| One script | Nobody: a script places the players on your live docs | Growth and above |
Your coding agent edits your docs repo, or one script places the players on your live site.
**Your coding agent** suits docs kept in a repository. It runs `demo_embed_docs`, puts each snippet on its own line after its heading and changes nothing else. It replaces an older embed of the same video, tells you which headings it could not find, shows you the diff, and commits only if you say so.
**A change to review** suits a site connected through Mintlify or GitBook. tday puts every finished demo under its heading and opens one pull request or change request. Nothing is published until you merge it.
**One script** suits any docs site that can run a script. Add `tday-embed.js` beside `docs.json` in a Mintlify project, an entry in `scripts` in `docusaurus.config`, or a `