Free embeddable widget · CC-BY 4.0
Hardscape Installation Cost Calculator
State-aware estimate for patios, walkways, retaining walls, and outdoor-living hardscape — pavers, flagstone, concrete, or natural stone.
Best for: Hardscape contractors · landscape architects · outdoor-living blogs
One-tag script (recommended)
- ✓ One tag installs every HavenCostGuide calculator on your page
- ✓ Auto-resizes to fit content — no scrollbars, no fixed heights
- ✓ Optional
data-state="CA"attribute to pre-fill the user's state - ✓ Free under CC-BY 4.0 (the attribution link is auto-inserted)
Where to embed it
- •Hardscape contractor service pages — natural fit, especially when paired with Deck and Pool calculators on one page.
- •Landscape architect portfolios — visitors researching backyard transformations get a budget anchor before requesting a quote.
- •Outdoor-living lifestyle blogs covering patio design and material comparisons.
Live preview
FAQ
Is the embed free?
Yes — every HavenCostGuide widget, including the hardscape installation cost calculator, is free under Creative Commons Attribution 4.0. Commercial use is allowed; the only requirement is to keep the "Powered by HavenCostGuide" link in the iframe footer (already rendered automatically).
Will the embed break my page's design?
No. The iframe is sandboxed with a `border-radius:12px` + `max-width:720px` wrapper and zero external CSS leakage. It's mobile-responsive (the iframe content reflows under 640px wide). You can adjust the wrapper styles freely.
Does it send my visitors' data to HavenCostGuide?
No. All math runs in your visitor's browser. We receive zero analytics from the iframe content. Only outbound clicks (e.g., 'Open the full calculator') hit our server, and only at click time.
Will the embed stay in sync with the full calculator?
Yes. We ship a fresh build every 2 weeks. Since the embed is loaded from a live URL (not a static copy), your visitors always see the most current math without you having to update anything.
Can I customize the embed's height or width?
Yes — the snippet above uses width="100%" and height="620" as a tested default. Increase the height if you find the iframe shows a scrollbar on mobile; decrease if you want it more compact. The internal layout will adapt.
How do I attribute properly?
The "Powered by HavenCostGuide" link in the iframe footer satisfies CC-BY 4.0 attribution. Don't hide it with CSS. Beyond that, a dofollow link from your post body to havencostguide.com is appreciated but not required.
Embeddable on your site — Pin our "Hardscape Installation Cost Calculator" so it's a one-tap iframe drop next time you write a blog post on the topic.
Pin this