How to Add Asyntai AI Chatbot to SHOPLINE

Step-by-step guide for SHOPLINE stores

Πλατφόρμα:

Βήμα 1: Αποκτήστε τον Κωδικό Ενσωμάτωσής σας

Πρώτα, μεταβείτε στον Πίνακα Ελέγχου Asyntai και κάντε κύλιση προς τα κάτω στην ενότητα «Κωδικός Ενσωμάτωσης». Αντιγράψτε τον μοναδικό κωδικό ενσωμάτωσής σας που θα μοιάζει ως εξής:

<script>(function(){var l=function(){var s=document.createElement("script");s.src="https://widget.asyntai.com/static/js/chat-widget.js";s.async=true;s.setAttribute("data-asyntai-id","YOUR_WIDGET_ID");document.head.appendChild(s)};if(document.readyState==="complete"){l()}else{window.addEventListener("load",l)}})();</script>

Σημείωση: Ο παραπάνω κώδικας είναι απλώς ένα παράδειγμα. Πρέπει να αντιγράψετε τον δικό σας μοναδικό κωδικό ενσωμάτωσης από τον Πίνακα Ελέγχου σας, καθώς περιέχει το προσωπικό σας αναγνωριστικό widget.

Step 2: Open the Custom Code App

SHOPLINE adds custom scripts through its official Custom Code app. First, make sure the app is installed:

Log in to your SHOPLINE Admin panel
In the left-hand menu, click Apps
Look for Custom Code in your list of installed apps
If it is not installed yet, open the SHOPLINE App Store, search for Custom Code, and click Add app (it is free) to install it
Open the Custom Code app to reach its main page

Σημείωση: The Custom Code app is SHOPLINE's official tool for adding HTML, CSS, and JavaScript snippets to your storefront's header or footer. It is the recommended way to install a chat widget without editing theme files directly.

Step 3: Add Your Embed Code in the Footer

Now add the Asyntai script and set it to load in the footer on every page:

On the Custom Code app's main page, click Add code
In the Code name field, enter a descriptive name such as Asyntai Chatbot so you can find it later
Paste your Asyntai embed code into the code editor box
Under Display option (device targeting), choose Desktop and mobile so the chatbot appears everywhere
For the placement, select Footer (also shown as the Bottom insert position, which loads the code after the page content)
Under Page trigger, select all page types — such as Homepage, Product detail page, Cart, and Checkout — so the widget shows across your whole store
Click Add (or Save) to apply. The code takes effect immediately

<script>(function(){var l=function(){var s=document.createElement("script");s.src="https://widget.asyntai.com/static/js/chat-widget.js";s.async=true;s.setAttribute("data-asyntai-id","YOUR_WIDGET_ID");document.head.appendChild(s)};if(document.readyState==="complete"){l()}else{window.addEventListener("load",l)}})();</script>

Συμβουλή: Placing the code in the footer (bottom) ensures it loads after your store's content, which keeps page load fast and reliable. Selecting all page types adds the chatbot to every page of your SHOPLINE store automatically.

Σημαντικό: Remember to replace YOUR_WIDGET_ID with your own unique widget ID from your Asyntai Dashboard. Do not paste the example code as-is.

Βήμα 4: Επαλήθευση Εγκατάστασης

After saving, open your SHOPLINE store in a new browser tab or incognito window. You should see the chat widget button in the bottom right corner. Click it to ensure it opens and functions correctly.

Δεν βλέπετε το widget; Make sure you saved the code in the Custom Code app and that it is enabled. Confirm the Footer placement and that all page types are selected. Clear your browser cache or view in incognito mode, since SHOPLINE may cache pages for a few minutes. Check the browser console (F12) for any JavaScript errors.

Χρειάζεστε Βοήθεια;

If you're not comfortable using the Custom Code app, SHOPLINE's Customer Support team can assist with adding custom scripts to your store. You can also contact Asyntai support for guidance on installing the chatbot on your SHOPLINE store.