Course

Author: Colorlib

Updated: October 2026 · v3.0.0

Credits: Images from Unsplash

Course is an education website template for schools, colleges, universities and online course providers, built on Bootstrap 5 with an amber and dark design. The layout is responsive and works in all popular web browsers. It comes with seven pages: home, courses, teachers, news, a single news post, elements and contact.

The home page has a library hero slider with three feature boxes, popular course cards with author and price, a register panel next to a course search, six services, a testimonial slider, upcoming events and a newsletter signup. The inner pages add a catalogue of nine courses, teacher profiles with campus milestones and a “Become a teacher” section, a news list and post with comments and a sidebar, interface elements such as progress bars, accordions and counters, and a contact page with a form and a map. Course gives you a ready-made site for a school or a course platform.

What’s new in 3.0

• Bootstrap 5.3.8 (the earlier release used a Bootstrap 4 beta and jQuery), compiled from Sass with the Bootstrap 4 proportions the design was drawn with, and plain JavaScript with no jQuery. Swiper 14 runs the hero and testimonial sliders, and small built-in modules replace the GSAP animation library, ScrollMagic and ProgressBar.js for the parallax headers, counters, progress bars and circles. Icons are Lucide SVG. npm run build (Dart Sass and esbuild) compiles one minified stylesheet per page and one script.
• Lighter pages: the seven pages went from 9.9 MB and 282 requests to 3.3 MB and 127 requests, and the home page from 2.2 MB to 0.9 MB. Every photo has an AVIF version with the JPEG as the fallback, real dimensions and lazy loading below the first screen, and each page preloads its header photo.
• No third-party requests: Open Sans and Roboto are self-hosted, the icon font is replaced by Lucide icons and a 1 KB social-logo subset, the contact map is an OpenStreetMap map (no API key needed) that loads only when a visitor clicks “Show map”, and a Google Analytics 4 snippet stays commented out until you add your own ID.
• Working forms: the contact form, the comment form and the newsletter signup send through php/send-email.php with validation, a spam trap and an in-page message, and the course search opens the courses page. Before, the forms posted to a page that did not exist and the contact button did not submit.
• Accessibility: a skip link and a main landmark on every page, one h1 per page, real buttons for the menu and the slider arrows, a menu that closes with Esc and returns focus, keyboard accordions, labelled form fields, alt text, visible focus rings, reduced-motion support and WCAG AA text contrast, with dark labels on the amber buttons and boxes.
• Demo content and links: every menu and footer link leads to a page or section, the teachers have their own names and subjects, the contact details are fictional, new photos replace a few that showed products, and typos are fixed.