WooCommerce voor de websitebouwer

Concept. Deze pagina is een eerste versie en wordt nog aangevuld.

Op deze pagina

Deze pagina is voor wie de WooCommerce-site bouwt of onderhoudt. De eigenaar koppelt de webshop aan Qontivo (zie WooCommerce koppelen voor verhuur); jij zorgt dat Qontivo de huurperiode in een order kan lezen, en dat de boekingskalender alleen vrije data aanbiedt. Er is geen WordPress-plug-in nodig, en Qontivo gaat niet uit van een bepaalde kalender.

De huurperiode in een order

Qontivo leest per orderregel wanneer het gehuurde begint en eindigt. Sla die twee waarden op als metavelden van de orderregel (woocommerce_add_order_item_meta, of $item->add_meta_data() in woocommerce_checkout_create_order_line_item). Staat de periode voor de hele order gelijk, dan mag het ook als metaveld van de order zelf.

add_action('woocommerce_checkout_create_order_line_item', function ($item, $cart_item_key, $values) {
    if (! empty($values['huur_van'])) {
        $item->add_meta_data('_huur_van', $values['huur_van']);  // 2026-11-07 of 2026-11-07 08:00
        $item->add_meta_data('_huur_tot', $values['huur_tot']);  // 2026-11-08 of 2026-11-08 17:00
    }
}, 10, 3);
  • Gebruikte namen geef je door aan de eigenaar; die vult ze in bij Qontivo (bijvoorbeeld _huur_van en _huur_tot).
  • Toegestane vormen: 2026-11-07, 07-11-2026, 07/11/2026, 2026-11-07 08:00 of 2026-11-07T08:00. Zonder tijd rekent Qontivo van 08:00 tot 17:00 (Nederlandse tijd).
  • Het artikelnummer (SKU) van het product moet gelijk zijn aan dat van het verhuurobject of de categorie in Qontivo, of de eigenaar koppelt het product met de hand.
  • Regels zonder periode en zonder koppeling (zoals transport of een toeslag) slaat Qontivo over.

Controleer het daarna samen met de eigenaar: in Qontivo haalt hij bij Integraties → WooCommerce een recente order op en ziet precies welke velden er zijn en wat Qontivo eruit leest.

Live beschikbaarheid in de kalender

Qontivo heeft een kleine API die per artikelnummer en periode zegt of iets vrij is. Meer niet: nooit klantgegevens, nooit prijzen. De eigenaar maakt de sleutel bij Integraties → WooCommerce → Sleutel maken en geeft hem aan jou.

Het script

Zet dit op de productpagina (of in de footer van de shop):

<script src="https://BEDRIJF.qontivo.com/js/qontivo-beschikbaarheid.js" data-sleutel="qb_..." defer></script>

BEDRIJF is het subdomein van de omgeving van de eigenaar. Het script maakt één functie beschikbaar:

const antwoord = await Qontivo.beschikbaarheid('VH-MG1', '2026-11-07', '2026-11-08');

if (antwoord.beschikbaar) {
    // datum kiesbaar maken
} else {
    // datum uitgrijzen; antwoord.fout zegt waarom, als er iets misging
}
  • Argumenten: het artikelnummer, de begindatum en (optioneel) de einddatum, in dezelfde vormen als hierboven.
  • Het antwoord: { beschikbaar: true } of { beschikbaar: false }, met bij een fout ook fout. Bij geen verbinding, een onbekend artikelnummer of te veel vragen is het antwoord beschikbaar: false: liever niet boekbaar dan dubbel geboekt.
  • Het script onthoudt antwoorden zolang de pagina open is; vraag gerust dezelfde periode vaker.

Voorbeeld: een maand in een kalender

async function vrijeDagen(sku, jaar, maand) {
    const dagen = new Date(jaar, maand, 0).getDate();
    const vragen = [];

    for (let dag = 1; dag <= dagen; dag++) {
        const datum = `${jaar}-${String(maand).padStart(2, '0')}-${String(dag).padStart(2, '0')}`;
        vragen.push(Qontivo.beschikbaarheid(sku, datum).then((a) => [datum, a.beschikbaar]));
    }

    return Object.fromEntries(await Promise.all(vragen));
}

Vraag bij het kiezen van een periode altijd nog één keer de hele periode na (begin en einde samen), vlak voor het toevoegen aan de winkelwagen.

De API zonder het script

GET https://BEDRIJF.qontivo.com/api/beschikbaarheid?sku=VH-MG1&van=2026-11-07&tot=2026-11-08
X-Qontivo-Key: qb_...

Antwoord:

{ "sku": "VH-MG1", "van": "2026-11-07T08:00:00+01:00", "tot": "2026-11-08T17:00:00+01:00", "beschikbaar": true }
  • CORS: alleen het domein van de webshop (of het domein dat de eigenaar invult bij Domein dat mag vragen) mag de API vanuit een browser lezen.
  • Limiet: 60 vragen per minuut per bezoeker, en 600 per minuut voor de hele shop. Daarboven antwoordt de API met 429.
  • Fouten: 404 voor een onbekende sleutel of een onbekend artikelnummer, 422 voor een ontbrekende of onleesbare datum.

Testen

  1. Laat de eigenaar een product koppelen en de sleutel maken.
  2. Open de productpagina en roep in de console van de browser await Qontivo.beschikbaarheid('SKU', '2026-11-07') aan. Je krijgt beschikbaar: true of false.
  3. Plaats een testorder met een periode. In Qontivo verschijnt binnen enkele seconden een reservering, en op de order in WooCommerce een notitie met het reserveringsnummer.
  4. Vraag dezelfde periode opnieuw na: nu is het antwoord beschikbaar: false.
  5. Annuleer de testorder in WooCommerce: de reservering in Qontivo wordt geannuleerd en de periode is weer vrij.

Goed om te weten

  • De beschikbaarheid in Qontivo is leidend. Ook als je kalender een datum toch toelaat, maakt Qontivo bij een bezet object geen reservering maar een aanvraag, en zet het de order in de wacht.
  • De sleutel staat zichtbaar in de pagina; daarom geeft de API alleen vrij of bezet, en kan de eigenaar de sleutel altijd vervangen.

Lees ook