MarkTheWords¶
H5P equivalent
H5P Mark the Words — learners click words or phrases in a sentence that match a target set.
When to use¶
Use MarkTheWords when learners must identify specific terms in running text — spotting risky language in email copy, policy violations, or keywords in a procedure.
Provide correctWords as an array of strings that must be selected. The demo uses a single sentence; longer passages work the same way.
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.
<MarkTheWords
checkId="policy-mtw"
text="Never share your password, MFA codes, or one-time recovery links with colleagues or vendors."
correctWords={["password", "MFA", "recovery"]}
/>
Copy into Cursor, Copilot, or ChatGPT after the vibe coding starter context:
Read lessonkit.json and src/App.tsx before editing.
Add a MarkTheWords block (H5P-style: Mark the Words) like this example inside the active <Lesson>:
<MarkTheWords
checkId="policy-mtw"
text="Never share your password, MFA codes, or one-time recovery links with colleagues or vendors."
correctWords={["password", "MFA", "recovery"]}
/>
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.
Sync lessonkit.json — add under course.assessments[]:
{
"checkId": "policy-mtw",
"kind": "markTheWords",
"question": "Never share your password or MFA codes with colleagues.",
"correctWords": ["password", "MFA"]
}
- 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
Add under course.assessments[]:
{
"checkId": "policy-mtw",
"kind": "markTheWords",
"question": "Never share your password or MFA codes with colleagues.",
"correctWords": ["password", "MFA"]
}