What is the HTML PPT Course Module?

It is a structured onboarding module designed for new hires in the hospitality industry, focusing on essential training and manager follow-up.

How do I create a training deck using this module?

Start by reviewing the master skill documentation, then copy the necessary template files and assets into your project to create a customized training presentation.

Can I customize the content of the training module?

Yes, you can replace demo content while maintaining the structural classes to ensure the presentation functions correctly.

What are the prerequisites for using this skill?

Users should be familiar with the HTML PPT framework and follow the authoring rules outlined in the master skill documentation.

Is this module suitable for other industries?

This module is specifically designed for the hospitality sector and may not be applicable for onboarding in other industries.

HTML PPT Course Module

Name: HTML PPT Course Module
Availability: InStock
Author: nexu-io

Free

Streamlined onboarding for new hospitality hires.

by nexu-io84.9k stars on nexu-io/open-design

1 views

Updated Aug 10, 2026

Get this skill

Free · Opens the source repo

What HTML PPT Course Module does

The HTML PPT Course Module is designed specifically for onboarding new hires in the hospitality industry. This skill provides a structured approach to training, focusing on essential behaviors, practices, and follow-up checks for managers. By utilizing this module, organizations can ensure that new employees receive a consistent and comprehensive introduction to their roles, which is crucial for their success and integration into the team.

This module serves as a decision-grade professional training deck, allowing managers to present information in a clear and engaging format. The course module is built using the HTML PPT framework, offering a visually appealing and interactive experience for users. The provided templates and guidelines make it easy for trainers to create customized content that aligns with their organization's specific needs while adhering to best practices for effective learning.

To create a training deck, users should begin by reviewing the master skill documentation to understand the authoring rules and guidelines. The process involves copying the appropriate template files and ensuring that all necessary assets are included to enable full functionality. This skill emphasizes the importance of maintaining structural integrity in the presentation, ensuring that the training material is both informative and engaging.

Overall, the HTML PPT Course Module is ideal for organizations looking to enhance their onboarding processes. It provides a solid foundation for creating effective training materials that can be tailored to various hospitality roles, ensuring that new hires are well-prepared to meet the demands of their positions.

When to use it

Use this module when developing onboarding presentations for new hires in the hospitality sector, ensuring they receive comprehensive training.

When not to use it

This skill is not suitable for industries outside of hospitality or for training that requires highly specialized content not covered by the templates.

What you can build with it

Onboarding New Waitstaff

Utilize the course module to train new waitstaff on essential service behaviors and customer interaction.

Manager Training Sessions

Equip managers with a structured presentation to guide them through the onboarding process of new employees.

Employee Performance Reviews

Use the module as a reference during performance reviews to discuss training outcomes and areas for improvement.

How to install HTML PPT Course Module

View source

1. Install with the skills CLI

npx skills add nexu-io/open-design/html-ppt-course-module --agent claude-code

2. Or install it manually

Download the skill folder and drop it into ~/.claude/skills/ for all projects, or .claude/skills/ to scope it to one repo. Restart Claude Code so it picks up the new skill.

Anthropic's agentic coding CLI, and the reference implementation of Agent Skills. Drop a skill folder into ~/.claude/skills and Claude Code loads it automatically whenever a task matches the skill's description. Claude Code docs

Inside SKILL.md

Written by nexu-io

HTML PPT · Course Module

A focused entry point into the html-ppt master skill that lands the user directly on the course-module full-deck template.

When this card is picked

The Examples gallery wires "Use this prompt" to the example_prompt above. When you accept that prompt, this card is the right pick if the user wants exactly the visual identity of course-module (see the upstream full-decks catalog for screenshots and rationale).

How to author the deck

Read the master skill first. All authoring rules live in design-templates/html-ppt/SKILL.md — content/audience checklist, token rules, layout reuse, presenter mode, the keyboard runtime, and the "never put presenter-only text on the slide" rule.
Start from the matching template folder: design-templates/html-ppt/templates/full-decks/course-module/ — copy index.html and style.css into the project, keep the .tpl-course-module body class.
Bring the shared runtime with the template. The upstream index.html links the shared CSS/JS via ../../../assets/... because it sits three folders deep inside design-templates/html-ppt/templates/full-decks/. Once you copy index.html into the project, those parent-relative URLs no longer resolve and base.css, animations.css, and runtime.js will 404 — meaning the deck never activates and slide navigation is dead. Pick one of these two recipes per project:
- Recipe A — copy + rewrite (preferred): copy design-templates/html-ppt/assets/fonts.css, design-templates/html-ppt/assets/base.css, design-templates/html-ppt/assets/animations/animations.css, and design-templates/html-ppt/assets/runtime.js into a project-local assets/ (with assets/animations/animations.css), then rewrite the four <link>/<script> tags in index.html from ../../../assets/... to the matching project-local paths (assets/fonts.css, assets/base.css, assets/animations/animations.css, assets/runtime.js).
- Recipe B — inline: read the same four files and replace each <link rel="stylesheet" href="../../../assets/..."> with a <style>...</style> containing the file's contents, and the <script src="../../../assets/runtime.js"> with a <script>...</script> containing runtime.js. Yields a single self-contained index.html. Either way, do not ship the upstream ../../../assets/... URLs verbatim into a project artifact — they only work in-tree.
Pick a theme. Default tokens look fine; if the user wants a different feel, swap in any of the 36 themes from design-templates/html-ppt/assets/themes/*.css via <link id="theme-link"> and let T cycle.
Replace demo content, not classes. The .tpl-course-module scoped CSS only recognises the structural classes shipped in the template — keep them.
Speaker notes go inside <aside class="notes"> or <div class="notes"> — never as visible text on the slide.

Attribution

Visual system, layouts, themes and the runtime keyboard model come from the upstream MIT-licensed lewislulu/html-ppt-skill. The LICENSE file ships at design-templates/html-ppt/LICENSE; please keep it in place when redistributing.

Frequently asked questions about HTML PPT Course Module

Similar skills

Job Post Builder

Streamline your hiring process with complete job packets.

Feedback Mastery

Navigate difficult conversations with structured frameworks.

Difficult Conversations

Navigate challenging workplace discussions with confidence.

Performance Review

Streamline your performance review process with structured templates.

CHRO Advisor

Streamline your people strategy for scalable growth.

Internal Comms

Streamline internal change communication with structured templates.