Freeframe
Business10 pages · 2 downloads · Free

Handy

A high-trust home services site with an instant quote calculator and service-area checker.

Stack
v1.0.2 changelog
DocsLive demo Download .zip145 KB

About this template

A complete website for a plumbing, electrical and renovation company: a 24/7 emergency call bar, a ZIP code service-area checker with a coverage map, transparent price tables, an instant quote calculator that turns into a booking request, a before/after slider, a filterable project gallery with lightbox and a reviews page with rating breakdown.

Features

  • Instant quote calculator with a live price range, saved between visits and validated on load
  • Booking request form with arrival windows, future-only dates and inline validation
  • ZIP code service-area checker that highlights the matching area on an SVG coverage map
  • Before/after comparison slider that works with mouse, touch and arrow keys
  • Filterable project gallery with an accessible lightbox (arrow keys, Esc, focus return)
  • Reviews page with rating breakdown, service and star filters and sorting
  • 24/7 emergency bar and a sticky mobile call bar the back-to-top button steps above
  • Transparent price tables for every service and a FAQ accordion
  • Accessible mobile menu, scroll reveals that respect reduced motion and a back-to-top button
  • SEO and Open Graph tags, SVG favicon and a PNG social image on every page

Pages included

Quick start

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

Changelog

  1. v1.0.2

    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.

  2. v1.0.1

    Added

    • Full documentation in DOCS.md.

    Fixed

    • The estimate no longer depends on the order options are ticked in: fixed add-ons are added first, then percentage multipliers apply to the whole total, in a fixed order. HTML and Next.js give identical estimates.
    • Breakdown lines are built from the price data (the emergency line was always "+50%" and the next-day line showed only the low amount).
    • The estimate shown before the script runs now matches the default calculation ($120 – $420).

  3. v1.0.0

    Added

    • Ten pages: home, services and prices, a water heater service page, instant quote, service areas, projects, reviews, about, contact and a 404 page.
    • Instant quote calculator with a live price range and breakdown, remembered in localStorage (validated on load), feeding a booking request form with arrival windows and inline validation.
    • ZIP code service-area checker on the home and areas pages; the areas page highlights the match on an SVG coverage map.
    • Before/after comparison slider, project gallery with category filters and an accessible lightbox, and a reviews page with rating breakdown, filters and sorting.
    • 24/7 emergency bar, sticky mobile call bar, accessible mobile menu, scroll reveals that respect reduced motion, and a back-to-top button that lifts above the mobile call bar.
    • SEO and Open Graph tags, SVG favicon, and a PNG social image (SVG source included).

More templates