Course Description Builder HTML Template
Compatible with Skilljar's HTML sections in pages, courses, and lessons.
Course Description Widget
Build a course registration page description using one of five proven layouts: a learning objectives checklist, a curriculum overview, a prerequisites-and-audience breakdown, an instructor bio, or an intro-and-highlights grid. Pick a layout, fill in your content, then paste the generated code into your course's Long description html field (Dashboard → Courses → Edit → Title and description).
Layout
Intro + Info Grid + Note
Note
Learning Objectives Checklist
Curriculum Overview
Prerequisites + Audience
Instructor Bio
Colors
Typography
Font Sizes
Container
Section Padding (px)
Section Margin (px)
Content Spacing (px)
Live Preview
✓ Saved
Extend this template with AI Prompts
Use these prompts to extend this HTML template on your own. Paste your generated code + one of these prompts into Claude or ChatGPT, or any other AI model.
Before you paste a prompt: grab the AI context file from Lesson 1 of the AI with Skilljar course and paste it into your AI chat. This will teach it the Skilljar HTML, CSS, and JS rules.
✦
Copy
Add a student testimonial quote
Here is the HTML/CSS for a Skilljar course long description. Add a short pull-quote testimonial from a past learner below the main content, with their name and title. Match the existing color scheme and font. Return the complete updated code.
✦
Copy
Add duration and format badges
Here is the HTML/CSS for a Skilljar course long description. Add two small pill-shaped badges near the top: one showing the course duration (e.g. "2 hours") and one showing the format (e.g. "Self-paced"). Match the existing accent color. Return the complete updated code.
✦
Copy
Add a "Skills you'll gain" tag list
Here is the HTML/CSS for a Skilljar course long description. Add a row of small rounded tag pills labeled "Skills you'll gain" listing 4-6 skills. Match the existing accent and border colors. Return the complete updated code.
✦
Copy
Combine two layouts into one description
Here is the HTML/CSS for a Skilljar course long description using one layout. Here is a second block using a different layout: [paste the second generated code block here]. Combine them into a single description, stacked in this order: [describe order]. Keep both sections' existing styling intact and add reasonable spacing between them. Return the complete combined code.
Live Preview
Paste into: Dashboard → Courses → Edit → Title and description → Long description html
Import generated code
Paste the code from a previous session. The configurator will detect the layout and restore your settings from it.