Widget στον ιστότοπο, σύνδεσμος πράκτορα και εφαρμογή στο τηλέφωνο
Μάθετε πώς να ενσωματώσετε τον πράκτορα στον ιστότοπό σας με μία γραμμή κώδικα, πώς λειτουργεί ο σύντομος σύνδεσμος για τα μέσα κοινωνικής δικτύωσης και τις εφαρμογές ανταλλαγής μηνυμάτων, και πώς οι πελάτες εγκαθιστούν τον πράκτορά σας ως εφαρμογή στο τηλέφωνό τους.
Ο πράκτορας έχει δύο όψεις. Στον ιστότοπο, είναι ένα παράθυρο στη γωνία που ανοίγει με ένα κουμπί. Στα μέσα κοινωνικής δικτύωσης και στις εφαρμογές ανταλλαγής μηνυμάτων, είναι μια σελίδα με σύντομο σύνδεσμο που λειτουργεί σαν ένα μικρό κατάστημα και εγκαθίσταται στο τηλέφωνο ως εφαρμογή. Ο κατάλογος, οι όροι, οι συνομιλίες και οι αιτήσεις είναι κοινά: ο πράκτορας είναι ένας.
Όλα όσα περιγράφονται παρακάτω βρίσκονται στην ενότητα «Γραφικό στοιχείο και σύνδεσμος».
Σύνδεσμος στον πράκτορα#
Μια σύντομη διεύθυνση όπως comag.vibevox.pro/c/your-shop. Τοποθετείται στην επικεφαλίδα του προφίλ σε Instagram, TikTok ή Telegram, αποστέλλεται στο WhatsApp, μπαίνει στην περιγραφή κάτω από ένα βίντεο στο YouTube.
Όταν αποστέλλεται σε μια εφαρμογή ανταλλαγής μηνυμάτων, ο σύνδεσμος εμφανίζεται ως κάρτα: εξώφυλλο, όνομα καταστήματος και περιγραφή. Και τα τρία πεδία είναι παραμετροποιήσιμα:
- Τίτλος προεπισκόπησης — από προεπιλογή, το όνομα του καταστήματος.
- Περιγραφή προεπισκόπησης — μια σύντομη φράση για το τι μπορεί να ρωτήσει κανείς.
- Εξώφυλλο — δημιουργείται αυτόματα από το χρώμα έμφασης, το λογότυπο και τις φωτογραφίες των προϊόντων σας. Μπορείτε να ανεβάσετε δικό σας, μέγεθος 1200 επί 630 pixel.
Ο ευκολότερος τρόπος να ελέγξετε πώς φαίνεται η προεπισκόπηση είναι να στείλετε τον σύνδεσμο στον εαυτό σας στο Telegram.
Κώδικας για τον ιστότοπο#
Μία γραμμή κώδικα που εισάγεται πριν από την ετικέτα κλεισίματος </body> σε όλες τις σελίδες. Αντιγράφεται με ένα κουμπί στον πίνακα ελέγχου.
Πού ακριβώς να το εισάγετε σε δημοφιλείς πλατφόρμες:
| Πλατφόρμα | Πού να εισάγετε |
|---|---|
| Tilda | Ρυθμίσεις ιστοτόπου → Περισσότερα → Κώδικας HTML για το body |
| Shopify | Θέμα → Επεξεργασία κώδικα → theme.liquid, πριν από το </body> |
| WordPress | Εμφάνιση → Επεξεργαστής θέματος → footer.php, ή πρόσθετο εισαγωγής κώδικα |
| Wix | Ρυθμίσεις → Προσαρμοσμένος κώδικας → προσθήκη στο τέλος του Body |
| Ο δικός σας ιστότοπος | Απευθείας στο πρότυπο πριν από το </body> |
Μετά την εισαγωγή, ένα κουμπί θα εμφανιστεί στην κάτω δεξιά γωνία. Η θέση αλλάζει σε αριστερή στις ρυθμίσεις, το χρώμα και το θέμα — επίσης εκεί.
Το γραφικό στοιχείο φορτώνει ασύγχρονα και δεν επιβραδύνει τη σελίδα. Αν έχετε ρυθμίσει αυστηρό CSP, επιτρέψτε τον τομέα comag.vibevox.pro στα script-src και connect-src.
Διαμόρφωση#
Ρυθμίσεις που βλέπει ο αγοραστής:
- Όνομα καταστήματος και όνομα βοηθού. Το δεύτερο είναι η υπογραφή του συνομιλητή στην επικεφαλίδα της συνομιλίας.
- Χαιρετισμός. Η πρώτη φράση. Ένας καλός χαιρετισμός υπόσχεται όφελος, δεν λέει απλώς «γεια».
- Προτάσεις στην αρχή της συνομιλίας. Έως τέσσερα κουμπιά με ερωτήσεις. Αν είναι κενό — θα δημιουργηθούν αυτόματα από τον κατάλογο.
- Ύφος επικοινωνίας. Από τη λίστα ή δικό σας: «ζεστό και σύντομο», «εξειδικευμένο, με πληθυντικό».
- Χρώμα έμφασης. Ένα χρώμα καθορίζει το κουμπί, τους συνδέσμους και την επισήμανση των καρτών.
- Λογότυπο. Θα γίνει επίσης το εικονίδιο της εφαρμογής στο τηλέφωνο.
- Κουμπί μικροφώνου. Αναγνώριση ομιλίας στο πρόγραμμα περιήγησης. Αν το πρόγραμμα περιήγησης δεν το υποστηρίζει, ο αγοραστής θα ηχογραφήσει ένα φωνητικό μήνυμα, το οποίο θα αποκρυπτογραφήσει το Gemini.
Στα δεξιά υπάρχει ζωντανή προεπισκόπηση: αλλάζει καθώς πληκτρολογείτε. Το κουμπί «Αποθήκευση» μεταφέρει τις αλλαγές στον ιστότοπο.
Ανοιχτό και σκούρο θέμα#
Η συνομιλία έχει δύο εμφανίσεις, και εναλλάσσονται σε ένα μόνο πεδίο ρυθμίσεων — «Θέμα».
| Τιμή | Τι βλέπει ο αγοραστής |
|---|---|
| Όπως του επισκέπτη | Το θέμα προσαρμόζεται στις ρυθμίσεις του τηλεφώνου ή του υπολογιστή του: σκούρο τη νύχτα, ανοιχτό την ημέρα |
| Ανοιχτό | Πάντα ανοιχτό παράθυρο, ανεξάρτητα από τη συσκευή |
| Σκούρο | Πάντα σκούρο παράθυρο |
Από προεπιλογή είναι ρυθμισμένο «όπως του επισκέπτη», και στις περισσότερες περιπτώσεις αυτή είναι η σωστή επιλογή: ένα άτομο με σκούρο θέμα στο τηλέφωνό του δεν θα δεχτεί μια λευκή λάμψη στο πρόσωπο, ενώ αυτός που έχει συνηθίσει το ανοιχτό, θα δει ένα οικείο παράθυρο.
Ένα σταθερό θέμα χρειάζεται όταν ο ίδιος ο ιστότοπος είναι σχεδιασμένος με ένα συγκεκριμένο ύφος. Μια σκούρα σελίδα προορισμού με ένα ανοιχτόχρωμο chat στη γωνία μοιάζει με «μπάλωμα», και το αντίστροφο. Σε αυτή την περίπτωση, επιλέξτε το ίδιο θέμα με τον ιστότοπο, και το γραφικό στοιχείο θα ενσωματωθεί στον σχεδιασμό.
Το χρώμα έμφασης λειτουργεί πάνω από και τα δύο θέματα: τα κουμπιά, οι σύνδεσμοι και η επισήμανση των καρτών παίρνουν το εταιρικό σας χρώμα, ενώ το φόντο και το κείμενο αλλάζουν μαζί με το θέμα. Ο ευκολότερος τρόπος να ελέγξετε και τις δύο επιλογές είναι στην προεπισκόπηση στα δεξιά — ανανεώνεται αμέσως μόλις αλλάζετε την τιμή.
Κάρτες προϊόντων που οδηγούν στον ιστότοπό σας#
Ο πράκτορας απαντά όχι με συνεχές κείμενο, αλλά με κάρτες: φωτογραφία, όνομα, τιμή, κουμπί. Πίσω από το κουμπί υπάρχει πάντα μια διεύθυνση — η σελίδα του προϊόντος στον ιστότοπό σας ή η αρχική ανάρτηση στα μέσα κοινωνικής δικτύωσης, αν η κάρτα έχει δημιουργηθεί από εκεί.
Εντός του γραφικού στοιχείου στον ιστότοπο, η μετάβαση γίνεται στο ίδιο παράθυρο, ώστε να μην δημιουργούνται πολλές καρτέλες. Στη σελίδα του πράκτορα μέσω του συνδέσμου, η κάρτα ανοίγει σε νέα καρτέλα, ώστε να μην χαθεί η συνομιλία.
Για καταστήματα σε Shopify και WooCommerce υπάρχει μια ευχάριστη λεπτομέρεια: το κουμπί δεν ανοίγει απλώς το προϊόν, αλλά το προσθέτει στο καλάθι του καταστήματος μέσω του ενσωματωμένου μηχανισμού της πλατφόρμας. Λεπτομέρειες στα άρθρα για το Shopify και το WordPress.
Και κάτι ακόμα: το γραφικό στοιχείο διαβάζει τη σήμανση του προϊόντος στη σελίδα όπου είναι ανοιχτό, και τη μεταδίδει στον πράκτορα. Επομένως, η ερώτηση «υπάρχει σε μπλε;» στην κάρτα προϊόντος γίνεται κατανοητή στο πλαίσιο, χωρίς να χρειάζεται διευκρίνιση για το τι αφορά.
Εφαρμογή στο τηλέφωνο του αγοραστή#
Η σελίδα του πράκτορα μπορεί να εγκατασταθεί ως εφαρμογή. Ο αγοραστής ανοίγει τον σύνδεσμο από το τηλέφωνο, βλέπει μια πρόταση να την προσθέσει στην αρχική οθόνη και λαμβάνει ένα εικονίδιο με το λογότυπό σας.
- Όνομα κάτω από το εικονίδιο — μία λέξη έως 12 χαρακτήρες. Αν είναι κενό — θα χρησιμοποιήσουμε την πρώτη λέξη του ονόματος του καταστήματος.
- Εικονίδιο — το ανεβασμένο λογότυπο. Αν δεν υπάρχει λογότυπο, χρησιμοποιείται το λογότυπο των Commerce Agents.
- Στο iPhone, η εγκατάσταση γίνεται μέσω «Κοινή χρήση» → «Προσθήκη στην οθόνη αφετηρίας», αυτό είναι ένας περιορισμός του Safari, και ο πράκτορας υποδεικνύει τα βήματα μόνος του.
Μετά την εγκατάσταση, μπορείτε να στέλνετε push-ειδοποιήσεις στον αγοραστή από την ενότητα «Συνομιλίες». Την άδεια για αυτές την δίνει ο ίδιος, πατώντας το καμπανάκι στην επικεφαλίδα της συνομιλίας.
Συνημμένα από τον αγοραστή#
Στη συνομιλία υπάρχει ένα συνδετήρας: φωτογραφίες, βίντεο ή ήχος έως 20 megabyte. Αν το πρόγραμμα περιήγησης δεν υποστηρίζει αναγνώριση ομιλίας, το πάτημα και κράτημα του μικροφώνου ηχογραφεί ένα φωνητικό μήνυμα.
Το αρχείο αναλύεται από το Gemini: τι εμφανίζεται, τι κείμενο υπάρχει στην εικόνα, τι λέγεται φωναχτά. Ο πράκτορας απαντά βάσει αυτής της ανάλυσης, ενώ εσείς βλέπετε στη συνομιλία τόσο το ίδιο το αρχείο όσο και μια σύντομη περιγραφή. Αυτό είναι χρήσιμο σε τομείς όπου είναι ευκολότερο να δείξεις παρά να περιγράψεις: ανταλλακτικά, επισκευές, επιλογή βάσει φωτογραφίας.
Pixel αγοράς για ιστότοπο με καλάθι#
Αν η πληρωμή γίνεται στον ιστότοπό σας, και όχι στη συνομιλία, εισάγετε στη σελίδα «Ευχαριστούμε για την παραγγελία» ένα σύντομο απόσπασμα από τον πίνακα ελέγχου, συμπληρώνοντας τον αριθμό παραγγελίας και το ποσό. Η αγορά θα συνδεθεί με τη συνομιλία, και στα στατιστικά θα είναι ορατό ποιες συνομιλίες καταλήγουν σε πώληση.
Έλεγχος#
Τρία λεπτά που αξίζει να αφιερώσετε μετά τη ρύθμιση:
- Ανοίξτε τον ιστότοπο σε ανώνυμη περιήγηση και πατήστε το κουμπί του widget. Κάντε μια ερώτηση για ένα προϊόν.
- Ανοίξτε τον σύνδεσμο του πράκτορα από το τηλέφωνό σας. Ελέγξτε αν προτείνεται εγκατάσταση.
- Στείλτε τον σύνδεσμο στον εαυτό σας σε εφαρμογή ανταλλαγής μηνυμάτων και δείτε την προεπισκόπηση.
- Ρίξτε μια ματιά στις «Συνομιλίες»: εκεί θα πρέπει να εμφανιστούν και οι δύο συνομιλίες.
Συχνές ερωτήσεις#
Το widget στον ιστότοπο και ο σύνδεσμος είναι διαφορετικοί πράκτορες;#
Είναι ο ίδιος. Ο κατάλογος, οι όροι, οι συνομιλίες και οι αιτήσεις είναι κοινά. Διαφέρει μόνο η εμφάνιση: στον ιστότοπο, το παράθυρο είναι στη γωνία, ενώ μέσω του συνδέσμου — μια σελίδα πλήρους οθόνης, την οποία μπορείτε να προσθέσετε στην αρχική οθόνη του τηλεφώνου σας.
Μπορεί να αλλάξει η διεύθυνση του συνδέσμου;#
Η διεύθυνση διαμορφώνεται από το όνομα του καταστήματος κατά τη δημιουργία της βιτρίνας. Αν χρειάζεστε κάτι διαφορετικό, γράψτε μας στο Telegram — θα το αλλάξουμε χειροκίνητα, για να μην χαλάσουν οι ήδη διαμοιρασμένοι σύνδεσμοι.
Το widget θα επιβραδύνει τον ιστότοπο;#
Όχι. Το script είναι ελαφρύ και φορτώνεται ασύγχρονα, μετά το κύριο περιεχόμενο της σελίδας. Το παράθυρο συνομιλίας φορτώνεται μόνο όταν ο πελάτης πατήσει το κουμπί.
Τι βλέπει ο πελάτης αν ο πράκτορας είναι απενεργοποιημένος;#
Τίποτα: το κουμπί δεν εμφανίζεται, ενώ η σελίδα μέσω του συνδέσμου δείχνει ότι ο πράκτορας δεν είναι διαθέσιμος. Ο διακόπτης βρίσκεται στην ενότητα «Widget και σύνδεσμος».
Πώς να αφαιρέσετε την ένδειξη «Λειτουργεί με Commerce Agents»;#
Προς το παρόν, όχι: η υπογραφή παραμένει σε όλα τα πακέτα. Είναι κλικαριστή και οδηγεί στον ιστότοπό μας — αυτό είναι μέρος της τιμής, χάρη στην οποία η υπηρεσία κοστίζει 29 € αντί για ένα σημαντικά μεγαλύτερο ποσό.