Freeframe
Community9 pages · 2 downloads · Free

Nonprofit

A warm, trustworthy website for a charity, with a working donate page.

Stack
v1.1.5 changelog

About this template

Nonprofit is a complete charity website for Clearwater Trust, a fictional clean-water organisation. It tells the story with impact counters, a live campaign progress bar and long-form field stories, shows exactly where money goes with a spending chart, and includes volunteer, events and a full donation flow with one-time and monthly giving, impact messages for every amount and a cover-the-fees option.

Features

  • Donate page with one-time/monthly toggle, preset and custom amounts
  • Live impact message for every amount, plus cover-the-fees total
  • Gift dedication (in honour or memory) and validated demo checkout
  • Animated impact counters and appeal progress bar
  • Programs filter with a dot-matrix world map that highlights regions
  • SVG donut chart showing where every dollar goes
  • Volunteer roles that preselect the application form
  • Event list with RSVP buttons and a guest-count stepper
  • Long-form story page with pull quote, figure and copy-link sharing
  • Accessible mobile menu, skip link and reduced-motion-aware reveals

Pages included

Quick start

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

Changelog

  1. v1.1.5

    Fixed

    • Programs map: one of the background dots near the top of the map was drawn twice, so it had a darker edge. It is now drawn once.
    • Donate: after a submit with a custom amount under $5, typing a valid amount kept showing "The minimum gift is $5.". The minimum is now checked again as you type.
  2. v1.1.4

    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.
  3. v1.1.3

    Fixed

    • On the story page the header's Stories link (desktop and mobile menu) is marked aria-current="true", the current section, instead of aria-current="page": it links to the stories list, not to the page being read. It keeps the same highlight.
  4. v1.1.2

    Added

    • Full documentation in DOCS.md.

    Fixed

    • The "send for real" comment in the form script now shows a working Formspree example.
    • The matched-giving note on donate.html only shows for known appeals (MATCHED_APPEALS), not for any ?appeal= value.
    • The appeal's raised amount, goal and progress-bar value are all filled in from data-raised/data-goal, so they can't disagree.
  5. v1.1.1

    Fixed

    • Raised low-contrast text to meet WCAG AA (axe colour-contrast checks now pass in light and dark).
  6. 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.
  7. v1.0.0

    Added

    • Initial release with 9 pages: Home, About & finances, Programs, Stories, Story, Get involved, Events, Donate, 404.
    • Donate page with one-time/monthly toggle, preset and custom amounts
    • Live impact message for every amount, plus cover-the-fees total
    • Gift dedication (in honour or memory) and validated demo checkout
    • Animated impact counters and appeal progress bar
    • Programs filter with a dot-matrix world map that highlights regions
    • SVG donut chart showing where every dollar goes
    • Volunteer roles that preselect the application form
    • Event list with RSVP buttons and a guest-count stepper
    • Long-form story page with pull quote, figure and copy-link sharing
    • Accessible mobile menu, skip link and reduced-motion-aware reveals

More templates

Gather website template preview

Gather

Community

A warm, modern church website with a live service countdown, sermon player, events calendar and visit planner.

HTML + TailwindNext.jsAstroWordPress

10 pages · 191 KB

Documentation