Μάθετε πώς να ενσωματώσετε το προσαρμοσμένο Chatbot σας στην ιστοσελίδα σας με ευκολία.

Η ενσωμάτωση του Chatbot Swiftron στην ιστοσελίδα σας είναι απλή και γρήγορη. Με μία μόνο φορά ενσωμάτωσης και χωρίς ανάγκη για συνεχιζόμενες αλλαγές, μπορείτε να ενισχύσετε την αλληλεπίδραση με τους πελάτες σας χωρίς προβλήματα. Ακολουθήστε αυτά τα εύκολα βήματα για να ξεκινήσετε:

Βήμα 1: Αντιγράψτε τον κώδικα ολοκλήρωσης

Πηγαίνετε στη Σελίδα Ενσωμάτωσης Swiftron και αντιγράψτε τον παρακάτω κώδικα:

<script async type="module" project-id="YOUR_PROJECT_ID" lang="auto" src="https://swiftron.eu/static/js/chatbot-boot.min.js"></script>
  • project-id: Αυτός είναι ο μοναδικός σας Αναγνωριστικός Κωδικός Έργου και θα συμπληρωθεί αυτόματα.
  • lang: Η γλώσσα στόχος για το chatbot σας. Μπορείτε να χρησιμοποιήσετε:
    • Οποιονδήποτε έγκυρο κωδικό γλώσσας από τους κωδικούς γλώσσας ISO 639 (π.χ., 'en' για Αγγλικά, 'de' για Γερμανικά).
    • 'auto', που επιλέγει τη γλώσσα με βάση τις ρυθμίσεις του προγράμματος περιήγησης του χρήστη.
    • 'site', που χρησιμοποιεί τη γλώσσα που καθορίζεται στην κεφαλίδα HTML της ιστοσελίδας. Αυτό διαβάζει την τιμή από document.documentElement.lang και ρυθμίζει τη γλώσσα του chatbot αναλόγως.

Βήμα 2: Επικόλλησε τον κώδικα στον ιστότοπό σου

Χρησιμοποιώντας έναν Δημιουργό Ιστοσελίδων:

Αν χρησιμοποιείτε κατασκευαστές ιστοσελίδων όπως το Jimdo, το WordPress ή το Squarespace, ακολουθήστε τις οδηγίες τους για να εισαγάγετε προσαρμοσμένο κώδικα:

Διαχείριση του δικού σας κώδικα:

Εισάγετε τον κωδικό ενσωμάτωσης που αντιγράψατε στο HTML κάθε σελίδας όπου θέλετε να εμφανίζεται το chatbot. Ακολουθεί ένα παράδειγμα:

<! DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Your Site</title>
  </head>
  <body>
    <div>Your Content</div>
  </body>
  <script async type="module" project-id="YOUR_PROJECT_ID" lang="auto" src="https://swiftron.eu/static/js/chatbot-boot.min.js"> </script>
</html>

Ρυθμίστε το κουμπί εναλλαγής chatbot (Προαιρετικό)

Εάν έχετε ήδη ένα υπάρχον κουτί επικοινωνίας ή θέλετε να δημιουργήσετε το δικό σας κουμπί για να ανοίξετε ή να κλείσετε το chatbot, μπορείτε εύκολα να το ενσωματώσετε προσθέτοντας το ID του στις ρυθμίσεις του 'Κουμπιού Εναλλαγής Chatbot' στη Σελίδα Ενσωμάτωσης Swiftron.

Παράδειγμα:

<button id="btn-toggle-chatbot">Το εικονίδιο του Chatbot σας</button>

Απλά ρυθμίστε το 'Κουμπί Εναλλαγής Chatbot' πεδίο στο ID του κουμπιού σας, π.χ. 'btn-toggle-chatbot'. Ο τύπος του κουμπιού μπορεί να είναι οτιδήποτε (π.χ., div, span). Δεν χρειάζεται να προσθέσετε κανένα JavaScript ή χειριστές γεγονότων; το chatbot Swiftron θα ανιχνεύσει αυτό το κουμπί αυτόματα και θα χειριστεί τη απαραίτητη λογική.

Εάν δεν βρεθεί κανένα στοιχείο με το παρεχόμενο ID ή εάν το πεδίο 'Κουμπί Εναλλαγής Chatbot' είναι κενό, το Swiftron θα δημιουργήσει το δικό του κουμπί εναλλαγής chatbot στον ιστότοπό σας.

Προσαρμογή Θέσης Chatbot (Προαιρετικό)

Μπορείτε να εμφανίσετε το chatbot σε ένα συγκεκριμένο στοιχείο καθορίζοντας το ID του στο 'Προσαρμογή Θέσης Chatbot' πεδίο στη Σελίδα Ενσωμάτωσης Swiftron. Το chatbot θα εμφανιστεί μέσα σε αυτό το στοιχείο και θα αντικαταστήσει οποιοδήποτε υπάρχον περιεχόμενο μέσα σε αυτό.

Σε αυτή την περίπτωση, δεν θα εμφανιστεί ή θα χρησιμοποιηθεί κανένα κουμπί εναλλαγής chatbot. Το chatbot θα είναι πάντα ορατό μέσα στο καθορισμένο στοιχείο και δεν μπορεί να ελαχιστοποιηθεί από τον χρήστη.