Hoe voegt u de Asyntai AI Chatbot toe aan WooCommerce

Stap-voor-stap handleiding voor WooCommerce-winkels

Platform:

Stap 1: Uw insluitcode ophalen

Ga eerst naar uw Asyntai Dashboard en scroll naar het gedeelte "Insluitcode". Kopieer uw unieke insluitcode die er als volgt uitziet:

<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>

Opmerking: De bovenstaande code is slechts een voorbeeld. U moet uw eigen unieke insluitcode kopiëren vanuit uw Dashboard omdat deze uw persoonlijke widget-ID bevat.

Stap 2: Een plugin gebruiken (aanbevolen)

De eenvoudigste manier om de chatbot aan uw WooCommerce-winkel toe te voegen is met een gratis header/footer-plugin:

Log in op uw WordPress Admin Dashboard
Ga naar Plugins → Add New
Zoek naar "Insert Headers and Footers" van WPCode (of een vergelijkbare plugin)
Klik op "Install Now" en vervolgens op \"Activate"
Ga naar Code Snippets → Header & Footer (of de instellingenpagina van de plugin)
Plak uw Asyntai-insluitcode in het gedeelte "Footer"
Klik op "Save Changes"

Tip: Het toevoegen van de code aan de footer zorgt ervoor dat deze wordt geladen na de inhoud van uw winkel, wat ideaal is voor chatwidgets en uw pagina niet vertraagt of interfereert met WooCommerce-functionaliteit.

Alternatief: Theme Customizer gebruiken

Veel WooCommerce-thema's hebben ingebouwde opties voor het toevoegen van aangepaste scripts:

Ga naar Appearance → Customize
Zoek een gedeelte met de naam "Additional CSS/JS", "Custom Code" of "Footer Scripts"
Plak uw Asyntai-insluitcode in het juiste veld
Klik op "Publish" om uw wijzigingen op te slaan

Opmerking: Niet alle thema's hebben deze optie. Als uw thema geen aangepaste scriptvelden bevat, gebruik dan de pluginmethode of bewerk het functions.php-bestand van uw thema.

Alternatief: Themabestanden bewerken (functions.php)

For developers or those comfortable editing theme files:

Ga naar Appearance → Theme File Editor
Selecteer uw actieve thema (of bij voorkeur uw child-thema)
Open het functions.php-bestand
Voeg de volgende code toe aan het einde van het bestand:
function add_asyntai_chatbot() { echo '<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>'; } add_action('wp_footer', 'add_asyntai_chatbot');
Vervang YOUR_WIDGET_ID door uw werkelijke widget-ID
Klik op "Update File"

Belangrijk: Gebruik altijd een child-thema bij het bewerken van themabestanden. Wijzigingen aan het bovenliggende thema gaan verloren wanneer u uw thema bijwerkt. Als u zich niet op uw gemak voelt bij het bewerken van code, gebruik dan in plaats daarvan de pluginmethode.

Alternatief: WooCommerce-specifieke hook

Om de chatbot alleen op WooCommerce-pagina's te laden (winkel, product, winkelwagen, afrekenen):

Add this code to your theme's functions.php file:
function add_asyntai_chatbot_woocommerce() { if (is_woocommerce() || is_cart() || is_checkout() || is_account_page()) { echo '<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>'; } } add_action('wp_footer', 'add_asyntai_chatbot_woocommerce');
Vervang YOUR_WIDGET_ID door uw werkelijke widget-ID
Sla het bestand op

Tip: Deze methode is handig als u de AI-chatbot alleen op uw winkelpagina's wilt laten verschijnen om klanten te helpen met producten en bestellingen, in plaats van op uw volledige website.

Stap 3: Installatie verifiëren

Open na het opslaan van uw wijzigingen uw WooCommerce-winkel in een nieuw browsertabblad of incognitovenster. U zou de chatwidgetknop rechtsonder moeten zien. Klik erop om te controleren of deze correct opent en werkt.

Ziet u de widget niet? Als u een cacheplugin hebt geïnstalleerd (zoals WP Super Cache, W3 Total Cache of WP Rocket), wis dan eerst uw cache. Probeer ook uw browsercache te wissen of bekijk de pagina in een incognitovenster.