Free website embed

Add the roof cost calculator to your site

Paste this snippet into your page where you want the calculator to appear. The iframe resizes to fit its contents and keeps the estimate on TheRoofBill.

<iframe
  id="theroofbill-calculator"
  src="https://theroofbill.com/embed/calculator/"
  title="TheRoofBill roof replacement cost calculator"
  loading="lazy"
  style="width:100%;height:900px;border:0;"
></iframe>
<script>
  window.addEventListener("message", function (event) {
    var frame = document.getElementById("theroofbill-calculator");
    if (!frame || event.origin !== "https://theroofbill.com" || event.source !== frame.contentWindow) return;
    if (event.data && event.data.type === "theroofbill:resize" && Number.isFinite(event.data.height)) {
      frame.style.height = Math.max(500, Math.min(4000, event.data.height)) + "px";
    }
  });
</script>

The resize listener accepts messages only from theroofbill.com and the embedded calculator frame. You can also open the standalone calculator.