Encore
Encore is a free two-page website template for dance studios and dance schools, built on self-hosted Bootstrap 5 with 100% vanilla JavaScript and no jQuery. It covers a landing page and a dedicated weekly schedule plus booking page, with real niche content across dance styles, timetable, pricing, instructors, recitals, gallery and trial forms. The design uses a deep aubergine base, a hot-coral accent and the Fraunces/Manrope type pairing, with progressive enhancement so all content stays visible when JavaScript is off.
Key features
- Two pages: full landing page plus a dedicated schedule and booking page
- Weekly timetable with vanilla day-tabs (home) and a style/level filter grid (schedule)
- Four-tier pricing with a highlighted popular plan and a monthly/term toggle
- Dance-styles grid with age and level chips over duotone imagery
- Validated free-trial and booking forms, plus a newsletter signup
- Keyboard-accessible gallery lightbox and an auto-rotating testimonials slider
- Instructors row, studio/facilities section and a dated recitals band
- 100% vanilla JavaScript, self-hosted Bootstrap 5, no jQuery or plugins
- Progressive enhancement, count-up stats, IntersectionObserver reveals and reduced-motion support
Best for
- Dance studios and dance schools
- Ballet, hip-hop, contemporary, jazz and tap academies
- Kids' and youth movement programs
- Performing-arts and recital-focused studios
- Fitness and movement instructors needing a class schedule site
At a glance
- Framework: Bootstrap 5 (self-hosted, no CDN)
- JavaScript: 100% vanilla, no jQuery, no plugins
- Pages: index.html, schedule.html
- Fonts: Fraunces (display) + Manrope (body) via Google Fonts
- Palette: ink-plum / deep aubergine base, hot-coral accent, warm cream neutrals, gold highlight
- License: Free for personal and commercial use
- Images: 29 local placeholders referenced by path (sourced separately)
How to use it
Download the ZIP, unzip it, and open index.html — no build step, nothing to install. Edit the text and images, point any forms at your backend or a form service, and deploy the folder to any static host. Colours and fonts live in css/style.css; the interactions are in js/main.js.
Frequently asked questions
Is Encore free to use for commercial dance-studio websites?
Yes. Encore is free for both personal and commercial projects, so you can use it for a real studio or school website. Attribution is appreciated under the standard uiCookies license terms. What you download is the complete template with no locked or paid tier.
How many pages does Encore include?
Encore ships with two pages. The home page (index.html) carries the hero, dance-styles grid, a tabbed weekly schedule preview, pricing, instructors, the studio section, recitals, gallery, a free-trial form, testimonials, location and newsletter. The second page (schedule.html) is a dedicated full weekly timetable with style and level filtering, class notes and a booking form.
Does the class schedule actually filter and switch days?
Yes, and it's all hand-written vanilla JavaScript. The home page uses accessible day-tabs with full keyboard support to switch between Monday and Saturday. The schedule page adds a filter grid where you can narrow classes by style and by level at the same time, with empty-state handling and day headings that hide when nothing matches. With JavaScript disabled, every class in the timetable stays visible.
Do the booking and trial forms send real emails?
No. Encore is a static front-end template, so the free-trial and booking forms are fully marked up and validated in the browser but have no backend attached. To make them send, connect each form to a form-handling service or your own server-side script. The validation, error messages and success states all work out of the box.
How do I change the colours and fonts?
The palette is defined as CSS custom properties at the top of css/style.css, so you can recolour the whole template by editing a handful of variables like –plum, –coral and –cream. Fonts are loaded from Google Fonts in each page head and mapped to the –font-display and –font-body variables. Swap those two lines and the two variables to re-brand the type.
Is Encore responsive and accessible?
Yes. It's mobile-first and built on the Bootstrap 5 grid, with a collapsing mobile navigation, a stacking timetable and a responsive gallery. Accessibility is baked in with semantic landmarks, alt text on every image, ARIA on the custom tabs, slider and lightbox, visible focus styles and full keyboard support. Animations honour the visitor's reduced-motion preference.
Does Encore use jQuery or any third-party plugins?
No. Encore is completely jQuery-free and uses no plugin libraries. The day-tabs, schedule filter, pricing toggle, testimonials slider, gallery lightbox, count-up stats, marquee and form validation are all plain vanilla JavaScript, organised one function per feature with guard clauses. Bootstrap's own bundle is self-hosted for the navbar collapse and nothing loads from a CDN.
What's included in the download and what should I replace before launch?
You get both HTML pages, the custom css/style.css design layer, the vanilla js/main.js, and self-hosted copies of Bootstrap's CSS and JavaScript bundle. The template references 29 local placeholder images by path — studio, class, instructor and gallery photos — which you should replace with your own optimised images. Update the studio name, address, class times, prices and instructor details to match your real studio before going live.
