QuoteBlock

Install guide

How to add a quote calculator to any HTML site

Plain HTML, PHP, Rails, Next.js, a static site — it's one snippet with no build step.

  1. Build your calculator here and copy the snippet.
  2. Paste it into your page wherever the calculator should appear.
  3. That's it — the script is loaded with defer and has no dependencies.

Worth knowing

For React, Vue or Svelte, render the mount div and the JSON script tag, then load the widget script once. It reads the DOM on load and exposes window.QuoteBlock.render(el, config) if you'd rather mount it yourself.

Build your calculator — free

What the snippet looks like

Three lines. Your prices are the JSON in the middle, so you can read and edit them any time.

<div data-quoteblock="my-quote"></div>
<script type="application/json" id="my-quote">{ ...your prices... }</script>
<script src="https://quoteblock.app/v1/quoteblock.js" defer></script>

Other platforms

WordPressInstall guideSquarespaceInstall guideWixInstall guideWebflowInstall guideShopifyInstall guide