Rivet Cycles. Free cycle shop and workshop HTML & Astro template

About Rivet Cycles

Rivet uses a graphite retail masthead, two clear Bikes and Workshop routes, white pages and rust accents. Riding and independent-shop photography sit beside original bicycle drawings, legible specifications and service comparison tables. Inner pages focus on useful information: complete City 01 and Everyday Service profiles, a choosing guide and workshop conversation questions.

Best suited to: Independent cycle shops and workshops presenting accurate bike ranges, service scopes and practical customer enquiry information.

Desktop and mobile screenshots

Captured from version 1.0.0 on 30 October 2026. Open a screenshot to inspect the full page.

Choose your download

Both ZIPs contain the same 10-page design. Confirm your email to download. Newsletter emails are optional; no account or license key is needed.

What’s in the design

• Ten complete pages cover Home, Our Shop, Bikes, City 01, Workshop, Everyday Service, Choosing a Bike, Visit & Questions, Contact & Workshop Enquiry and 404.
• The catalogue combines category and frame-material filters with AND logic, count, reset and empty state across six original fictional bike records. All bikes remain visible without JavaScript.
• City 01 has a complete illustrative specification, equipment and intended-use notes, sample GBP price, clear limitations and useful purchase questions.
• Workshop scopes compare three fictional services, exclusions and sample pricing, with routine/assessment filtering. Everyday Service has its own full service record and discussion process.
• The native photo viewer supports previous/next, arrow keys, Escape and focus return. Workshop pages offer printable drop-off communication questions without repair instructions.
• Known bike, service and visit topics preselect explicit email drafts. Native validation and stale-draft clearing support a review step without sending, booking or reserving anything.

Verified page layouts

These 10 pages are included in both archives. Each link opens the live preview.

• Home ↗index.html
• Our Shop ↗shop.html
• Bikes ↗bikes.html
• City 01 ↗city-01.html
• Workshop ↗workshop.html
• Everyday Service ↗everyday-service.html
• Choosing a Bike ↗choosing.html
• Visit & Questions ↗visit.html
• Contact & Workshop Enquiry ↗contact.html
• Page Not Found ↗404.html

How Rivet enquiries work

The contact form validates a name, email and question, then prepares an encoded mailto review link. It does not send a message, reserve a bike, book workshop time, accept work or take payment. Replace [email protected] with a monitored address.

Known topic query values preselect existing options; unknown values are ignored. Editing any field hides the previous draft. Submit is initially hidden and disabled until its handler is installed; direct email links and no-script guidance remain available.

Set up the Astro edition

Extract the source ZIP and run these commands from its folder:

npm ci
npm run dev
npm run check
npm run build

The build produces a dist/ folder for static hosting. The source includes its shared template kit under vendor/template-kit, so it builds independently of our development workspace. Astro 7.4.4 and the Astro checker 0.9.12 are pinned; TypeScript 6.0.3 is the latest supported by that checker’s declared peer range.

Before you launch

• Choose HTML for direct file editing, or Astro for shared layouts and source-driven content.
• Replace fictional bike records, drawings, specifications, sample prices, service scopes and visit details with accurate authorised information. Confirm actual product terms, equipment, availability and workshop arrangements directly. Retain media and font notices.
• Edit bike/service/topic records in src/site.ts; keep filter data, topic values and full profile copy aligned. Test combined filters including Mixed surface + Aluminium empty state, reset/count, service filtering, gallery keys/focus, print output, query allowlists, native validation and stale-draft clearing.
• Replace imagery with licensed content. Keep responsive variants, intrinsic dimensions, alt text and ASSETS.md credits aligned.
• Set PUBLIC_SITE_URL to the real domain/folder URL with a trailing slash for canonical/social metadata, robots.txt and a 9-page sitemap. Leave PUBLIC_PREVIEW unset for production.
• Upload the entire HTML folder or Astro dist/. Configure unknown paths to return 404.html with HTTP 404. Test enquiries or configure a separately tested delivery route if direct sending is required.

No cart, checkout, payments, financing, live stock, workshop appointments, service acceptance, guaranteed pricing/timing, real ride routes or message-delivery backend. No fit prescription, repair guidance, diagnosis or safety assessment.

License and assets

The original template code is released under the included MIT license. It permits personal and commercial use; retain the license notice when redistributing the code. Visible footer attribution is optional.

Representative photographs by Blue Bird, Alexander Dummer and Fatma Öner retain the Pexels License. Original bike drawings, identity, writing and code are MIT. Rivet Sans is an internally renamed Inter WOFF2 derivative with the complete SIL OFL notice. Pexels License. Full asset credits.

Release verification

The page inventory, screenshots and download manifests document the included layouts and assets. The HTML and independent Astro editions contain the same design and license notices. Customization requires its own accessibility, content and performance checks.

Version 1.0.0, reviewed 30 October 2026. Live preview. Plain HTML checksum. Standalone Astro source checksum. Rivet, its six bikes, specifications, prices, services, address and hours are fictional illustrative concepts. Photographs depict separate people and locations, not Rivet products, premises or staff; no manufacturer relationship or endorsement is claimed.