Freeframe
Health & Fitness9 pages · 2 downloads · Free

Fitness

A bold, dark gym and fitness studio site with a bookable class timetable.

Stack
v1.1.7 changelog

About this template

A complete website for a gym or fitness studio: a high-energy home page, a weekly class timetable with filters and a booking modal, class and coach profile pages, membership plans with a monthly/yearly toggle and a BMI & calorie calculator, a multi-step free-trial sign-up, and locations with live open-now status.

Features

  • Weekly timetable from one data list, with day tabs on mobile and a week grid on desktop
  • Filters by class, intensity and coach, plus spots-left and full/waitlist badges
  • Accessible booking modal; bookings are saved in the browser and shown on the timetable
  • Class and coach pages filled from the URL (class.html?type=box, trainer.html?id=lena)
  • Monthly / yearly pricing toggle, comparison table and add-ons
  • BMI & calorie calculator with metric and imperial units
  • Three-step free-trial form with goal tiles, validation and a review step
  • Live open-now status for each location, today's hours highlighted
  • Next-up-today class strip, count-up stats and a class ticker
  • Athlete pictograms, class covers and coach portraits drawn in SVG

Pages included

Quick start

unzip fitness.zip && cd fitnessopen index.html        # that's it # optional, after adding new Tailwind classes:npm install && npm run build
Read the Fitness documentation →

Changelog

  1. v1.1.7

    Fixed

    • Class bookings now work when the browser blocks localStorage (in a sandboxed iframe, like the freeframe.dev demo, or with strict privacy settings): the state is kept in memory for the page view. Before, "Book my spot" didn't book the class.
  2. v1.1.6

    Fixed

    • Links with ?plan= (free trial) and ?topic= (contact) are matched in any letter case, like ?type=, ?coach= and ?id=: ?plan=Elite preselects Elite and ?topic=PT personal training. Only the form's own options count (?plan=constructor or ?topic=__proto__ still preselect nothing).
  3. v1.1.5

    Fixed

    • Coach page: ?id= is matched case-insensitively like the timetable's ?coach=, so ?id=DEV shows Dev instead of the default coach. Only the coaches' own keys match (constructor, __proto__ and toString still fall back to the default).

    Changed

    • The CSS build no longer reads the documentation and metadata files (*.md, *.json), so words in the guides can no longer add unused rules to assets/css/style.css. No visible change.
  4. v1.1.4

    Fixed

    • Class page: ?type= is matched case-insensitively like on the timetable, so ?type=BOX shows Box & Burn instead of the default class. Only the classes' own keys match (constructor and __proto__ still fall back to the default).
  5. v1.1.3

    Fixed

    • class.html?type= and trainer.html?id= only accept real class and coach ids: ?type=constructor or ?id=__proto__ no longer crash the page and show the default class or coach instead.
    • Unknown ?type= or ?coach= values on classes.html are ignored, so the timetable shows every class instead of "0 classes this week".
  6. v1.1.2

    Added

    • Full documentation in DOCS.md.

    Fixed

    • ?coach= and ?type= links and the coach specialty filter match regardless of case.
    • Open/closed status, today's timetable day, "next up" classes and the earliest trial date use the club's time zone (new TIMEZONE setting) instead of each visitor's device clock.
  7. v1.1.1

    Fixed

    • Class bookings in localStorage are validated: corrupt data no longer breaks the timetable, and unknown sessions are dropped and storage repaired.
    • The current class link on class pages no longer uses aria-pressed (not allowed on links); aria-current marks it instead.
  8. v1.1.0

    Added

    • "Back to top" button on every page. It fades in after you scroll about one screen, returns to the top (instantly for visitors who prefer reduced motion), moves keyboard focus to the main content, lifts itself above toast messages, steps aside while an in-page "Back to top" link is on screen and is hidden when printing. It is styled to match the template.
    • data-back-to-top-avoid (lift the button above an element) and data-back-to-top-hide (hide the button while it would cover a sticky or fixed element) to keep it clear of your own UI.
    • This changelog and a version field in template.json.

    Fixed

    • Social sharing image is now a 1200×630 PNG (assets/img/og-image.png); most social sites don't display SVG. The SVG stays as the editable source.
  9. v1.0.0

    Added

    • Initial release with 9 pages: Home, Timetable, Class detail, Coaches, Coach profile, Membership, Free trial, Locations & contact, 404.
    • Weekly timetable from one data list, with day tabs on mobile and a week grid on desktop
    • Filters by class, intensity and coach, plus spots-left and full/waitlist badges
    • Accessible booking modal; bookings are saved in the browser and shown on the timetable
    • Class and coach pages filled from the URL (class.html?type=box, trainer.html?id=lena)
    • Monthly / yearly pricing toggle, comparison table and add-ons
    • BMI & calorie calculator with metric and imperial units
    • Three-step free-trial form with goal tiles, validation and a review step
    • Live open-now status for each location, today's hours highlighted
    • Next-up-today class strip, count-up stats and a class ticker
    • Athlete pictograms, class covers and coach portraits drawn in SVG

More templates

Bloom website template preview

Bloom

Health & Fitness

A calm, elegant website for a hair salon and day spa, with online booking and gift cards.

HTML + TailwindNext.jsAstroWordPress

9 pages · 154 KB

Documentation
Fade website template preview

Fade

Health & Fitness

A bold, vintage-modern barbershop website with live wait times, online booking, a product shop and gift cards.

HTML + TailwindNext.jsAstroWordPress

9 pages · 161 KB

Documentation