/ 04
Page Reference
All 16 pages, one by one — what each one is for and where it links.
Every page below is a separate, complete .html file in the fieldcraft-html/ folder
— open any of them directly, or navigate between them using the site's own menu once you're
previewing index.html. Copy is written for the Ironhouse Mechanical Co. demo brand;
replace it with your own business's details as you edit each file (see
Customizing → Editing copy).
index.html — Home
The main landing page: hero, trust strip, trade/service rows, company manifesto, stats, an emergency-call band, the job-process steps, a job-files preview grid, reviews, the team, and a blog teaser. This is the page most of the others link back to.
about.html — About
The company story, a timeline, and the crew/team profiles. Use this as your "who we are" page.
services.html — Trades
An overview of every trade/service offered, listed as numbered rows. Links out to
service-single.html for the detail page of each individual trade.
service-single.html — Single trade detail
The detail page for one specific trade (heating, in the demo copy). Duplicate this file and adjust its copy/images if you need a separate detail page per trade you offer — it isn't wired to a data file, so each trade's page is its own copy of this file with different content.
service-areas.html — Service Areas
The towns/regions served, with a wide feature band. Use this to list your own service radius or coverage area.
gallery.html — Job Files
A before/after-style photo gallery of completed jobs, presented as numbered "job files."
reviews.html — Reviews
A wall of customer reviews/testimonials.
contact.html — Contact
A contact page with a quote-request form and a map-placeholder frame.
This is a static HTML template — there's no server-side code to process form submissions.
The form markup and its client-side success-state UI (in main.js) are in place, but
you need to wire the <form> up to a form-handling service (Formspree, Netlify
Forms, Basin, your own backend, or similar) by setting its action attribute, or add
your own server-side handler, before it will actually deliver a message. See
FAQ → Does the contact form send me an email
automatically?
blog-index.html — Notes from the Truck (blog index)
A listing of blog posts/articles. Links out to blog-single.html for the full post.
blog-single.html — Single blog post
The full layout for one blog article. Duplicate this file for each additional post you want to
publish — like service-single.html, there's no data file driving this; each post
is its own copy of the file with different content.
faq.html — FAQ
A list of frequently asked questions in an accordion layout (powered by main.js,
degrades to always-visible content if JavaScript is disabled).
pricing.html — Pricing
A flat-rate pricing table.
coming-soon.html — Maintenance / Coming Soon
A standalone "site under construction" page, useful as a temporary placeholder while you finish customizing the rest of the site, or point your web host's maintenance mode at this file.
privacy.html — Privacy Policy
A placeholder privacy policy page. Replace the demo copy with your own legally reviewed policy before launching a real site — the shipped text is placeholder copy, not legal advice.
terms.html — Terms of Use
A placeholder terms-of-use page. Same note as Privacy Policy above: replace with your own reviewed terms before launch.
404.html — Not Found
The template's 404/error page. Most static hosts let you configure this as the custom "not found" page for the whole site (check your host's documentation for exactly how — the setting is usually called something like "custom 404 page" or "error page").