Embed BuildingsScore on your site

Show a live livability score for any address on your own pages — free, responsive, and with zero build step. Great for property listings, neighborhood guides, relocation tools, and city pages. Visitors who tap the score land on the full BuildingsScore report.

Two lines of HTML

Add a placeholder where you want the score, then load the script once per page. Set the coordinates of the spot you want scored:

<div data-buildingsscore data-lat="48.8584" data-lng="2.2945"></div>
<script async src="https://buildingsscore.com/embed.js"></script>

That's it. The script swaps the placeholder for a score card and resizes it to fit.

Live preview

This is the exact widget the snippet above produces:

Layouts

Two shapes via data-layoutvertical (the default shown above, ideal for sidebars and cards) and horizontal, a wide banner that fits the top of a listing or a full-width row:

<div data-buildingsscore data-layout="horizontal"
     data-lat="48.8584" data-lng="2.2945"></div>

Options

Configure the widget with data-* attributes on the placeholder:

AttributeDescription
data-lat / data-lngCoordinates of the spot to score. The reliable, no-lookup option — use these when you have them.
data-addressA street address to score (geocoded if you don't pass lat/lng) and/or a label shown on the card.
data-layoutvertical (default, a tall card) or horizontal (a wide banner — score beside a compact two-column dimension grid).
data-themeauto (default, follows the visitor's OS), light, or dark.
data-refYour site/campaign tag for attribution. Defaults to your domain.
data-heightInitial height in px before the card measures itself (default 440).
data-ctaSet to 0 to hide the "See the full report" button.

Adding widgets after the page loads

Rendering listings dynamically (infinite scroll, a SPA, AJAX results)? After you insert new placeholders, call:

BuildingsScore.render();

Prefer a plain iframe?

Skip the script and embed the widget directly:

<iframe
  src="https://buildingsscore.com/embed.html?lat=48.8584&lng=2.2945"
  style="width:100%;height:440px;border:0"
  loading="lazy" title="BuildingsScore"></iframe>

With the script the card auto-resizes to its content; with a bare iframe you set a fixed height yourself.

How clicks work

The score, the button, and every category open the full, interactive BuildingsScore report for that spot in a new tab — so your page keeps the visitor while they get the deeper view. We never set third-party cookies in the widget, and the score is computed on our servers, so your page stays fast.