Ga naar inhoud
Leat Help Center

De loyaliteitswidget op je website installeren

De widget is een klein loyaliteitsvenster op je eigen website. Zonder je site te verlaten kunnen contacten hun punten en je beloningen bekijken, een beloning claimen, een referral-link delen, zich aanmelden voor je nieuwsbrief, je een bericht sturen en een cadeaukaart kopen.

Bepaal wat de widget toont voordat je hem live zet. Zie Het ontwerp van je widget instellen.

De code installeren

  1. Ga naar Apps → Widget.
  2. Klik op Bekijken bij de widget die je wilt installeren.
  3. Open Installatie.
  4. Kopieer onder Code fragment het script.
  5. Plak het in de HTML van je website.

Het maakt niet uit waar op de pagina de code staat: in de head of de body werkt allebei, en via Google Tag Manager ook. De widget verschijnt zodra de pagina is geladen.

De kaart Instructies op dezelfde pagina heeft handleidingen voor de meestgebruikte websiteplatforms. Die staan hieronder ook.

Beperk de widget tot je eigen website

Het tabblad Informatie toont het Toegestaan domein van de widget. Om het in te stellen open je Domein en klik je op Domein toevoegen, of op Domein bewerken als er al een is ingesteld. Vul je domein in en klik op Wijzigingen opslaan.

Is er een toegestaan domein ingesteld, dan verschijnt de widget alleen op pagina's waarvan het adres dat domein bevat. Op andere pagina's is hij helemaal niet te zien, dus controleer dit eerst als de widget ontbreekt.

Het tabblad Geavanceerd heeft onder Openen en sluiten JavaScript-opdrachten die je kunt kopiëren:

  • window.PiggyWidget.open('overview'); opent de startpagina
  • window.PiggyWidget.open('giftcard'); opent de cadeaukaartwinkel
  • window.PiggyWidget.open('loyalty'); opent de beloningen
  • window.PiggyWidget.open('login'); opent de inlogpagina
  • window.PiggyWidget.open('request-code'); opent de pagina waar contacten een inlogcode aanvragen
  • window.PiggyWidget.close(); sluit de widget

Wil je er een gebruiken in een menu of een knop, zet hem dan in de link, bijvoorbeeld javascript:window.PiggyWidget.open('giftcard');.

Goed om te weten:

  • Is de widget al open, dan schakelt de opdracht over naar de pagina die je kiest. Dat werkt of Widget standaard openen nu op Open of op Gesloten staat.
  • Een opdracht die draait terwijl de widget nog laadt, wacht en wordt uitgevoerd zodra de widget klaar is. Hij gaat ook voor Widget standaard openen, dus een close-opdracht houdt de widget gesloten.
  • De widgetcode moet op de pagina staan om een opdracht te laten werken. Een link waarop wordt geklikt voordat de code zelf is geladen, bijvoorbeeld terwijl Google Tag Manager hem nog laadt, doet niets.
  • De cadeaukaartwinkel werkt alleen als de widget een Cadeaukaart-element heeft met een gekozen cadeaukaartprogramma.

Er is geen webadres dat de widget op een bepaalde pagina opent. Hij opent alleen via deze opdrachten of als een contact op het widgeticoon klikt.

Onder Authenticatie staan op hetzelfde tabblad Inloggen met token, Is ingelogd en Uitloggen. Die zijn voor ontwikkelaars die contacten vanaf hun eigen website in de widget inloggen, en Inloggen met token heeft een token uit de Leat API nodig.

WordPress

De makkelijkste manier om code aan je WordPress-site toe te voegen is een plugin die scripts aan je header of footer toevoegt, zoals Header and Footer Scripts. Installeer hem, plak het code fragment erin en sla op.

Wix

Voor eigen code op een Wix-site heb je een premium Wix-abonnement nodig. Open in je site-instellingen Custom code, plak het code fragment, kies je domein en sla op.

Shopify

Ga in Shopify naar Online Store → Themes en kies Edit code. Open theme.liquid, plak het code fragment direct boven de tag </head> en klik op Save.

Lightspeed

Ga in je Lightspeed eCom-backoffice naar Settings → Web Extras. Plak het code fragment in Custom Javascript, zet het aan en sla op.

Magento

Ga in Magento naar Content → Design → Configuration en bewerk het thema dat je wilt. Plak onder HTML Head het code fragment in Scripts and Style Sheets en sla op.

Squarespace

Ga in Squarespace naar Settings → Advanced → Code Injection. Plak het code fragment onder Header en sla op.

Als de widget niet verschijnt

  • Controleer het Toegestaan domein op het tabblad Informatie. Is het ingesteld en klopt het niet met het adres van je site, dan blijft de widget verborgen.
  • Controleer of het code fragment op de live pagina staat, en niet alleen in een concept of voorbeeld van je site.
  • Heb je hem net geïnstalleerd, leeg dan de cache van je browser of open de pagina in een privévenster.

Terug naar het helpcentrum