Bygg inn på din nettbutikk.

Én linje JavaScript. Byggeren lastes i en iframe på produktsiden din. Kunden planlegger, du får handlekurven.

Live demo

Over: Terrasseplanlegger V4 forhåndsutfylt med 5×4 m, 80 cm høyde, rekkverk aktivert.

Hurtigstart

Kopier script-taggen til siden din (før </body>).

<script src="https://builders.flowcreate.no/embed.js" async></script>

Legg til en container der du vil vise byggeren.

<div data-bygger="terrasse-v4"
     data-tenant="din-butikk-id"
     data-width="100%"
     data-height="600"></div>

Håndter events (valgfritt — for å fange handlekurv og lagring).

<script>
  window.addEventListener('builders:cart:add', (e) => {
    console.log('Cart lines:', e.detail.lines);
    // Send til din egen handlekurv
  });
</script>

Data-attributter

Attributt	Påkrevd	Beskrivelse
`data-bygger`	Ja	Builder slug (e.g. terrasse-v4, pergola, isolasjon)
`data-tenant`	Nei	Butikk-ID for katalogoppslag og priser
`data-width`	Nei	Bredde (default: 100%)
`data-height`	Nei	Høyde (default: 600px)
`data-intent`	Nei	JSON-string med forhåndsutfylte verdier
`data-theme`	Nei	Tema (default \| dark)
`data-border`	Nei	Vis ramme — false for kantløs
`data-title`	Nei	A11y-tittel på iframe

Støttede byggere

Terrasseplanlegger V4 PILOT terrasse-v4

Terrasseplanlegger BETA terrasse

Pergolaplanlegger BETA pergola

Rekkverkkonfigurator BETA rekkverk

Isolasjonskalkulator BETA isolasjon

Fundamentkalkulator BETA fundament

Støpeplate BETA stopeplate

Belegningsstein BETA belegningsstein

Takrenneplanlegger BETA takrenne

Spilevegg PILOT spilevegg

Støttemurkalkulator PILOT stottemur

Damkalkulator PILOT dam

Koblingshjelperen PILOT koblingshjelper

RoomBox Builder PILOT construction-model

RoomBox Builder v2 PILOT construction-model-v2

Bindingsverk PILOT bindingsverk

Plan-studio PILOT planstudio

Events fra byggeren

builders:ready

Byggeren er lastet og klar

builders:cart:add

Bruker la til linjer i handlekurven

builders:project:save

Bruker lagret prosjektet

// Eksempel: fang handlekurv
window.addEventListener('builders:cart:add', (event) => {
  const lines = event.detail.lines;
  const total = event.detail.total;
  // lines: [ name, quantity, unit, price, total, materialKey, productId ]
  // total: 12450 (øre)
});

Forhåndsutfylling med intent

Send en BuilderIntent som JSON for å forhåndsutfylle dimensjoner, åpninger og tak.

<div data-bygger="construction-model-v2"
     data-intent='{
       "projectType": "garage",
       "dimensions": { "widthM": 6, "depthM": 4, "heightM": 2.4 },
       "roof": { "type": "gable", "pitchDeg": 27 },
       "openings": [
         { "type": "garage_door", "wallRef": "front", "widthM": 2.6, "heightM": 2.1 },
         { "type": "door", "wallRef": "right", "widthM": 0.9, "heightM": 2.1 }
       ]
     }'></div>

For Terrasseplanlegger V4:

<div data-bygger="terrasse-v4"
     data-intent='{
       "widthM": 5, "depthM": 4, "heightCm": 80,
       "railing": true, "stairs": true, "railingStyle": "glass"
     }'></div>

Komplett eksempel

<!-- FlowCreate Builders Embed -->
<script src="https://builders.flowcreate.no/embed.js" async></script>

<!-- Terrasse -->
<div data-bygger="terrasse-v4"
     data-tenant="din-butikk-id"
     data-width="100%"
     data-height="600"
     data-intent='{"widthM":5,"depthM":4,"heightCm":80}'></div>

Vil du bli pilot-butikk?

Vi setter opp butikkspesifikke materialnøkler, priser og merkevaretilpasning.

Kontakt oss