Add the widget to a website

<iframe id="instant-quote" data-measuredbid-widget src="https://measuredbid.com/quote/your-widget-id" title="Your business price estimate"
  style="width:100%;border:0;min-height:640px" loading="lazy"></iframe>
<script>
  (function () {
    var s = document.currentScript, f = s && s.previousElementSibling;
    if (!f || f.tagName !== "IFRAME") f = document.getElementById("instant-quote");
    if (!f) return;
    var lastStep = null;
    var q = new URLSearchParams(location.search), p = new URLSearchParams();
    ["utm_source","utm_medium","utm_campaign","utm_term","utm_content","gclid","gbraid","wbraid","fbclid","msclkid"].forEach(function (k) {
      if (q.get(k)) p.set(k, q.get(k));
    });
    p.set("ref", location.href);
    f.src = f.src + (f.src.indexOf("?") < 0 ? "?" : "&") + p.toString();
    window.addEventListener("message", function (e) {
      if (e.origin !== "https://measuredbid.com" || e.source !== f.contentWindow) return;
      if (!e.data || typeof e.data !== "object") return;
      if (e.data.type === "instant-quote:height" && typeof e.data.height === "number" && Number.isFinite(e.data.height) && e.data.height > 0 && e.data.height <= 20000) f.style.height = Math.ceil(e.data.height) + "px";
      if (e.data.type !== "instant-quote:step" || ["address","confirm","result","no_data","booked"].indexOf(e.data.step) < 0 || e.data.brand !== new URL(f.src).pathname.split("/").pop() || e.data.step === lastStep) return;
      lastStep = e.data.step;
      if (e.data && e.data.type === "instant-quote:step" && e.data.step !== "address") {
        f.style.minHeight = "0";
        if (f.getBoundingClientRect().top < 0) f.scrollIntoView({behavior: window.matchMedia("(prefers-reduced-motion: reduce)").matches ? "auto" : "smooth", block: "start"});
      }
      if (e.data && e.data.type === "instant-quote:step" && window.dataLayer)
        window.dataLayer.push({ event: "iq_step", step: e.data.step, brand: e.data.brand });
    });
  })();
</script>

"use client";
import { useEffect, useRef } from "react";

const APP = "https://measuredbid.com";
const WIDGET = "your-widget-id";
const PASS = ["utm_source","utm_medium","utm_campaign","utm_term","utm_content","gclid","gbraid","wbraid","fbclid","msclkid"];

export function MeasuredBidWidget({ title = "Price estimate" }) {
  const ref = useRef(null);

  useEffect(() => {
    const frame = ref.current;
    // Carry ad tracking from this page into the lead, plus the page itself.
    const page = new URLSearchParams(window.location.search);
    const params = new URLSearchParams();
    PASS.forEach((key) => page.get(key) && params.set(key, page.get(key)));
    params.set("ref", window.location.href);
    frame.src = `${APP}/quote/${WIDGET}?${params}`;

    function onMessage(e) {
      if (e.origin !== APP || e.source !== frame.contentWindow || !e.data) return;
      const { type, height, step } = e.data;
      if (type === "instant-quote:height" && Number.isFinite(height) && height > 0 && height <= 20000) {
        frame.style.height = `${Math.ceil(height)}px`;
      }
      if (type === "instant-quote:step" && step !== "address") frame.style.minHeight = "0";
    }
    window.addEventListener("message", onMessage);
    return () => window.removeEventListener("message", onMessage);
  }, []);

  return <iframe ref={ref} title={title} style={{ width: "100%", border: 0, minHeight: 640 }} />;
}

<a href="https://measuredbid.com/quote/your-widget-id?service=gutters" target="_blank" rel="noopener">Get a price</a>