# Footnote gebruiken op een Catalyst-storefront
> Footnote-labels instellen op een Catalyst-storefront: welke versies werken, wat je developer moet laten staan en wat je checkt als een label ontbreekt.
Laatst bijgewerkt: 2026-10-20
Footnote-labels werken op Catalyst, de BigCommerce-storefront op basis
van Next.js, vanaf versie 1.4. De ondersteuning voor Catalyst is in bèta.
We hebben het labelscript getest op standaard Catalyst 1.12, maar nog
niet op de eigen Catalyst-build van een winkel. Klopt iets op deze pagina
niet met wat je ziet, laat het ons dan weten.
Catalyst is code die van je team is, dus het grootste deel van deze
pagina is voor degene die het beheert. Stuur die persoon de link.
## Controleer je Catalyst-versie
Labels hebben Catalyst core 1.4 of nieuwer nodig. Catalyst laadt scripts
uit Script Manager vanaf versie 1.3 via de cookie-toestemmingsmanager, en
in 1.4 kwam de plaatsing in head en body erbij waar het script van
Footnote op rekent. De versie staat in `core/package.json`, onder de naam
`@bigcommerce/catalyst-core`.
Een Catalyst-update van BigCommerce bereikt je storefront pas als je
developer die in jullie kopie samenvoegt. Een oudere storefront blijft
dus op de oude versie tot iemand die bijwerkt.
## Laat de consent manager in de root-layout staan
Catalyst laadt scripts uit Script Manager via de component
`` in `core/app/[locale]/layout.tsx`. Wordt die
verwijderd of vervangen, dan laadt het script van Footnote nooit en
verschijnen er geen labels. Footnote kan dat vanuit BigCommerce niet
zien, dus Instellingen toont de storefront nog steeds als gedekt.
## Laat het script op "Essential" staan
Footnote voegt één script toe aan Script Manager, met de naam "Footnote
AI image labels" en de toestemmingscategorie "Essential". De cookiebanner
van Catalyst behandelt Essential-scripts als noodzakelijk, dus het script
laadt voordat een klant een keuze maakt en ook nadat die cookies heeft
geweigerd. Het plaatst geen cookies en verzamelt niets over klanten.
Wijzigt iemand de categorie in "Functional", "Analytics" of "Targeting",
dan zien klanten die cookies weigeren geen labels meer. Zet de categorie
in Script Manager terug op "Essential".
## Houd productafbeeldingen op het BigCommerce CDN
Footnote vindt een gelabelde afbeelding via het adres op het BigCommerce
CDN, waarin het product- en afbeeldingsnummer staan, bijvoorbeeld
`cdn11.bigcommerce.com/s-abc123/images/stencil/384w/products/157/551/`.
Standaard Catalyst toont productafbeeldingen rechtstreeks vanaf dat
adres, dus dit werkt zonder aanpassingen. Afbeeldingen die door de
beeldoptimalisatie van Next.js gaan (`/_next/image?url=...`) werken ook,
omdat Footnote het oorspronkelijke adres daarin leest.
Labels ontbreken als een afbeeldingsadres het BigCommerce-pad niet meer
bevat. Dat gebeurt bij een eigen image loader die het adres herschrijft,
een beeldproxy of een andere beelddienst vóór het CDN, of bij
afbeeldingen die met Makeswift zijn geplaatst.
## Sta Footnote toe in een eigen Content Security Policy
Standaard Catalyst beperkt niet waarvandaan scripts laden. Heeft je
developer regels voor `script-src` of `connect-src` toegevoegd, sta dan
in beide `https://footnote.pouchapps.com` toe. Het labelscript laadt van
daar en haalt daar je labelinstellingen op.
## Reken op maximaal een uur voor wijzigingen
Catalyst bewaart de lijst met scripts uit Script Manager tot een uur in
de cache. Nadat je Footnote hebt geïnstalleerd of iets aan je labels hebt
gewijzigd, kan het zo lang duren voordat de storefront bij is. Op Stencil
verschijnen dezelfde wijzigingen binnen ongeveer een minuut.
Een developer kan wijzigingen op twee manieren sneller zichtbaar maken:
- **De storefront opnieuw deployen.** Een nieuwe deploy haalt de
scriptlijst opnieuw op. Na het installeren van Footnote is dit de
eenvoudigste oplossing.
- **`DEFAULT_REVALIDATE_TARGET` verlagen.** De waarde is in seconden en
staat standaard op 3600. Hij bepaalt hoe lang Catalyst het grootste
deel van zijn BigCommerce-gegevens in de cache houdt, niet alleen
scripts, dus een lager getal betekent meer verzoeken aan BigCommerce.
Verlaag hem om te testen, en laat hem niet laag staan.
## Controleer of labels verschijnen
1. Open in Footnote Instellingen en controleer of je Catalyst-storefront
als gedekt in de lijst staat. Essentials dekt alleen je
standaardstorefront. Pro dekt elke storefront.
2. Markeer één afbeelding als "AI-gegenereerd" en zet in Instellingen
"Labels tonen" aan.
3. Wacht maximaal een uur, of vraag je developer om opnieuw te deployen.
4. Open die productpagina in een privévenster. Verschijnt er een
cookiebanner, weiger dan. Het label hoort in de hoek te staan die je
op het tabblad Badge hebt gekozen. Op Catalyst verschijnt het even na
de pagina, zodra de pagina klaar is met het laden van de scripts.
Om het in de browser te controleren, open je op een willekeurige pagina
van de storefront de ontwikkelaarsconsole en voer je
`document.documentElement.dataset.footnote` uit. Geeft dat `"1"` terug,
dan draait het script van Footnote daar.
## Een ontbrekend label oplossen
**Geeft de controle in de console geen `"1"` terug**, dan draait het
script van Footnote niet op de storefront. Controleer deze punten op
volgorde:
1. Wacht tot het uur voorbij is, of deploy opnieuw.
2. Instellingen toont de storefront als gedekt.
3. Catalyst core is versie 1.4 of nieuwer.
4. `` staat nog in `core/app/[locale]/layout.tsx`.
5. Het script staat in Script Manager op "Essential".
6. Een eigen Content Security Policy staat
`https://footnote.pouchapps.com` toe.
**Geeft hij wel `"1"` terug maar heeft de afbeelding geen label**, dan
draait het script maar heeft het de afbeelding niet gekoppeld:
- Controleer of de afbeelding in Footnote is gemarkeerd als
"AI-gegenereerd" of "AI-bewerkt".
- Klik met de rechtermuisknop op de afbeelding, kopieer het adres en
controleer of het `/products/` bevat, gevolgd door twee getallen. Zo
niet, dan komt de afbeelding niet van het BigCommerce CDN in een vorm
die Footnote kan koppelen.
- Controleer op het tabblad Badge of "Categorie- en zoekresultaten" aan
staat. Catalyst-pagina's hebben geen markering die Footnote vertelt dat
een pagina een productpagina is, dus die schakelaar dekt ook
productpagina's in Catalyst.
Kom je er niet uit, mail dan naar [footnote@pouchapps.com](mailto:footnote@pouchapps.com) met het
adres van je storefront, een productpagina die een label zou moeten
tonen, je Catalyst-versie en de uitkomst van de controle in de console.
De [supportpagina](https://pouchapps.com/footnote/nl/support/) somt de redenen op waarom een
label op elke storefront kan ontbreken.
Footnote helpt je afbeeldingen te labelen. Het bepaalt niet welke afbeeldingen je volgens de wet moet labelen en is geen juridisch advies.