Hoe installeer je de agent op WordPress en WooCommerce

Drie manieren om code in WordPress te plaatsen, hoe de agent de WooCommerce-catalogus leest, wat te doen met caching-plugins en hoe je de chat aan de winkelwagen koppelt.

6 september 2026

Code invoegen in WordPress kan op drie manieren. De keuze hangt af van hoe vertrouwd u bent met het aanpassen van themabestanden.

Methode 1: Code-invoegplug-in (aanbevolen)#

De veiligste optie: de aanpassing gaat niet verloren bij een thema-update.

1. Installeer een willekeurige plug-in voor het invoegen van scripts: WPCode, Insert Headers and Footers, Code Snippets.
2. Open de instellingen van de plug-in en zoek het veld voor code in de footer — dit heet meestal Footer of Body (before closing tag).
3. Plak de regel uit het dashboard en sla op.

Methode 2: Themabestand#

1. “Weergave” → “Themabestandseditor”.
2. Open footer.php.
3. Voeg de code in vóór </body>.
4. Werk het bestand bij.

Belangrijk: bewerk een child-thema. Bij het updaten van het parent-thema wordt het bestand overschreven, inclusief uw code.

Methode 3: Via functions.php#

Voor degenen die meer vertrouwd zijn met code. In het functions.php van een child-thema:

add_action('wp_footer', function () {
echo '<script src="https://comag.vibevox.pro/widget.js" data-slug="uw-slug" async></script>';
});

De exacte scriptregel vindt u in het dashboard, via de knop “Code kopiëren”.

Catalogus uit WooCommerce#

Voer het websiteadres in de instellingen in en start de analyse. De crawler leest WooCommerce-producten via gestructureerde paginadata: naam, prijs, beschikbaarheid, beschrijving, foto's, categorieën.

Wat u moet weten:

• Variabele producten verschijnen in de productkaart met een prijsbereik en kenmerken.
• Verborgen en concepten worden niet gelezen — en zo hoort het.
• Producten alleen voor geautoriseerde gebruikers ziet de agent niet: hij navigeert de site als een gewone bezoeker.
• Als u een productexport in CSV heeft, kunt u deze uploaden in het gedeelte “Catalogus” — soms is dit sneller en nauwkeuriger dan crawlen.

Winkelwagen en betaling#

Bij WooCommerce wordt betaling in de chat meestal niet ingeschakeld: de winkel heeft een eigen kassa met verzending, belastingen en kortingsbonnen.

Geef in de instellingen de link naar de winkelwagen op, meestal https://uw-domein/cart of /winkelwagen. De agent begeleidt de koper daarheen.

Om te zien welke dialogen in bestellingen veranderen, voegt u een aankoop-pixelfragment toe aan de pagina “Bedankt voor uw bestelling”. In WooCommerce is dit het checkout/thankyou.php sjabloon of dezelfde code-invoegplug-in met een voorwaarde voor de bestelpagina.

Knop in chat voegt product toe aan WooCommerce-winkelwagen#

Productkaarten in de antwoorden van de agent zijn geen plaatjes voor de sier. Elk heeft een link naar de productpagina in uw winkel, en de agent kan gebruikmaken van het standaard WooCommerce-mechanisme voor toevoegen aan winkelwagen: een adres van het type ?add-to-cart=123.

De koper klikt op de knop in de chat, het product komt in de winkelwagen, waarna uw kassa met alle plug-ins voor verzending, kortingsbonnen en belastingen het overneemt. Hiervoor zijn geen integraties of sleutels nodig: het mechanisme is vanaf het begin ingebouwd in WooCommerce.

Als de link naar een variabele productpagina leidt, opent de agent deze — de koper moet zelf de maat en kleur kiezen, en dat is correct: een optie voor hem invullen is riskant.

Nog iets om te weten: de agent ziet de pagina waarop de chat is geopend. Hij leest de productopmaak — naam, SKU, prijs — en antwoordt in context. Een bezoeker staat op een productkaart en typt “is er iets goedkoper?” — de agent begrijpt waarmee te vergelijken en biedt een alternatief uit uw catalogus, geen abstract advies.

De belangrijkste reden dat “de widget niet verscheen” op WordPress is de cache. Na het invoegen van de code:

1. Leeg de plug-incache: WP Rocket, W3 Total Cache, LiteSpeed of wat u ook gebruikt.
2. Leeg de CDN-cache, als u Cloudflare gebruikt.
3. Controleer de website in incognitomodus.

Als in de plug-in “scripts samenvoegen en uitgesteld laden” is ingeschakeld, voeg dan ons script toe aan de uitzonderingen: het samenvoegen van externe scripts kan soms het laden verstoren.

Lichte en donkere modus#

De widget ondersteunt beide. In de instellingen kiest u voor een lichte modus, donkere modus of “zoals de bezoeker” — de laatste volgt de systeeminstellingen van het apparaat en is de standaard.

Dit is handig als uw WordPress-thema een dag- en nachtschakelaar heeft: laat het op “zoals de bezoeker” staan, en de chat komt overeen met wat de persoon al heeft gekozen.

Caching-plug-ins#

Controle#

• De chatknop verschijnt rechtsonder op elke pagina van de website.
• Een vraag over een product levert een productkaart met prijs op.
• De afrekenknop leidt naar de WooCommerce-winkelwagen.
• Op mobiel overlapt de knop het menu en de winkelwagen niet.

Veelgestelde vragen#

Is een aparte Commerce Agents-plug-in nodig#

Nee. Een enkele coderegel is voldoende; een aparte plug-in is niet vereist en wordt niet geïnstalleerd.

De widget verscheen niet, wat moet ik eerst controleren#

De cache: caching-plug-in en CDN. Controleer vervolgens of de code in de footer is geplaatst en niet in een willekeurige zijbalkwidget, en of het thema inderdaad wp_footer() uitvoert.

Weet de agent van kortingen en kortingsbonnen#

Van kortingsbonnen niet: deze worden toegepast in de WooCommerce-winkelwagen. De agent toont de prijzen die werden gevonden tijdens het crawlen, inclusief de kortingsprijs als deze op de productpagina wordt weergegeven.

Zal dit de website vertragen#

Het script is asynchroon, weegt weinig en blokkeert het renderen van de pagina niet. De invloed op PageSpeed is minimaal.

Kan de widget alleen in de winkel worden getoond, en niet in de blog#

Ja, als u de code invoegt via een plug-in met weergavevoorwaarden of in functions.php met een is_woocommerce()-controle. In het eenvoudige geval stoort de agent op alle pagina's niet: hij beantwoordt ook vragen over verzending vanuit de blog.