Gå direkte til hovedindholdet
Kontakt
Fabrixa Studio-editoren — et white-label-værktøj til produkttilpasning, der er integreret i en webshop
Udviklere · Fabrixa Studio

Kunderne designer deres egne produkter — under eget brand.

Fabrixa Studio er et white-label tilpasningsværktøj, som du integrerer på din produktside som en iframe. Dine kunder opretter eller uploader deres egne designs og kan se et live-eksempel på produktet — redigeringsværktøjet bærer dit brand, ikke vores, så de ser aldrig Fabrixa. Når de er færdige, afgiver du ordren på baggrund af den gemte tilpasning — der er ingen grafiske filer, der skal uploades eller gemmes.

Integrationsvejledning → Åbn API-referencen

White-label · Shopify, WooCommerce og skræddersyede løsninger · Live-forhåndsvisning · Bestil efter referencenummer

Fabrixa Studio · Live-demo

Prøv redigeringsværktøjet lige her.

Det er netop denne editor, du skal integrere — åbn den, indsæt billedmateriale og design et rigtigt produkt fra vores katalog. Der skal ikke installeres noget, og der kræves ingen konto.

Det er den samme editor, som dine kunder bruger til at designe via Shopify- og WooCommerce-modulerne eller API. Denne side er en live-demo — bestillingen foregår på platformen, når du register.

Se redaktøren

Dit brand. Din kundes design. Ét lærred.

Studio integreret i en butiksfront — et designbibliotek, tekst-, form-, billed- og lagværktøjer samt en live-forhåndsvisning af mønstergentagelsen på produktet. Det kører som white-label, så dine kunder ser din butik og aldrig Fabrixa.

yourshop.com/tilpas
Fabrixa Studio-redigeringsværktøjet, der er integreret i en webshop — designbibliotek, tekst-, figur-, billed- og lagværktøjer samt en live-forhåndsvisning af mønstergentagelse på et dynebetræk, white-label under forhandlerens mærkeFabrixa Studio-redigeringsværktøjet, der er integreret i en webshop — designbibliotek, tekst-, figur-, billed- og lagværktøjer samt en live-forhåndsvisning af mønstergentagelse på et dynebetræk, white-label under forhandlerens mærke
Hvad Studio laver

Et white-label-tilpasningsværktøj, der er integreret i din betalingsproces.

Med Studio kan dine kunder tilpasse produkter i realtid – enten ved at skabe et design eller uploade deres eget – og se resultatet på produktet, inden de køber det, alt sammen under dit brand.

01
White-label, under dit eget mærke

Redigeringsværktøjet bærer dit brand, ikke vores — dine kunder kan tilpasse og få et eksempel på produkterne i realtid uden nogensinde at se Fabrixa.

02
Opret eller upload designs

De udarbejder et design i Studio eller uploader deres eget billedmateriale og placerer det derefter på produktet i redigeringsprogrammet.

03
Visualisering af produktet i realtid

Studio viser designet på det faktiske produkt, så kunderne kan se, hvad de får, inden de lægger det i indkøbskurven.

04
Gemt pr. vare i indkøbskurven

Hver tilpasning gemmes i forbindelse med en cart_item_key I leverer — én unik værdi pr. linje i indkøbskurven fra jeres side.

05
Vis forhåndsvisning af billede efter behov

Hent et renderet eksempelbillede for ethvert cart_item_key der skal vises i indkøbskurven, i ordresammendraget eller hvor som helst i din butik.

06
Ingen filhåndtering

Du må aldrig ændre på billedfilerne. Brug i stedet cart_item_key ved bestillingen, og Fabrixa vedhæfter automatisk det gemte design.

Trin 1 — Indsæt

Én iframe på din produktside.

Sælger du på Shopify eller WooCommerce? Studio er integreret i disse butiksmoduler — du skal bare aktivere det, uden at du behøver at kode. Til brugerdefinerede butiksfronter og platforme kan du selv integrere det: Studio hentes fra studio.fabrixa.com og tilføjet med en iframe. Indsæt tre værdier i URL’en — alt andet klares inde i redigeringsværktøjet, som vises som white-label under dit brand.

  • application_key — din applikationsnøgle, der begrænser indlejringen til din salgskanal
  • sku — produktvarianten SKU, hentet fra integrationen API
  • cart_item_key — en unik værdi, du angiver for hver linje i indkøbskurven; Studio gemmer den tilpassede indstilling for den pågældende linje
produktside.html 
<!-- Embed Fabrixa Studio on your product page -->
<iframe id="fabrixa-studio"
  src="https://studio.fabrixa.com?application_key=APPLICATION_KEY&sku=COF099191&cart_item_key=CART_ITEM_KEY"
  name="FabrixaStudio"
  scrolling="no" frameborder="1"
  width="100%" height="100%" allowfullscreen>
