Urban is a legacy Gatsby template from CloudCannon designed for web agency marketing sites, with pre-built pages, a staff collection, Disqus-enabled posts, and a contact form.
What is Urban?
Urban is a legacy Gatsby template for web agencies, built by CloudCannon as part of its open-source template collection. It uses Gatsby version 11.1.2 and is optimized for editing in CloudCannon's CMS, but it can also be developed locally with npm. The template produces a static agency website with a contact form, staff profiles, a blog with Disqus comments, and configurable footer content.
Key Features
- FrontMatter live editing — Edit page content and settings directly in CloudCannon using FrontMatter fields, with no code changes needed.
- Contact form — A form preconfigured to work with CloudCannon, easily switched to a different provider such as FormSpree.
- Pre-built pages — Ready-made page structures for home, blog, staff, and other agency sections.
- Staff system — Staff members are defined once in a collection and reused across the site, avoiding duplication.
- Disqus comments — Posts support Disqus commenting by adding a Disqus key to
data/site.json. - Configurable footer — Footer content is exposed as a data file, making client edits simple.
- SEO tags — Manage SEO metadata like site name and author in
data/seo.json. - Google Analytics — Add your Google Analytics key to
data/site.jsonto enable tracking.
Who is it for?
Web agencies that want a functional Gatsby starter with a blog, staff showcase, and contact form, and that plan to host on CloudCannon for easy editing. Developers who need a clear Gatsby example using JSON data files and Markdown collections. Non-technical site owners who will use CloudCannon's CMS to update content without touching code.
What can you do with Urban?
- Agencies — Launch a marketing site with a contact form and staff directory, using the template's pre-built pages as a starting point.
- Developers — Use Urban as a Gatsby learning reference or as a base to build on, since it demonstrates data-driven content with JSON and Markdown.
- Content editors — Edit posts, staff, footer, and company details in CloudCannon through the FrontMatter interface.
How does Urban work?
Urban uses Gatsby's static generation. To start, run npm install then npm run develop for local development. For production, run npm run build. Site-wide configuration (SEO, Google Analytics, Disqus) lives in data/seo.json and data/site.json, while posts and staff are stored as Markdown files in the content collections.
FAQ
Is Urban still maintained?
No. The template is marked as legacy and no longer maintained. It remains available for use, but CloudCannon no longer provides updates or official support for it.
What framework does Urban use?
Urban is built with Gatsby version 11.1.2. According to the template docs, it should support newer Gatsby versions as well.
Can I use a different form provider?
Yes. The contact form is preconfigured for CloudCannon, but the docs say it's easily changed to other providers like FormSpree.
How do I set up Urban?
After cloning the repository, run npm install and npm run develop to start a local development server. For a production build, use npm run build. You can also deploy directly to CloudCannon using the provided deploy button.
Does Urban include SEO and analytics?
Yes. SEO tags are managed through data/seo.json, and Google Analytics can be enabled by adding your key to data/site.json.
