Magpakita ng live na livability score para sa anumang address sa iyong mga pahina — libre, responsive, at walang kailangang build step. Perpekto para sa mga listahan ng ari-arian, gabay sa kapitbahayan, tool para sa paglipat, at mga pahina ng lungsod. Ang mga bisita na mag-tap sa score ay mapupunta sa buong ulat ng BuildingsScore.
Magdagdag ng placeholder kung saan mo gustong lumabas ang score, pagkatapos ay i-load ang script nang isang beses bawat pahina. Itakda ang mga coordinate ng lugar na nais mong i-score:
<div data-buildingsscore data-lat="48.8584" data-lng="2.2945"></div> <script async src="https://buildingsscore.com/embed.js"></script>
Iyon na. Papalitan ng script ang placeholder ng score card at awtomatiko itong mag-a-adjust para magkasya.
Ito ang eksaktong widget na ginagawa ng snippet sa itaas:
Dalawang hugis sa pamamagitan ng data-layout — vertical
(ang default na ipinapakita sa itaas, ideal para sa mga sidebar at card) at
horizontal, isang malawak na banner na angkop sa tuktok ng isang listahan
o isang buong-lapad na hilera:
<div data-buildingsscore data-layout="horizontal"
data-lat="48.8584" data-lng="2.2945"></div>
I-configure ang widget gamit ang mga katangiang data-* sa placeholder:
| Katangian | Paglalarawan |
|---|---|
data-lat / data-lng | Mga coordinate ng lugar na i-score. Ang mapagkakatiwalaang opsyon na hindi nangangailangan ng paghahanap — gamitin ito kapag mayroon kang mga ito. |
data-address | Isang address sa kalye para i-score (gina-geocode kung walang lat/lng) at/o isang label na ipinapakita sa card. |
data-layout | vertical (default, isang mataas na card) o horizontal (isang malawak na banner — score katabi ng compact na two-column dimension grid). |
data-theme | auto (default, sumusunod sa OS ng bisita), light, o dark. |
data-ref | Ang tag ng iyong site/kampanya para sa attribution. Default ay ang iyong domain. |
data-height | Paunang taas sa px bago sukatin ng card ang sarili nito (default 440). |
data-cta | Itakda sa 0 para itago ang button na "Tingnan ang buong ulat". |
Nagre-render ng mga listahan nang dynamic (infinite scroll, SPA, mga resulta ng AJAX)? Pagkatapos maglagay ng mga bagong placeholder, tumawag ng:
BuildingsScore.render();
Laktawan ang script at i-embed ang widget nang direkta:
<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>
Gamit ang script, awtomatikong nag-a-adjust ang card sa nilalaman nito; gamit naman ang plain na iframe, ikaw mismo ang magtatakda ng nakapirming taas.
Ang score, ang button, at bawat kategorya ay nagbubukas ng buong, interactive na ulat ng BuildingsScore para sa lugar na iyon sa isang bagong tab — kaya nananatili sa iyong pahina ang bisita habang tinitingnan nila ang mas detalyadong view. Hindi kami nagtatakda ng third-party cookies sa widget, at ang score ay kinukuwenta sa aming mga server, kaya nananatiling mabilis ang iyong pahina.