Fits your existing stack

We pull ad spend via the platforms' APIs, and conversions from your site, shop, and CRM. So next to every source you see not just the count, but the cost and the revenue too.

Conversion types

Everything that drives revenue counts

Not just the checkout. Also the phone call on Tuesday morning and the deal that lands in your CRM three weeks later.

Formulieren

Offerte, contact, download

Reserveringen

Restaurant, afspraak, tafel

Telefoontjes

Klik-op-bellen en call tracking

E-mails

Mailto-klik en inbox-koppeling

Webshoporders

Inclusief orderwaarde en marge

Offline deals

CRM-import van gesloten omzet

Integrations

Connects to your stack, not the other way around

Cost data from the ad platforms, conversions from your site and shop. Combined in one report with real ROAS per source.

  • Google Analytics 4
  • Google Ads
  • Meta Ads
  • LinkedIn Ads
  • Microsoft Ads
  • WordPress
  • Shopify
  • Magento
  • Webflow
  • Wix
  • Squarespace
  • Eigen code (JS + API)
  • Rootboard Analytics Hub

Installation per platform

Roots werkt met één regel script. Je plakt hem in de head van je site - hieronder staat per platform precies waar je dat doet. Geen plug-in nodig, geen ontwikkelaar nodig.

WordPress

± 3 minuten

Script in de <head> van je thema, via de themabewerker of het 'header scripts'-veld van je thema.

  1. 1Log in op je beheeromgeving via jouwdomein.nl/wp-admin.
  2. 2Klik links in het zwarte menu op Weergave (Appearance) → Thema-bestandsbewerker (Theme File Editor).
  3. 3Kies rechts in de lijst 'Themabestanden' het bestand Thema-header (header.php). Zie je die lijst niet, dan gebruik je stap 6.
  4. 4Zoek in de code de regel </head> - meestal rond regel 20 tot 40. Tip: gebruik Ctrl+F (Cmd+F op Mac) in de editor.
  5. 5Zet je cursor op de lege regel vlák bóven </head>, plak het script en klik onderaan op Bestand bijwerken (Update File).
  6. 6Werk je met Elementor, Divi, Astra of een child-theme? Ga dan naar Weergave → Aanpassen → Extra CSS/Head-code, of naar de thema-instelling 'Header scripts' / 'Custom code' en plak het script daar in het HEAD-veld.
  7. 7Geen toegang tot code? Installeer de plugin 'WPCode' of 'Insert Headers and Footers', ga naar Code Snippets → Header & Footer, plak het script in het vak Header en klik op Save.

Controleren of het werkt

  • • Open je website in een privévenster en bezoek twee pagina's.
  • • Ga in Roots naar Websites & pixel: bij je site verspringt 'Script geplaatst' binnen een minuut naar een groen vinkje.

Let op

  • • Plak het script niet in footer.php - click-ID's uit advertenties worden dan te laat gelezen.
  • • Cachingplugins (WP Rocket, LiteSpeed, W3 Total Cache) serveren de oude pagina: leeg de cache na het opslaan.

Bij een thema-update kan header.php overschreven worden. Gebruik daarom bij voorkeur een child-theme of de WPCode-plugin.

Shopify

± 5 minuten

Script in theme.liquid, plus optioneel een order-event op de bedankpagina voor de echte orderwaarde.

  1. 1Log in op admin.shopify.com en kies je winkel.
  2. 2Klik links onderin op Settings? Nee - ga in het linkermenu naar Online Store → Themes.
  3. 3Klik bij je actieve thema (bovenaan, met label 'Current theme') op de knop met de drie puntjes … → Edit code.
  4. 4Klik links in de bestandsboom op de map Layout en open theme.liquid.
  5. 5Zoek met Ctrl+F (Cmd+F) naar </head>, zet je cursor op de regel erboven en plak het script.
  6. 6Klik rechtsboven op Save. Het script staat nu op elke winkelpagina.
  7. 7Voor de orderwaarde: ga naar Settings → Checkout → scroll naar Order status page → Additional scripts en plak daar het script plus: srAttribution.track("purchase", { value: {{ checkout.total_price | divided_by: 100.0 }}, currency: "{{ shop.currency }}" }); Klik op Save.

Controleren of het werkt

  • • Open je webshop in een privévenster en klik door naar een productpagina.
  • • Plaats een testbestelling (of gebruik de testbetaling van Shopify) en controleer in Roots of het event 'purchase' met de juiste waarde binnenkomt.

