Popular is a free, MIT-licensed Astro theme for meetup and community websites that turns Markdown content and a single config file into a static site with events, a blog, organizer pages, and a docs handbook.
What is Popular?
Popular is a static-site theme built on Astro for meetups, user groups, clubs, and community websites. It consumes Markdown and MDX content for events, speakers, venues, blog posts, organizers, and handbook docs, plus a single TypeScript configuration file, and outputs a fully static site with RSS, sitemap, and OG meta tags. The theme is created by Mariatta, ships as the npm package astro-theme-popular, and is the Astro twin of hugo-theme-popular, sharing the same design tokens, CSS, behavior JavaScript, and content schema.
Key Features
- Composable home page — hero, stats, features, automatic next-event, latest posts, organizers, testimonials, and call-to-action sections, all toggled from
src/config.ts. - Event management — events split into upcoming and past automatically; each event can carry speaker profiles, venue pages with address and accessibility notes, and check-in instructions.
- Multi-author blog — posts support
authorsslugs with profiles insrc/content/authors/, inlineguestAuthorsfor one-off writers, tag filtering, tag pages, RSS, and per-post speaker bios. - Docs with checklists — handbook and runbooks use MDX components
<Callout>and<Checklist>; checklist progress persists per visitor in localStorage. - One-command content imports —
scripts/sessionize-import.pypopulates events and speakers from a Sessionize public API endpoint;scripts/spreadsheet-import.pydoes the same from .xlsx or per-tab CSV spreadsheets; existing files are never overwritten. - Accessibility enforcement — CI builds the site and fails the build if any image lacks alt text.
- Translatable UI — all template strings live in one place (
STRINGSconfig for Astro,i18n/for Hugo), so a site can run in any language. - Re-brand from one file — site name, logo, tagline, colors, fonts, radii, navigation, footer, and socials are set in
src/config.ts; no CSS edits needed for normal rebranding.
Who is it for?
- Meetup and user group organizers — publish events, speaker bios, venue details, and an organizer handbook in one place.
- Community managers for clubs and fan communities — set up a branded site with a blog, team page, and land acknowledgement, all configured from one file.
- Event organizers who import data — use the Sessionize or spreadsheet scripts to populate events and speakers instead of hand-writing Markdown.
- Hugo users evaluating Astro — because the content model and zod schemas are kept 1:1 compatible with hugo-theme-popular, content can move between the two themes freely.
What can you do with Popular?
- Plan and announce a meetup: create an event with venue address, accessibility info, and check-in instructions; it automatically appears under Upcoming and moves to Past after the date.
- Build a community blog: publish posts with multiple authors, tags, and RSS; embed speaker bios directly on posts.
- Maintain an organizer handbook: write docs with a scroll-spy table of contents and checklists whose progress is stored in each visitor's browser.
- Rebrand for a new community: change the site name, logo, colors, and navigation from
src/config.ts— the included demos show four different color schemes (teal, copper, indigo, gold).
How does Popular work?
Start with the scaffolder: npm create popular-site@latest my-community, then npm install and npm run dev to preview at localhost:4321. The scaffolder creates a project that depends on the theme, so updating is npm update astro-theme-popular. For content, either write Markdown in src/content/ or run the import scripts; the front-matter schemas are validated with zod. Deploy the static build from dist/ to Netlify, GitHub Pages, Cloudflare Pages, or any static host, and set site and base in astro.config.mjs for subpath deployments.
Pros and cons
- Free and MIT licensed — use, fork, and redistribute without licensing fees.
- Hugo parity — same design tokens, CSS, and content model as hugo-theme-popular, so the two themes can share content.
- Strong accessibility defaults — CI fails the build if any image has no alt text.
- Consideration: because sites vendor the theme (you copy the repo), updating means re-copying the files you haven't customized; the changelog tells you which areas moved.
Pricing
Popular is free and MIT licensed. The maintainer offers an optional GitHub sponsorship; no premium tiers or paid features are listed.
FAQ
Is Popular free?
Yes, Popular is released under the MIT license, so it is free to use, modify, and distribute. The project also accepts optional GitHub sponsorship from the maintainer.
Do I need to know CSS to rebrand it?
No. Site name, logo, tagline, colors, fonts, navigation, footer, and social links are all configured from src/config.ts. For deeper changes, the theme exposes design tokens in src/styles/tokens/.
Can I import events from Sessionize?
Yes. Run python3 scripts/sessionize-import.py --url <embed-url> --site . to populate events and speakers from a Sessionize public API endpoint. The script never overwrites existing files, so you can edit freely after importing.
Does Popular support serving from a subpath?
Yes. Set site and base in astro.config.mjs, and every link, image, and feed URL picks up the base path automatically. scripts/setup.py can also generate a ready-to-run GitHub Pages workflow.
Is there a Hugo version?
Yes. hugo-theme-popular is the Hugo twin of this theme and shares the same design tokens, CSS, behavior JavaScript, and content model, with releases versioned in lockstep.
