Skip to main content
Homepage
Back to Work

Case Study

Solar Quote Calculator

A snappy, custom-built solar estimator plugin designed to help our client capture better leads without the bloat.

Project Type
WordPress Plugin Development
Platform
WordPress
Business Impact
34% increase in lead conversion
Project Duration
2 Weeks
Hero image for the Solar Quote Calculator
01

Project Brief

We designed and built this custom WordPress plugin for a client who was tired of boring, static lead forms that bore prospective customers.

Our goal was simple: create an interactive, step-by-step calculator that gives visitors instant estimates while giving our client total control over their rates, hardware costs, and form messaging behind the scenes.

02

The Challenge

Most off-the-shelf calculator plugins are heavy, ugly, and hard to customize. The main challenge was building an ultra-fast calculation engine that updates in real time as users click through the options, without slowing down the site.

We also needed to make sure our client could easily change their pricing rules-like roof pitch surcharges, battery add-on costs, and custom CTA links-right from their WordPress dashboard without ever having to touch a line of code.

Finally, we wanted to make sure the plugin was easy to drop into any page or post using a simple shortcode, so it could be used across multiple campaigns without extra setup.

03

Functionality

Straightforward Pricing Controls

An easy backend panel where our client can update energy rates, base panel costs, system sizes, and export tariffs anytime.

Interactive 4-Step Funnel

Takes users smoothly through property types, monthly bill amounts, roof styles, sun exposure, battery choices, and postcodes.

Automatic Roof & Hardware Pricing

Calculates extra costs for complex roof types like slate on the fly, while automatically factoring in shade optimizers when needed.

Battery Add-On Options

Lets homeowners easily toggle 5 kWh or 10 kWh storage packages to see how it changes their overall quote and energy savings.

Instant Savings & Lead Capture

Collects and validates visitor contact info before showing a detailed breakdown of system size (kWp), recommended panels, payback timelines, and 25-year savings.

Email Notifications & Lead Management

Sends a copy of the lead form to the client's email and stores it in the WordPress database for easy access and follow-up.

Showcase

A closer look

Property & Bill Selector

The opening step of the funnel where users pick their home layout and use an interactive slider to dial in their average monthly power bill.

Roof & Location Details

Here visitors pick their roof material, sun coverage, and postcode so the calculator can automatically adjust for mounting complexity and regional sunlight.

Battery Upgrades

A quick add-on step letting users pair battery storage units with their setup and immediately see how it impacts their overall estimate.

Lead Capture Form

A clean lead form that collects and validates the customer’s name, email, and phone number before revealing their final breakdown.

Instant Quote & Financial Summary

The final results screen gives visitors a clear snapshot of their recommended setup, total estimated cost, payback period, 25-year net savings, and call-to-action buttons.

Admin Settings - Calculation Defaults

The backend settings screen where the client can quickly set energy prices, installation costs per kWp, and system size limits.

Admin Settings - Roofing & Hardware Multipliers

An easy admin screen for setting price adjustments on tricky roof types and defining extra hardware costs for shaded setups.

Admin Settings - Batteries & Tariffs

Controls for managing battery pricing options, smart export tariffs, and self-consumption estimates.

Admin Settings - Form UI & CTA Redirects

A simple dashboard area where the site owner can change front-end text, field labels, button copy, and link redirects without coding.

Admin Settings - Shortcode & Snippets

A handy reference tab providing the shortcode and copy-paste PHP snippets for integrating the estimator straight into custom theme templates.

04

Architecture

We built this plugin from scratch without bloated third-party libraries. The calculation logic runs entirely in the user's browser using clean JavaScript, meaning zero lag and no page reloads as they tweak their setup.

On the backend, lightweight PHP handles the settings panel, shortcode integration ([solar-quote-calculator]), and form submission-keeping the whole plugin fast and simple to maintain.

Backend
Custom WordPress Plugin (Settings API & Native Shortcodes)
Frontend
Vanilla ES6+ JavaScript (Zero external scripts, instant updates)
Styling
Custom CSS tailored for a clean, custom design system
Integration
Drop-in Shortcode ([solar-quote-calculator]) for any page
Custom Logic
UK Postcodes, 0% VAT rules, SEG tariffs, and dynamic energy pricing
05

Skills Used

WordPress Plugin DevelopmentVanilla JavaScript (ES6+)UI/UX DesignCustom CSSPHP & Shortcode Development

Replacing our old lead form with this calculator totally changed the game for us. Being able to tweak electricity rates, battery costs, and button links directly from our WordPress admin gives our team complete freedom to run campaigns without constantly needing tech help.

Have a similar project in mind?

Get in touch for a free, no-obligation quote.

Start a Project
Ben built us a fantastic estate agent brochure site that is both beautiful and functional. He integrated a seamless property search feature and intuitive inquiry forms that have significantly increased our lead volume. The backend is easy for us to update with new listings, and the site's speed is impressive. Ben really understands the balance between aesthetic appeal and conversion-driven design.
Sebastian J.