Let op

  • • Bewerk het thema dat als 'Current theme' staat - anders zet je het script in een niet-actieve kopie.
  • • Werk je met Shopify Plus en checkout extensibility? Gebruik dan een Custom Pixel in Settings → Customer events in plaats van Additional scripts.

Magento / Adobe Commerce

± 5 minuten

Script via Content → Design → Configuration in de HTML Head van je storeview.

  1. 1Log in op je Magento-adminpaneel (meestal jouwdomein.nl/admin).
  2. 2Klik links in het menu op Content → onder 'Design' op Configuration.
  3. 3Je ziet nu een tabel met Default, Website en Store View. Klik bij de storeview waarvoor je wilt meten rechts op Edit.
  4. 4Klap de sectie HTML Head open (klik op de titel).
  5. 5Plak het script in het veld 'Scripts and Style Sheets' - onderaan bestaande regels, niet ertussen.
  6. 6Klik rechtsboven op Save Configuration.
  7. 7Ga naar System → Tools → Cache Management, vink Page Cache en Configuration aan, kies Refresh en klik op Submit.

Controleren of het werkt

  • • Open je storefront in een privévenster en klik naar een categoriepagina.
  • • Controleer in Roots bij Test je tracking of er pageviews binnenkomen.

Let op

  • • Bewerk je Default in plaats van de storeview, dan meet je ook testomgevingen mee.
  • • Vergeet de cache-refresh niet: zonder dat blijft de oude head-HTML uitgeleverd.

Webflow

± 2 minuten

Script in de site-brede custom code head van je project.

  1. 1Open je project in de Webflow Designer.
  2. 2Klik linksboven op het Webflow-logo → Site settings (of ga vanuit je dashboard naar het project → Settings).
  3. 3Klik bovenin op de tab Custom code.
  4. 4Plak het script in het bovenste vak: 'Head code' (staat boven 'Footer code').
  5. 5Klik rechtsboven op Save changes.
  6. 6Klik daarna rechtsboven op Publish → selecteer je domein(en) → Publish to selected domains.

Controleren of het werkt

  • • Open je gepubliceerde site (niet de .webflow.io preview in de Designer) en klik één pagina door.
  • • Verstuur een testformulier: Roots registreert form submits automatisch als conversie.

Let op

  • • Custom code werkt niet in de Designer-preview - je moet publiceren.
  • • Site-brede head code vereist een betaald Site plan.

Wix

± 3 minuten

Script als custom code op alle pagina's, geladen in de head.

  1. 1Ga naar manage.wix.com en kies je site.
  2. 2Klik links onderaan op Settings (Instellingen).
  3. 3Scroll naar het blok 'Advanced' en klik op Custom code.
  4. 4Klik rechtsboven bij 'Head' op + Add Custom Code.
  5. 5Plak het script in het grote codevak en geef het de naam 'Roots pixel'.
  6. 6Kies bij 'Add Code to Pages' de optie All pages en zet 'Load code on each new page' aan.
  7. 7Kies bij 'Place Code in' de optie Head en klik op Apply.
  8. 8Klik rechtsboven in de editor op Publish als je site nog wijzigingen heeft openstaan.

Controleren of het werkt

  • • Open je live site (jouwdomein.nl, niet de editorweergave) in een privévenster.
  • • Controleer in Roots of 'Script geplaatst' groen wordt.

Let op

  • • Custom code vereist een premium Wix-plan en een gekoppeld domein.
  • • Wix Studio? Daar zit custom code onder Settings → Custom code, verder identiek.

Squarespace

± 2 minuten

Script via code injection in de header van je site.

  1. 1Log in en open je site in de Squarespace-beheeromgeving.
  2. 2Klik in het linkermenu op Settings → Developer tools (bij versie 7.1: Website → Website tools).
  3. 3Klik op Code injection.
  4. 4Plak het script in het bovenste veld met de kop Header.
  5. 5Klik linksboven op Save.
  6. 6Heb je een webshop? Plak het script ook in het veld 'Order confirmation page' met srAttribution.track("purchase", { value: {orderGrandTotal} }).

Controleren of het werkt

  • • Open je site in een privévenster en bekijk twee pagina's.
  • • Vul een formulierblok in en check in Roots of de conversie verschijnt.

Let op

  • • Code injection is beschikbaar vanaf het Business-plan; op Personal werkt het niet.
  • • Code injection laadt niet in de Squarespace-editorweergave.

Eigen website of app

± 2 minuten