</iframe>
Trin 2 — Lyt

Studio svarer tilbage med postMessage.

Studio sender to meddelelser til overordnede vindue. customizationFinished aktiveres, når kunden klikker Læg i kurven; closeButtonClicked udløses, når de klikker Tilbage. Lyt efter dem på forældreenheden, og kontroller altid event.origin.

Den customizationFinished, tilføj varen til din indkøbskurv med samme cart_item_key du har indsat i iframen — det er linket til det gemte design.

studio-events.js 
window.addEventListener("message", (event) => {
  // Always check the origin first
  if (event.origin !== "https://studio.fabrixa.com") return;

  if (event.data === "customizationFinished") {
    // Add to Cart → store the line keyed by your cart_item_key
    addToCart(cartItemKey);
  } else if (event.data === "closeButtonClicked") {
    // Back → close the editor / restore the product page
    closeStudio();
  }
});
Trin 3 — Forhåndsvisning

Vis det færdige design hvor som helst.

Når en tilpasning er gemt, skal du hente et renderet billede af den fra preview-endpointet — du skal blot indstille det som src af en <img>. Perfekt til indkøbskurven, ordresammendraget eller en bekræftelsesside.

Forhåndsvisningen er inddelt efter det samme cart_item_key, med din applikationsnøgle i forespørgselsstrengen.

cart-preview.html 
<!-- Rendered preview of the saved customisation -->
<img
  src="https://api.fabrixa.com/v2/studio/customizations/CART_ITEM_KEY/preview?Application-Key=APPLICATION_KEY"
  alt="Customised product preview"
  style="max-width:100%;height:auto">
Trin 4 — Bestilling

Afgiv ordren ved hjælp af referencen.

Ved kassen, POST ordren om /v2/integration/orders fra dit backend. For en linje, som en kunde har designet i Studio, skal du sende sku, den quantity og det samme cart_item_key den, du sendte ind i iframe’en — den nøgle er det gemte design, så nej sources Filen er nødvendig. Fabrixa henter tilpasningerne og implementerer dem i produktionsmiljøet.

cart_item_key er Studio-referencen — den skal kun bruges til linjer, som en kunde har tilpasset i Studio. Hver række indeholder enten en cart_item_key (designet i Studio) eller a sources fil (dit eget design — PDF, TIFF, JPG eller PNG), aldrig begge dele. Alt andet i bestillingen er identisk.

POST /v2/integration/orders 
{
  "number": "NL2026063001",
  "purchased_at": "2026-06-30 12:00:00",
  "rows": [
    {
      "sku": "SB796162",
      "quantity": 1,
      "cart_item_key": "0cb76770-de2d-4524-aa48-47b6e5f0d8a5"
    }
  ],
  "customer":         { "first_name": "Maria", "email": "maria@example.com" },
  "shipping_address": { "...": "..." }
}
Nøgler og sikkerhed

Applikationsnøgle i browseren, adgangstoken på dit backend.

Studio og preview-endpointet bruger din Application Key, som er synlig i den indlejrede visning efter design — den er kun begrænset til editoren og viser forhåndsvisninger for din kanal. For at oprette ordrer skal man Application Access Token også, og det forbliver på dit backend.

I browseren

Studio og forhåndsvisning

  • application_key på Studio-iframe-URL’en
  • Application-Key på URL’en til forhåndsvisningsbilledet
  • Viser redigeringsvinduet og forhåndsvisninger af gemte designs til din kanal
  • Det er ikke muligt at afgive ordrer, se fakturaer eller se data fra en anden kanal
Kun backend

Oprettelse af ordre

  • Authorization: Bearer APPLICATION_ACCESS_TOKEN
  • X-Application-Key: APPLICATION_KEY
  • Opret og følg ordrer via POST /v2/integration/orders
  • Opbevar adgangstokenet på serversiden — send det aldrig med i klientkoden
Adgang

Studio er aktiveret pr. konto.

Opret en salgskanal i dit dashboard for at generere den applikationsnøgle, som indlejringen bruger til at autentificere sig med, og udvikl og test derefter på baggrund af denne kanal, inden den begynder at modtage reelle ordrer. Der findes en live-demo i API-referencen, hvor du kan åbne Studio med din egen SKU og nøgle — priserne varierer alt efter volumen, så kontakt vores team for nærmere oplysninger.

Er du klar til at integrere?

Føj Studio til din webshop.

Opret en salgskanal for at generere dine nøgler og integrere Studio allerede i dag. Har du brug for hjælp til at konfigurere begivenhederne eller ordreforløbet? Kontakt en Solutions Engineer — du får svar inden for én hverdag.

Kontakt en Solutions Engineer Læs integrationsvejledningen