CNB Decks — custom decks & fences, Toronto

Project overview

CNB Decks builds custom decks, fences, pergolas and railings across Toronto and the GTA — composite, cedar, PVC and pressure-treated. The business needed one thing from its website: turn a visitor into a free-estimate request or a phone call, on a phone, in under a minute.

So the site is a single page with one job. A dark, high-contrast layout in the brand’s black-and-red, a hero that puts the estimate form next to the headline instead of three screens below, nine numbered services, a before/after block, a project gallery, two client testimonials and a red call band — every section ends in the same two actions: request an estimate or call 437-217-5519.

My role in the project

I personally worked on this project from the design brief to the live site. The areas I owned and delivered directly:

• Page structure and conversion logic: hero with the estimate form, trust badges (Licensed · WSIB · $5M liability), services, projects, why-us, reviews, call band, contact
• Custom WordPress theme built from the approved design — no page builder, no bloat
• ACF Pro fields for every text, photo, gallery item, review and phone number, so the owner edits the site without touching code
• Contact Form 7 form styled to the design, with a thank-you page redirect so requests count as conversions in Google Ads and GA4
• Analytics events layer: phone clicks by location (header, hero, call band, footer, floating button), form submits, form errors, thank-you views
• Mobile layout: sticky header, floating call button, form under the buttons on phones

What I built

• Hero with the headline, four trust badges and a white estimate card (name, phone, email, project details) — on mobile the card drops under the buttons
• Services block with nine numbered cards: composite, pressure-treated, PVC and cedar decks, pergolas, privacy screens, fences, railings, deck repairs
• “Projects” section with a before/after pair and a photo gallery whose captions come straight from the media-library caption field
• “Why us” list, two verified testimonials, a red full-width call band
• Contact section with the phone, a checklist of what the estimate includes and the same form
• Theme settings page: phone number (auto-formatted into every tel: link), logo, menu, badge line, copyright, floating-button toggle, thank-you redirect, GA4 / GTM ID
• Auto-setup on first login: the theme creates the landing page, the thank-you page and the CF7 form filled with the approved copy — the site looks finished the moment the theme is activated

The whole thing runs on a lean custom theme with self-hosted assets, Anton and Archivo for the typography, and a debug mode (?cnbdebug=1) that prints every analytics event to the console so the owner can verify tracking without a developer.