WordPress

Installeer het Selgeo-trackingsnippet op een WordPress-site. Het snippet moet op elke pagina van uw site draaien — bezoekers kunnen op elke URL aankomen met een ?ref=…-parameter, en een snippet dat alleen op één enkele post of landingspagina draait, mist de meeste klikken.

API-versie: v1

Als u geen WordPress gebruikt, raadpleeg dan in plaats daarvan de HTML- / eenvoudige-script-handleiding, de Next.js-handleiding of de React-(Vite)-handleiding.

Het snippet MOET site-breed staan

Een Custom-HTML-blok in Gutenberg met paginabereik, geplaatst op één enkele post of landingspagina, is niet acceptabel. De ?ref=-parameter kan op elke URL van uw site landen — uw startpagina, uw prijzenpagina, een blogpost die een partner heeft gedeeld. Als het snippet niet site-breed aanwezig is, gaan die klikken stilzwijgend verloren. Gebruik een van de drie site-brede plaatsingsroutes hieronder.

Drie site-brede plaatsingsroutes

Route	Geschikt voor	Bewerking
A. Site Editor (blokthema's)	Moderne blokthema's (Twenty Twenty-Three, Twenty Twenty-Four, Twenty Twenty-Five, enz.)	Zonder code; gebruikt de WordPress Site Editor
B. footer.php (klassieke thema's)	Klassieke thema's met footer.php (Astra, GeneratePress, OceanWP zonder FSE, aangepaste thema's)	Directe themabestandbewerking
C. Header-footer-plugin	Elke WordPress-site, ook die zonder toegang tot themabestanden	Zonder code; plugin-interface

Gebruik de route die past bij uw stack. Alle drie resulteren in hetzelfde snippet dat op elke pagina draait.

Route A — Site Editor (blokthema's)

Voor blokthema's (Full Site Editing — FSE).

Stap 1: Open de Site Editor

Navigeer in het WordPress-admin naar Weergave > Editor. De Site Editor opent.

Stap 2: Open het footer- (of header-)sjabloondeel

Selecteer in de linker navigatie Patronen > Sjabloondelen > Footer (of Header). Het footer-sjabloondeel is de standaardlocatie voor trackingsnippets omdat het op elke pagina wordt geladen.

Stap 3: Voeg een Custom-HTML-blok in

Klik op de +-knop om een blok toe te voegen aan het einde van de footer, zoek naar Custom HTML en voeg het blok in.

Plak het snippet in de body van het blok:

<script
  async
  src="https://cdn.selgeo.com/v1/selgeo.js"
  data-merchant="pk_test_YOUR_KEY"
></script>

Vervang pk_test_YOUR_KEY door uw publieke API-sleutel uit Instellingen > API-sleutels in het Selgeo-dashboard.

Stap 4: Sla het sjabloondeel op

Klik op Opslaan rechtsboven. WordPress past de wijziging direct site-breed toe.

Header of footer?

Beide werken. De footer heeft de voorkeur omdat het de eerste paint niet blokkeert. Een header-plaatsing is prima als uw footer voorwaardelijk wordt verborgen (zeldzaam).

Route B — footer.php (klassieke thema's)

Voor klassieke (niet-FSE) thema's.

Gebruik een child-thema

De footer.php van het oudertheme rechtstreeks bewerken betekent dat uw bewerking bij de volgende thema-update wordt overschreven. Gebruik een child-thema of een van de andere twee routes.

Stap 1: Open de footer.php van uw child-thema

Pad: wp-content/themes/<uw-child-thema>/footer.php.

Als het bestand niet bestaat in uw child-thema, kopieer het dan eerst vanuit het ouderthema.

Stap 2: Voeg het snippet toe net voor </body>

<?php
// ... uw bestaande footer-markup ...
?>

<script
  async
  src="https://cdn.selgeo.com/v1/selgeo.js"
  data-merchant="pk_test_YOUR_KEY"
></script>

<?php wp_footer(); ?>
</body>
</html>

Plaats de <script>-tag voor wp_footer() zodat het snippet vroeg genoeg laadt om klikken vast te leggen, maar binnen hetzelfde sluitende </body>-blok.

Stap 3: Uploaden en verifiëren

Upload de bewerkte footer.php naar uw server (via SFTP, de WordPress-bestandseditor of de bestandsbeheerder van uw hosting-paneel) en herlaad uw site.

Route C — Header-footer-plugin

Voor sites zonder toegang tot themabestanden, of operators die een interface verkiezen.

De twee populairste plugins zijn:

• WPCode (voorheen Insert Headers and Footers) — de gratis laag dekt deze use case.
• Insert Headers and Footers van WPBeginner — minimalistische single-purpose-plugin.

De instructies zijn in wezen identiek; deze sectie gebruikt WPCode als voorbeeld.

Stap 1: Installeer en activeer de plugin

Navigeer in het WordPress-admin naar Plugins > Nieuwe plugin toevoegen, zoek naar WPCode, installeer en activeer.

Stap 2: Open de Header & Footer-instellingen

Navigeer naar Code Snippets > Header & Footer.

Stap 3: Plak het snippet in het Footer-gebied

Plak in het tekstveld Footer:

<script
  async
  src="https://cdn.selgeo.com/v1/selgeo.js"
  data-merchant="pk_test_YOUR_KEY"
></script>

Vervang pk_test_YOUR_KEY door uw publieke API-sleutel.

Stap 4: Sla wijzigingen op

Klik op Save Changes. De plugin injecteert het snippet site-breed bij de volgende paginalading.

Uw installatie verifiëren

1. Open uw site in een privé- / incognito-browservenster.
2. Maak een trackinglink aan in het Selgeo-dashboard onder Programma's > Trackinglinks.
3. Bezoek uw site met de trackinglink, bijvoorbeeld:

   https://uw-site.com/?ref=UW_TEST_REF

4. Open de Developer Tools (F12). Zoek in het tabblad Elements naar selgeo.js — het zou binnen <body> of net voor </body> moeten verschijnen.
5. Met tijdelijk toegevoegde data-debug toont de Console:

   [selgeo] ref detected UW_TEST_REF
   [selgeo] click_id stored xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx

6. Voer in de console uit:

   __selgeo.getClickId()

   Dit zou een UUID-string moeten teruggeven.
7. Open het Selgeo-dashboard. De klik zou binnen enkele seconden onder Analytics moeten verschijnen.

Probleemoplossing

Snippet niet geladen

• Open de gerenderde paginabron (rechtsklik > Paginabron bekijken) en zoek naar selgeo.js. De <script>-tag moet in de HTML verschijnen — zo niet, dan heeft het snippet de pagina niet bereikt.
• Voor Route A (Site Editor): bevestig dat u het sjabloondeel hebt opgeslagen, niet alleen een afzonderlijke pagina. Het pictogram voor sjabloondelen in de Site Editor is een klein "puzzelstukje" — het opslaan van een pagina propageert niet.
• Voor Route B (footer.php): bevestig dat u naar het child-thema hebt geüpload, dat het child-thema actief is onder Weergave > Thema's en dat geen caching-plugin een verouderde kopie serveert. Maak de cache leeg na bewerking.
• Voor Route C (plugin): zorg ervoor dat de plugin actief is (niet alleen geïnstalleerd) onder Plugins, en dat het snippet in het Footer-gebied is geplakt, niet in een aangepast paginaveld.
• Page-builder-plugins (Elementor, Divi, Beaver Builder) verwijderen soms ruwe <script>-tags uit hun eigen editor. Als u het snippet via een page-builder-blok hebt geplaatst, schakel dan over op een van de Routes A / B / C — die werken op het WordPress-sjabloonniveau en overleven de page-builder-rendering.

Klik niet getraceerd

• De bezoeker moet aankomen met ?ref=… bij de initiële paginalading. Herladen verwijdert de parameter (het snippet herschrijft de URL bij het vastleggen).
• Bevestig dat data-merchant een geldige pk_test_*- of pk_live_*-sleutel bevat. Een ontbrekende sleutel veroorzaakt een stille no-op.
• Controleer of een caching-plugin (WP Rocket, W3 Total Cache, LiteSpeed) <script>-tags herschrijft. De meeste caching-plugins bieden een optie om scripts uit te sluiten van "JS-optimalisatie" / "defer / combine" — sluit selgeo.js uit van die regels.
• Verifieer dat het snippet site-breed draait, niet alleen op één pagina (open de startpagina en een andere pagina, bekijk de bron, bevestig dat de tag op beide aanwezig is).

CSP-blokkering

Als uw hostingprovider of een beveiligingsplugin (bijv. Wordfence, Sucuri) een Content-Security-Policy-header injecteert, sta dan de Selgeo-oorsprongen toe:

script-src 'self' https://cdn.selgeo.com;
connect-src 'self' https://api.selgeo.com;

Voeg voor staging- / dev-workspaces waar data-api-url naar een andere oorsprong wijst, die oorsprong ook toe aan connect-src.

Volgende stappen

• Stripe Payment Links — Stripe-integratie zonder backend; bijzonder geschikt voor WordPress-sites die naar buy.stripe.com linken.
• Conversion API — traceer niet-Stripe-conversies (formulierinzendingen, plugin-webhooks).
• Snippet-setup — volledige attribuutreferentie en de onderliggende HTML-script-tag.