Slide

H5P equivalent

H5P Course Presentation (slide)

When to use

Use Slide as a child of SlideDeck — one screen in a presentation-style lesson. Combine with Heading, Text, assessments, or content blocks.

Do not mount Slide directly under Lesson.

Requirements

  • Each Slide needs blockId and title.

  • Keyboard navigation is provided by the parent deck.

Try it

Documentation demo

Use the Live demo, React, AI prompt, and Packaging / Manifest tabs below. Embedded demos disable telemetry, xAPI, and the LMS bridge. For production delivery, use the CLI template src/courseConfig.ts and LMS Go-Live.

Open demo in full tab 

<SlideDeck blockId="briefing" title="Security briefing">
  <Slide blockId="context" title="Context">
    <Text>Attackers impersonate payroll and shipping during busy seasons.</Text>
  </Slide>
  <Slide blockId="check" title="Check">
    <TrueFalse checkId="slide-tf" question="A familiar display name guarantees legitimacy." answer={false} />
  </Slide>
</SlideDeck>

Copy into Cursor, Copilot, or ChatGPT after the vibe coding starter context:

Read lessonkit.json and src/App.tsx before editing.

Add a Slide block (H5P-style: Course Presentation (slide)) like this example inside the active <Lesson>:

<SlideDeck blockId="briefing" title="Security briefing">
  <Slide blockId="context" title="Context">
    <Text>Attackers impersonate payroll and shipping during busy seasons.</Text>
  </Slide>
  <Slide blockId="check" title="Check">
    <TrueFalse checkId="slide-tf" question="A familiar display name guarantees legitimacy." answer={false} />
  </Slide>
</SlideDeck>

Requirements:
- Import only from @lessonkit/react; use block types from block-catalog.v3.json.
- Keep existing courseId, lessonId, and navigation stable unless I ask to add a lesson.
- Mount only inside the documented parent compound (see component page When to use).
Packaging notes:
`Slide` is a [`SlideDeck`](slide-deck.md) child — no manifest row for the slide itself.
- Stable **`blockId`** per slide helps resume and telemetry URNs.
- Nested assessments need matching `course.assessments[]` entries.

- After edits, list changed files and what to verify in the browser (lessonkit dev).

Workflow tips: https://lessonkit.readthedocs.io/en/latest/guides/vibe-coding/prompting-and-workflows.html

Slide is a SlideDeck child — no manifest row for the slide itself.

  • Stable blockId per slide helps resume and telemetry URNs.

  • Nested assessments need matching course.assessments[] entries.

See also