Πώς να Προσθέσετε το Asyntai AI Chatbot στο October CMS

Οδηγός βήμα προς βήμα για ιστότοπους October CMS

Πλατφόρμα:

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

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

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

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

Βήμα 2: Προσθήκη στο Πρότυπο Layout (Συνιστάται)

Ο συνιστώμενος τρόπος για να προσθέσετε το chatbot είναι επεξεργαζόμενοι το προεπιλεγμένο layout σας στο backend του October CMS:

Συνδεθείτε στο backend του October CMS
Μεταβείτε στο CMS > Layouts στο κύριο μενού
Ανοίξτε το προεπιλεγμένο layout σας (συνήθως default.htm)
Βρείτε το κλείσιμο </body> ετικέτα και το {% scripts %} placeholder
Προσθέστε τον κώδικα ενσωμάτωσης Asyntai ακριβώς πριν {% scripts %} και </body>:
<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script> {% scripts %} </body>
Κάντε κλικ στο "Save" για να εφαρμόσετε τις αλλαγές

Συμβουλή: Placing the script before {% scripts %} and </body> ensures it loads after the page content, which is recommended for chat widgets and won't slow down your page loading.

Alternative Method 1: Using {% put scripts %} Block

Μπορείτε να χρησιμοποιήσετε το placeholder σεναρίων του October CMS για να εισάγετε το chatbot από μια σελίδα ή partial:

Ανοίξτε οποιαδήποτε σελίδα ή partial στον επεξεργαστή CMS
Προσθέστε τον ακόλουθο κώδικα χρησιμοποιώντας το {% put scripts %} μπλοκ:
{% put scripts %} <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script> {% endput %}
Αντικαταστήστε το YOUR_WIDGET_ID με το πραγματικό widget ID από τον πίνακα ελέγχου
Κάντε κλικ στο «Αποθήκευση»

Σημείωση: For this method to work, your layout must include the {% scripts %} placeholder in its markup. This is where October CMS renders all injected scripts. Most default layouts already include this tag.

Εναλλακτική Μέθοδος 2: Χρήση Component PHP

Αν προτιμάτε μια προγραμματική προσέγγιση, μπορείτε να προσθέσετε το σενάριο chatbot μέσω ενός προσαρμοσμένου component:

Δημιουργήστε ή τροποποιήστε ένα component στο plugin October CMS σας
Στη μέθοδο onRun() του component, χρησιμοποιήστε τη μέθοδο addJs():
public function onRun() { $this->addJs('https://asyntai.com/static/js/chat-widget.js', [ 'async' => true, 'data-asyntai-id' => 'YOUR_WIDGET_ID' ]); }
Αντικαταστήστε το YOUR_WIDGET_ID με το πραγματικό widget ID σας
Καταχωρίστε το component στις σελίδες όπου θέλετε να εμφανίζεται το chatbot

Συμβουλή: Η χρήση ενός component σας δίνει προγραμματικό έλεγχο για το πότε και πού φορτώνεται το chatbot. Μπορείτε να προσθέσετε λογική συνθηκών εντός onRun() για να ελέγχετε τη φόρτωση με βάση ρόλους χρηστών, τύπους σελίδων ή άλλα κριτήρια.

Εναλλακτική Μέθοδος 3: Χρήση Partial

Για καλύτερη οργάνωση, μπορείτε να δημιουργήσετε ένα επαναχρησιμοποιήσιμο partial για το chatbot:

Μεταβείτε στο CMS > Partials στο backend του October CMS
Κάντε κλικ στο \"+ Add\" για να δημιουργήσετε ένα νέο partial
Ονομάστε το asyntai-widget.htm
Προσθέστε τον κώδικα ενσωμάτωσης Asyntai στο partial:
<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
Κάντε κλικ στο «Αποθήκευση»
Ανοίξτε το πρότυπο layout σας και συμπεριλάβετε το partial πριν το </body>:
{% partial 'asyntai-widget' %}
Αποθηκεύστε το layout

Συμβουλή: Η χρήση ενός partial διευκολύνει την ενεργοποίηση ή απενεργοποίηση του chatbot σε όλον τον ιστότοπό σας απλώς προσθέτοντας ή αφαιρώντας τη συμπερίληψη partial από το layout σας.

Βήμα 3: Επαληθεύστε την Εγκατάσταση

Αφού αποθηκεύσετε τις αλλαγές σας, επισκεφτείτε τον ιστότοπο October CMS σας σε μια νέα καρτέλα ή παράθυρο ανώνυμης περιήγησης. Θα πρέπει να δείτε το κουμπί της γραφικής εφαρμογής συνομιλίας στην κάτω δεξιά γωνία. Κάντε κλικ για να βεβαιωθείτε ότι ανοίγει και λειτουργεί σωστά.

Δεν βλέπετε το widget; Βεβαιωθείτε ότι αποθηκεύσατε όλες τις αλλαγές στο backend του CMS. Εκκαθαρίστε την κρυφή μνήμη του προγράμματος περιήγησης ή δείτε σε παράθυρο ανώνυμης περιήγησης. Αν ο ιστότοπός σας χρησιμοποιεί κρυφή μνήμη, εκκαθαρίστε την κρυφή μνήμη October CMS εκτελώντας php artisan cache:clear από τη γραμμή εντολών, ή χρησιμοποιήστε την επιλογή Settings > System > Clear Cache στο backend.

Επιλογή Layout: Βεβαιωθείτε ότι οι σελίδες όπου θέλετε να εμφανίζεται το chatbot χρησιμοποιούν το σωστό layout. Μπορείτε να ελέγξετε ποιο layout χρησιμοποιεί μια σελίδα ανοίγοντας τη σελίδα στο CMS > Pages και κοιτάζοντας το αναπτυσσόμενο μενού Layout στις ρυθμίσεις σελίδας.