Foodstr-demo En demobutik som visar hur Foodstr ser ut i en handlares egen produktlista och produktsida. build 2026-09-04 15:17 Så fungerar integrationen
Kampanj · t.o.m. söndag

Bunkra för hälsan — upp till 20 % rabatt

Utvalda varor för en enklare vardag. Fibrer, protein och frukost som håller hela förmiddagen.

Bunkra för hälsan

150 varor
Foodstr

Integrationsguide

Så lägger ni till Foodstr på er sajt. Sex steg, och ingenting i er befintliga kod behöver skrivas om.

  1. 1

    Lägg in skriptet i sidhuvudet

    Lägg Foodstr-skriptet i <head> på de sidor där widgeten ska visas — vanligtvis produktlistan och produktsidan. Er token får ni av Foodstr-teamet och den identifierar er som kund. Den ligger i skript-URL:en, eftersom en vanlig <script src> inte kan skicka egna headers. Vår server kontrollerar att anropet kommer från en av era godkända domäner innan något levereras.

    <!-- en gång, på produktlistor och produktsidor -->
<script async
  src="https://foodstrbackse.com/embed/v1/embed.js?token=pk_live_9f3c…"
  integrity="sha384-…"
  crossorigin="anonymous"></script>
  2. 2

    Märk upp varje produkt

    Lägg ett tomt element där knappen ska hamna — i produktkortet och på produktsidan. Produkten identifieras med sin streckkod (GTIN/EAN), så ni behöver inga Foodstr-ID:n och ingen mappning: streckkoden har ni redan i ert sortiment.

    data-foodstr-image är valfritt. Anger ni er egen produktbild visas den i popupen, så att bilden alltid stämmer med den kunden redan tittar på. Den skickas aldrig till oss och sparas ingenstans — den läses av skriptet i webbläsaren och används bara för att rita popupen på er sida.

    <div class="foodstr-widget"
     data-foodstr-gtin="7310865004703"
     <!-- valfritt -->
     data-foodstr-image="/bilder/produkt.jpg"></div>
  3. 3

    Foodstr sköter resten

    Skriptet hittar alla element, ritar in knappen med sin etikett och öppnar popupen vid klick. Produkter som dyker upp senare — vid filtrering, sortering eller oändlig scrollning — fångas upp automatiskt.

    Widgeten rör varken er markup eller era stilar. Allt den ritar ligger i sin egen namnrymd, så den kan inte krocka med er design.

  4. 4

    Säkerhet och integritet

    Lägg inte skriptet i kassan. Widgeten hör hemma på produktlistor och produktsidor. Ett tredjepartsskript på en betalsida drar in er i PCI DSS krav på skriptinventering och integritetskontroll (6.4.3 och 11.6.1) — helt i onödan, eftersom vi inte har något att visa där.

    integrity i taggen ovan gör att webbläsaren vägrar köra skriptet om innehållet ändras. Ni behöver alltså inte lita på att vår server förblir oförändrad — webbläsaren kontrollerar det åt er vid varje sidladdning.

    Vill ni låsa er CSP: script-src https://foodstrbackse.com och connect-src https://foodstrbackse.com. Widgeten laddar inget annat, varken teckensnitt, bilder eller spårning.

    Vi loggar streckkod, tidpunkt och er domän för varje uppslag. IP-adressen sparas enbart som en saltad hash, aldrig i klartext, och allt raderas automatiskt efter 90 dagar. Personuppgiftsbiträdesavtal skrivs innan ni går live.

  5. 5

    Live på den här sidan

    Knappen nedan är inte en simulering. Den ritas av det riktiga skriptet, med taggen ovan, och hämtar data från Foodstrs svenska server när ni klickar.

    Arla Grädde 12 % GTIN 7310865004703

    Skriptet serveras bara till domäner ni godkänt. Öppnar ni sidan från en annan domän ritas ingen knapp alls, och produktanropet avvisas av webbläsaren.

  6. 6

    Testa och gå live

    Vi lägger till era domäner i listan över godkända, inklusive er test- och stagingmiljö. När ni är nöjda tar ni bort testdomänerna och skriptet är i drift.

    Behöver ni ändra utseendet — storlek, placering eller text — går det via samma element, utan ny release från er sida.