Technische Documentatie
Bouw en integreer rekenmodules, beheer leads in je pipeline en zet slimme automatiseringen op.
Introductie
Welkom bij de officiële documentatie van Reuzenpanda.nl.
Welkom bij de Reuzenpanda documentatie! Reuzenpanda is gemaakt door en voor internetondernemers. Met een super eenvoudige plug & play koppeling, kan jij jouw producten in een handomdraai aanbieden op jouw website of landingspagina. Allemaal zodat jij zonder technische kennis beter gaat scoren en meer klanten binnenhaalt.
Reuzenpanda biedt een breed scala aan features om jouw salesprocessen en klantbeheer volledig te automatiseren:
- Multi-step Formulieren: Converteer tot 300% meer leads door de juiste vragen te stellen in een stap-voor-stap rekenmodule.
- CRM & Pipeline: Visualiseer je salesproces, beheer je leads en maak interne notities.
- Documenten Editor: Maak offertes, facturen en contracten met onze gebruiksvriendelijke drag-and-drop documenten editor.
- Automatiseringen: Gebruiksvriendelijke workflows die automatisch acties uitvoeren op basis van triggers.
Website Integratie & Installatie
Leer hoe je formulieren publiceert en de Reuzenpanda widget activeert op jouw website.
Volg deze stappen in de Reuzenpanda Hub om een formulier op je website te publiceren:
- 1
Open het formulierenoverzicht
Ga in de navigatie naar Formulieren (`/app/forms`).
- 2
Stel je domeinnaam in
Voer je domein in (bijv.
www.reuzenpanda.nlofreuzenpanda.nl). Belangrijk: gebruik geenhttps://. - 3
Kies integratiemethode
Selecteer Embedded (Aanbevolen) om een HTML-code voor de `<head>` en `<body>` van je pagina te ontvangen.
style="height: 500px" naar style="height: 800px" of 80vh.Je kunt de Reuzenpanda widget openen en besturen door speciale anker-links toe te voegen aan knoppen of tekstlinks op je website:
- Open alle formulieren:
Gebruik de link#reuzenpanda-open-allom de widget te triggeren.<a href="#reuzenpanda-open-all">Open Rekenmodules</a> - Open een specifiek formulier:
Gebruik#reuzenpanda-open-{ID}, waarbij je{ID}vervangt door het exacte Formulier ID uit je Hub.<a href="#reuzenpanda-open-12ea85e2">Open Dakkapel Configurator</a>
Reuzenpanda integreert naadloos met alle populaire CMS-platforms. Plaats de <head> code in de pagina-instellingen en de <body> code in een HTML/Custom Code blok van je paginabouwer (zoals Elementor, Divi of Gutenberg voor WordPress, of Shopify Liquid).
Let op: controleer of er caching- of optimalisatiesoftware actief is die JavaScript-bestanden minimaliseert of vertraagt, aangezien dit de werking van de rekenmodule kan beïnvloeden.
Multi-step Formulieren
Ontdek hoe je krachtige stap-voor-stap formulieren en rekenmodules bouwt om de conversie van leads te maximaliseren.
Een Multi-step Formulier splitst lange, invoer-intensieve formulieren op in hapklare, thematische stappen. Dit verlaagt de drempel voor de bezoeker aanzienlijk. In plaats van 15 vragen in één keer te zien, beantwoordt de bezoeker steeds 1 tot 3 gerichte vragen per stap.
Met de Reuzenpanda visual builder sleep je eenvoudig vragen, invoervelden en stappen in elkaar. Je kunt directe prijsberekeningen koppelen aan de keuzes die je bezoeker maakt, zodat ze direct een prijsindicatie of een geautomatiseerde offerte ontvangen.
Volg deze stappen in de Reuzenpanda Hub om je eerste rekenmodule of lead-formulier te ontwerpen:
- 1
Nieuw formulier aanmaken
Ga in de linkernavigatie naar Formulieren en klik rechtsboven op Nieuw formulier. Geef je formulier een duidelijke naam (bijv. 'Offerteaanvraag Dakkapel').
- 2
Stappen en vragen toevoegen
Gebruik de visual builder om stappen toe te voegen. Sleep vraagtypes zoals meerkeuzevragen, tekstvelden, getallen invoer of bestandsuploads in de gewenste stap.
Dankzij Conditionele Logica (Show/Hide) toon je alleen relevante vragen aan de bezoeker. Dit voorkomt dat gebruikers irrelevante vragen moeten overslaan en verhoogt je conversie.
Logica instellen in de editor:
Selecteer de stap of het invoerveld dat je conditioneel wilt maken. Klik in de rechter zijbalk op het tabblad Logica. Voeg een regel toe:
Toon deze stap ALS [Vraag 1: Type schutting] IS GELIJK AAN [Hout]
Nadat een bezoeker het formulier heeft ingevuld, wil je dat de gegevens direct op de juiste plek in je CRM terechtkomen. Dit noemen we field mapping.
In het tabblad Integraties van het formulier kun je de ingevulde velden mappen naar CRM-velden:
- Naam → CRM Contact: Volledige Naam
- E-mailadres → CRM Contact: E-mail
- Telefoonnummer → CRM Contact: Telefoon
- Totale calculatieprijs → CRM Deal: Waarde
Snippet integreren op je website:
Wanneer je formulier klaar is, genereert Reuzenpanda een snippet-code. Kopieer en plak deze in je website (bijvoorbeeld in WordPress of Webflow):
<!-- Reuzenpanda Multi-step Formulier Snippet --> <div id="reuzenpanda-form-container" data-form-id="12ea85e2-1130-4d47-a16c"></div> <script src="https://snippet.reuzenpanda.nl/api/v1/loader.js" async></script>CRM & Pipeline
Beheer al je klantrelaties op een overzichtelijke manier, vanaf het eerste contact tot de deal-waarde.
Met de CRM-module van Reuzenpanda kun je op een overzichtelijke manier al je klantrelaties beheren, vanaf het eerste contactmoment tot en met de uiteindelijke verkoop.
Alles draait hierbij om twee centrale onderdelen: **Leads** en **Deals**. Op deze manier zie je heel makkelijk in welke fase een potentiële klant zich bevindt en wat de volgende stap is.
Wanneer een formulier of rekenmodule op je website wordt ingevuld, stroomt deze direct in als een **Lead**. Hierin worden alle contactgegevens en specifieke configurator-keuzes opgeslagen.
Zodra je contact hebt opgenomen en de lead kwalificeert voor een offerte, kun je deze converteren naar een **Deal**. Deals worden gevisualiseerd in je sales pipeline, waar je offertes kunt opstellen, e-mails kunt bijhouden en contracten kunt laten ondertekenen.
Automatiseringen
Koppel triggers en acties aan elkaar om handmatig werk te elimineren.
De Automatiseringen Module van Reuzenpanda biedt een manier om repetitieve taken te automatiseren binnen je bedrijfsprocessen. Hiermee kun je workflows creëren die acties uitvoeren op basis van bepaalde triggers en voorwaarden.
Een automatisering bestaat uit drie onderdelen:
- Trigger: De gebeurtenis die de flow start (bijv. Nieuwe formulierinvoering of Deal status gewijzigd).
- Voorwaarde: Criteria waaraan voldaan moet worden (bijv. Alleen uitvoeren als de branche 'Dakkapellen' is).
- Actie: De taak die automatisch wordt uitgevoerd (bijv. Verstuur een e-mail, maak een PDF offerte aan, of verstuur een WhatsApp-bericht).
API Referentie & Webhooks
Koppel Reuzenpanda in real-time aan je eigen backend, ERP of tools zoals Zapier.
De REST API biedt endpoints om contacten, offertes, facturen en pipelines programmatisch te beheren. Authenticatie verloopt via een Bearer Token die je in de headers meestuurt.
Authorization: Bearer rp_live_xxxxxxxxxxxxxxxxxxxxxxxxGebruik webhooks om real-time event updates naar jouw server te sturen. Configureer webhooks voor events zoals:
contact.created: Gestart bij een nieuwe leadregistratie.invoice.paid: Wanneer een factuur met succes is betaald.quotation.accepted: Zodra de klant een offerte digitaal accordeert.
URL Parameter Tracking
Meet de effectiviteit van je marketing. Leer hoe je parameters ophaalt uit de URL om deze automatisch mee te sturen met je aanvragen.
Zonder tracking is marketing sturen op gevoel. Je hebt data nodig om te weten welke campagne leads oplevert. In deze documentatie leggen we uit hoe je parameters ophaalt uit de URL om deze automatisch mee te sturen met je aanvragen. Hierdoor zie je exact de stappen die we doorlopen om dit uit te lezen.
Stap 0: ID's Achterhalen
Voordat je begint, heb je de onderstaande twee ID's nodig om de tracking correct te configureren.
- BedrijfsID (Account)
Dit ID is gekoppeld aan je gehele omgeving en vind je in je instellingen.- Klik op je Profielfoto rechtsboven.
- Selecteer Bedrijfsinstellingen.
- Klik op je Bedrijfsnaam om het ID te kopiëren.
- FormulierID (Formulier)
Dit is de unieke code van het specifieke formulier waar je aan werkt. Je vindt dit ID:- Bij het Publiceren van je formulier.
- In de URL van de editor.
- Aan het eind van de Landingspagina URL.
Gebruik deze methode als het formulier op je eigen domein staat.
Stap 1: De Code Implementatie
Plaats onderstaande code in de <head> van je pagina. Vervang BEDRIJFS_ID en FORMULIER_ID door je eigen unieke codes.
<script>
// 1. Laden van de Reuzenpanda snippet
(function() {
const load = () => {
var e = window.location.hostname;
var a = document.createElement("script");
a.src = "https://snippet.reuzenpanda.nl/api/snippet/v1/js/BEDRIJFS_ID/" + e, document.head.appendChild(a)
};
"loading" === document.readyState ? document.addEventListener("DOMContentLoaded", async function(e) { load() }) : load();
})();
// 2. Parameters verzamelen uit de URL
function getUrlParams() {
const params = new URLSearchParams(window.location.search);
return {
gclid: params.get("gclid"),
fbclid: params.get("fbclid"),
gbraid: params.get("gbraid"),
wbraid: params.get("wbraid"),
utm_source: params.get("utm_source")
};
}
// 3. Data naar het iframe sturen via postMessage
function sendPrefillToIframe(iframe, data) {
if (!iframe.contentWindow) return;
iframe.contentWindow.postMessage({ id: "prefill", data }, "https://directsamenstellen.nl");
}
function waitForIframesAndSend(data) {
let attempts = 0;
const interval = setInterval(() => {
const iframes = document.querySelectorAll('iframe[src*="directsamenstellen.nl"]');
if (iframes.length > 0) {
iframes.forEach(iframe => sendPrefillToIframe(iframe, data));
}
if (++attempts >= 10) clearInterval(interval);
}, 1000);
}
document.addEventListener("DOMContentLoaded", () => {
const data = getUrlParams();
if (!data.gclid && !data.fbclid && !data.gbraid && !data.wbraid && !data.utm_source) return;
waitForIframesAndSend(data);
});
</script>
<div style="height: 80svh" data-rp-configurator-id="FORMULIER_ID"></div>De lijst in de functie
getUrlParams is een voorbeeld. Je kunt hier eenvoudig parameters aan toevoegen (zoals utm_content) of weghalen. Let op: Als je een parameter toevoegt, moet je deze ook toevoegen aan de check in de DOMContentLoaded listener (if (!data.gclid && ...)), anders wordt de data niet verzonden als alleen die nieuwe parameter aanwezig is.Stap 2: De Editor instellen
De data komt alleen in je dashboard terecht als het formulier weet waar het de data moet laten.
- Voeg op pagina 1 een Korte tekstvraag toe.
- Cruciaal: De Naam van de vraag moet exact gelijk zijn aan de naam in de code (bijv.
gbraid). - Zet Vraag verbergen op 'ja'.
- Zet Verplicht op 'nee'.
- Herhaal deze stap voor iedere parameter die je wilt meesturen (bijv.
gclid,utm_source, etc.).
De URL voor een directe landingspagina wordt opgebouwd met de prefix pf_ voor elke parameter. Dit zorgt ervoor dat het formulier de data herkent en in de juiste velden plaatst.
1. De Structuur (Basis Formaat)
https://directsamenstellen.nl/FORMULIER_ID?pf_PARAMETER=WAARDE2. Stappenplan
- Basis-URL: Gebruik
https://directsamenstellen.nl/gevolgd door het unieke ID van het formulier. - Prefix: Plaats
pf_voor de naam van elke parameter die je wilt opslaan. - Scheiding: Gebruik een vraagteken
?voor de eerste parameter en een ampersand&voor elke volgende parameter.
3. Live Voorbeeld
https://directsamenstellen.nl/FORMULIER_ID?pf_gclid=abc123&pf_utm_source=googleGebruik de bovenstaande structuur om te zien hoe de parameters worden opgevangen door het formulier. Verander de waardes na de = in de URL-balk om het effect direct te testen.
4. Koppeling met de editor
In de editor moet een verborgen veld aanwezig zijn op de eerste pagina.
- De Naam van de vraag moet exact overeenkomen met de parameter, maar zonder de
pf_prefix. - Voor bovenstaand voorbeeld gebruik je dus de namen
gclidenutm_source.
AI Agents Nieuw
Zet slimme assistenten in die 24/7 vragen beantwoorden en acties uitvoeren.
AI Agents binnen Reuzenpanda zijn intelligente chatbots en virtuele assistenten die zijn ontworpen om jouw bedrijfsprocessen te automatiseren en te versnellen. Ze kunnen automatisch reageren op inkomende leads via WhatsApp en e-mail, antwoorden geven op basis van jouw eigen documentatie of website-inhoud, en direct afspraken inplannen in je agenda.
- 24/7 bereikbaarheid: Directe opvolging van leads, ook 's nachts en in het weekend.
- WhatsApp Appointment Setters: De agent kwalificeert de lead via WhatsApp en stuurt direct een link om een afspraak in te plannen.
- Kennisbank integratie: Geef de agent toegang tot jouw specifieke documenten, tarieven en Q&A om accurate antwoorden te garanderen.
Volg deze stappen om jouw eerste AI Agent in te richten:
- Navigeer in je dashboard naar AI Agents en klik op Nieuwe Agent maken.
- Bepaal de rol & instructies (System Prompt): Schrijf de richtlijnen voor hoe de AI Agent zich moet gedragen (bijv. "Je bent een vriendelijke planner voor Dakdekkersbedrijf X. Vraag altijd eerst naar de postcode...").
- Voeg Kennisbronnen toe: Upload PDF's of voer website-URL's in waar de agent informatie vandaan mag halen.
- Koppel kanalen en triggers: Selecteer op welke kanalen de agent actief moet zijn (bijvoorbeeld WhatsApp of Live Chat) en bij welke trigger de agent het gesprek moet starten (bijvoorbeeld "Nieuwe lead via offerteformulier").
Gesprekken
Beheer al je inkomende en uitgaande communicatie centraal op één plek.
De module Gesprekken brengt al jouw kanalen samen in één overzichtelijke inbox. Of een klant nu reageert via e-mail, WhatsApp, SMS of de live chat op je website: elk bericht komt binnen in dezelfde tijdlijn.
Hierdoor kan jouw team snel schakelen en hoef je niet constant te wisselen tussen verschillende tabbladen of telefoons. Het hele gesprek met de klant is chronologisch zichtbaar, inclusief automatisch verstuurde offertes en notificaties.
Om te starten met gesprekken, koppel je de communicatiekanalen van jouw bedrijf:
- WhatsApp Business API: Koppel je zakelijke telefoonnummer voor officiële WhatsApp-integratie.
- E-mail (SMTP/IMAP): Koppel je eigen e-mailadres (zoals info@jouwbedrijf.nl) om direct e-mails te verzenden en ontvangen in de tijdlijn.
- Website Live Chat: Activeer de chat-widget op je website om direct met bezoekers in contact te komen.
Hulp nodig bij de inrichting?
Wil je een complexe rekenmodule bouwen met geavanceerde wiskundige formules en conditionele logica? Raadpleeg ons Hulpcentrum of neem contact op met onze implementatie experts.