Hur du lägger till Asyntai AI-chattbot i WooCommerce

Steg-för-steg-guide för WooCommerce-butiker

Plattform:

Steg 1: Hämta din inbäddningskod

Gå först till din Asyntai-instrumentpanel och scrolla ner till avsnittet "Inbäddningskod". Kopiera din unika inbäddningskod som ser ut så här:

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

Obs! Koden ovan är bara ett exempel. Du måste kopiera din egen unika inbäddningskod från din instrumentpanel eftersom den innehåller ditt personliga widget-ID.

Steg 2: Använda ett plugin (rekommenderas)

Det enklaste sättet att lägga till chattboten i din WooCommerce-butik är att använda ett gratis header/footer-plugin:

Logga in på din WordPress Admin Dashboard
Gå till Tillägg → Lägg till nytt
Sök efter "Insert Headers and Footers" av WPCode (eller liknande tillägg)
Klicka på "Install Now" och sedan "Activate"
Gå till Kodavsnitt → Sidhuvud och sidfot (eller tilläggets inställningssida)
Klistra in din Asyntai-inbäddningskod i avsnittet "Sidfot"
Klicka på "Save Changes"

Tips: Att lägga till koden i sidfoten säkerställer att det laddas efter butikens innehåll, vilket är idealiskt för chattwidgetar och inte bromsar sidladdningen eller stör WooCommerce-funktionaliteten.

Alternativ: Använda temaanpassaren

Många WooCommerce-teman har inbyggda alternativ för att lägga till anpassade skript:

Gå till Utseende → Anpassa
Leta efter ett avsnitt som heter "Additional CSS/JS", "Custom Code" eller "Footer Scripts"
Klistra in din Asyntai-inbäddningskod i lämpligt fält
Klicka på "Publish" för att spara dina ändringar

Obs! Inte alla teman har det här alternativet. Om ditt tema inte innehåller anpassade skriptfält, använd plugin-metoden eller redigera temats functions.php-fil.

Alternativ: Redigera temafiler (functions.php)

För utvecklare eller de som är bekväma med att redigera temafiler:

Gå till Utseende → Temafilsredigerare
Välj ditt aktiva tema (eller helst ditt child-tema)
Öppna filen functions.php
Lägg till följande kod i slutet av filen:
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');
Ersätt YOUR_WIDGET_ID med ditt faktiska widget-ID
Klicka på "Update File"

Viktigt: Använd alltid ett undertema när du redigerar temafiler. Ändringar i föräldratemat förloras när du uppdaterar ditt tema. Om du inte är bekväm med att redigera kod, använd plugin-metoden istället.

Alternativ: WooCommerce-specifik hook

För att ladda chattboten endast på WooCommerce-sidor (butik, produkt, kundvagn, kassan):

Lägg till den här koden i temats functions.php-fil:
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');
Ersätt YOUR_WIDGET_ID med ditt faktiska widget-ID
Spara filen

Tips: Den här metoden är användbar om du bara vill att AI-chattboten ska visas på dina butikssidor för att hjälpa kunder med produkter och beställningar, snarare än på hela din webbplats.

Steg 3: Verifiera installationen

Efter att du har sparat dina ändringar, besök din WooCommerce-butik i en ny webbläsarflik eller ett inkognitofönster. Du bör se widgetknappen för chatten i det nedre högra hörnet. Klicka på den för att kontrollera att den öppnas och fungerar korrekt.

Ser du inte widgeten? Om du har ett caching-plugin installerat (som WP Super Cache, W3 Total Cache eller WP Rocket), rensa cachen först. Prova också att rensa webbläsarcachen eller visa sidan i ett inkognitofönster.