Script vlak voor de sluitende </head>-tag in je gedeelde template of layout.

  1. 1Open het bestand dat op elke pagina wordt geladen: index.html, base.html.twig, layout.blade.php, _document.tsx, app.html of je root-layoutcomponent.
  2. 2Plak het script als laatste regel vóór </head>, zodat click-ID's al bij de eerste render worden vastgelegd.
  3. 3Gebruik je React, Vue of Svelte met SSR? Zet het script in het HTML-template, niet in een component - zo laadt het ook op de eerste pageview.
  4. 4Commit en deploy je site.
  5. 5Eigen conversies stuur je met srAttribution.track("naam", { value: 89.5, currency: "EUR" }) op het moment dat de conversie slaagt.
  6. 6Server-side conversies (refunds, offline orders, telefonische boekingen) stuur je via de conversie-API met dezelfde pixelsleutel.

Controleren of het werkt

  • • Open je site en controleer in de netwerktab van je browser dat sr.js met status 200 laadt.
  • • Gebruik in Roots de pagina 'Test je tracking' om een testevent te sturen en de eventstroom live mee te kijken.

Let op

  • • Laad het script niet via een tag manager met consent-vertraging als je click-ID's wilt bewaren; plaats het direct in de head.
  • • Zet het script niet in een component die pas na hydration mount - de eerste pageview mis je dan.

Wat wordt automatisch gemeten?

Zodra het script op je site staat, meet Roots de belangrijkste conversies zonder dat je iets instelt. Alles wat een waarde nodig heeft, geef je mee met één extra attribuut op de knop, link of het formulier.

EventWanneerWaarde

Paginaweergave

pageview

Bij elke pagina die laadt. Hier worden ook de click-ID's (gclid, fbclid, ttclid, li_fat_id) en utm-parameters vastgelegd.

Geen waarde

Formulier verzonden

form_submit

Zodra een bezoeker een <form> op je site verstuurt. Werkt voor elk formulier, ook die van je thema of pagebuilder.

<form data-sr-event="offerte_aanvraag" data-sr-value="250" data-sr-currency="EUR"> … </form>
Geen waarde, tenzij je data-sr-value op het formulier zet.

Telefoonklik

phone_call

Klik op een link die begint met tel: - bijvoorbeeld <a href="tel:+31612345678">.

<a href="tel:+31612345678" data-sr-event="phone_call" data-sr-value="75">Bel ons</a>
Geen waarde. Wil je een gemiddelde waarde per belletje? Zet data-sr-value op de link.

E-mailklik (mailto)

email_click

Klik op een link die begint met mailto:.

<a href="mailto:info@jouwbedrijf.nl" data-sr-value="40">Mail ons</a>
Geen waarde, tenzij je die zelf meegeeft.

Elke knop of link met data-sr-event

eigen naam

Klik op een element met het attribuut data-sr-event. De waarde van dat attribuut wordt de eventnaam - bijvoorbeeld reservering, whatsapp of download.

<a href="/reserveren" data-sr-event="reservering" data-sr-value="45">Reserveer een tafel</a>
Optioneel via data-sr-value en data-sr-currency.

Waarde doorgeven met data-attributen

Je hoeft geen JavaScript te schrijven: zet de attributen rechtstreeks op het element. Roots leest ze bij de klik of de verzending uit.

data-sr-event

De naam van de conversie. Zet dit op een knop, link of formulier. Zonder dit attribuut heet een formulier form_submit.

data-sr-event="reservering"
data-sr-value

De waarde van de conversie in euro's. Gebruik een punt als decimaalteken, geen euroteken.

data-sr-value="89.95"
data-sr-currency

Valuta van de waarde. Laat je dit weg, dan rekent Roots met EUR.

data-sr-currency="EUR"
data-sr-ignore

Zet dit op een formulier dat je juist níét wilt meten, bijvoorbeeld een zoek- of filterformulier.

<form data-sr-ignore> … </form>

Waarde die pas bij het afrekenen bekend is

Bij een webshop staat de orderwaarde niet vooraf vast. Stuur die dan mee vanaf de bedankpagina - dan telt Roots de echte omzet per bron.

<!-- Bedankpagina van je webshop: echte orderwaarde meesturen -->
<script>
  srAttribution.track("purchase", {
    value: ORDER_TOTAL,   // vervang door de variabele van je shop
    currency: "EUR"
  });
</script>

Heb je geen bedrag, zoals bij een reservering of aanvraag? Stel dan per conversietype een vaste waarde in bij Conversies - bijvoorbeeld het gemiddelde besteedbedrag per couvert.