Δοκιμή προσαρμοσμένων εικονοστοιχείων

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

Μπορείτε να χρησιμοποιήσετε το Shopify Pixel Helper, για να ελέγξετε αν γίνεται φόρτωση των συμβάντων του εικονοστοιχείου σας και αν έχετε εγγραφεί σωστά στα συμβάντα του Shopify. Το Shopify Pixel Helper σάς επιτρέπει να δοκιμάσετε το προσαρμοσμένο εικονοστοιχείο σας στο διαδικτυακό σας κατάστημα για να δείτε τα συμβάντα που λαμβάνονται σε πραγματικό χρόνο, μαζί με τα δεδομένα για αυτά τα συμβάντα.

Αν το προσαρμοσμένο εικονοστοιχείο σας ενσωματώνεται σε μια πλατφόρμα τρίτου που διαθέτει το δικό της βοηθητικό εργαλείο εικονοστοιχείων, τότε μπορείτε να χρησιμοποιήσετε το βοηθητικό εργαλείο εικονοστοιχείων τρίτου επιπλέον του Shopify Pixel Helper για να ελέγξετε αν τα συμβάντα του εικονοστοιχείου σας υποβάλλονται σε επεξεργασία και λαμβάνονται από την πλατφόρμα τρίτου. Για παράδειγμα, αν προσθέσετε ένα προσαρμοσμένο εικονοστοιχείο TikTok στο κατάστημά σας, τότε μπορείτε να χρησιμοποιήσετε τόσο το Shopify Pixel Helper όσο και το βοηθητικό εργαλείο εικονοστοιχείων TikTok για να δοκιμάσετε το εικονοστοιχείο σας.

Μπορείτε να χρησιμοποιήσετε το Shopify Pixel Helper στην ίδια περίοδο περιήγησης με ένα βοηθητικό εργαλείο εικονοστοιχείων τρίτου για να ελέγξετε τα συμβάντα και για τις δύο πλατφόρμες ταυτόχρονα.

Ακολουθεί ένα προσαρμοσμένο σενάριο εικονοστοιχείου που θα ενεργοποιήσει όλα τα τυπικά συμβάντα στο sandbox και θα καταγράψει τα δεδομένα των συμβάντων στην κονσόλα. Τα τυπικά συμβάντα θα είναι ορατά στο Shopify Pixel Helper. Επιπλέον, μπορείτε να εγγραφείτε σε άλλες μαζικές συνδρομές, all_events, all_custom_events και all_dom_events, για να ανακαλύψετε όλα όσα μπορούν να προσφέρουν τα εικονοστοιχεία ιστού. Επισκεφτείτε το API εικονοστοιχείων ιστού για περισσότερες πληροφορίες.

analytics.subscribe("all_standard_events", event => {
   console.log("Event data ", event?.data);
});

Βεβαιωθείτε ότι ένα προσαρμοσμένο εικονοστοιχείο είναι συνδεδεμένο

Πριν δοκιμάσετε το προσαρμοσμένο εικονοστοιχείο σας, βεβαιωθείτε ότι το προσαρμοσμένο εικονοστοιχείο είναι συνδεδεμένο.

Βήματα:

1. Από τον Διαχειριστή Shopify, μεταβείτε στις Ρυθμίσεις > Συμβάντα πελατών.

2. Δίπλα στο εικονοστοιχείο που θέλετε να δοκιμάσετε, επαληθεύστε ότι το εικονοστοιχείο σας εμφανίζει την κατάσταση Συνδεδεμένο στη στήλη Κατάσταση.

3. Εάν το εικονοστοιχείο δεν είναι συνδεδεμένο, ακολουθήστε τις εξής ενέργειες:

   1. Κάντε κλικ στο εικονίδιο > Προβολή λεπτομερειών.
   2. Προαιρετικά: Ελέγξτε και ενημερώστε τον κώδικα του εικονοστοιχείου σας και, στη συνέχεια, κάντε κλικ στο κουμπί Αποθήκευση.
   3. Κάντε κλικ στο κουμπί Σύνδεση.
   4. Στο παράθυρο διαλόγου επιβεβαίωσης, κάντε κλικ στο κουμπί Σύνδεση.

Δοκιμή ενός προσαρμοσμένου εικονοστοιχείου με το Shopify Pixel Helper

Αφού επαληθεύσετε ότι το προσαρμοσμένο εικονοστοιχείο σας είναι συνδεδεμένο, μπορείτε να χρησιμοποιήσετε το Shopify Pixel Helper για να ελέγξετε εάν το προσαρμοσμένο εικονοστοιχείο σας στέλνει και λαμβάνει τα δεδομένα του καταστήματός σας.

Λάβετε υπόψη τα ακόλουθα προτού χρησιμοποιήσετε το Shopify Pixel Helper:

• Μπορείτε να δοκιμάσετε μόνο 1 προσαρμοσμένο εικονοστοιχείο τη φορά χρησιμοποιώντας το Shopify Pixel Helper.
• Δεν μπορείτε να κάνετε αλλαγές στο εικονοστοιχείο που δοκιμάζεται όταν εκτελείται το Shopify Pixel Helper. Για να δοκιμάσετε νέες αλλαγές, αποθηκεύστε το εικονοστοιχείο σας, κλείστε την καρτέλα του Shopify Pixel Helper και, στη συνέχεια, ανοίξτε ξανά το Shopify Pixel Helper.
• Τα αρχεία καταγραφής συμβάντων διαγράφονται όταν μεταβαίνετε σε μια νέα σελίδα. Για παράδειγμα, εάν προσθέσετε ένα προϊόν στο καλάθι σας και το Shopify Pixel Helper καταγράψει το συμβάν product_added_to_cart, αυτό το αρχείο καταγραφής θα διαγραφεί όταν μεταβείτε σε μια νέα σελίδα προϊόντος ή στη σελίδα καλαθιού.
• Το Shopify Pixel Helper δεν διαθέτει κουμπί κλεισίματος. Για να σταματήσετε τη δοκιμή, πρέπει να κλείσετε την καρτέλα που άνοιξε το Shopify Pixel Helper.
• Το Shopify Pixel Helper δεν είναι συμβατό με καταστήματα headless commerce ή προστατευμένα με κωδικό πρόσβασης καταστήματα.
• Αν το διαδικτυακό σας κατάστημα προστατεύεται με κωδικό πρόσβασης, τότε εξετάστε το ενδεχόμενο να καταργήσετε τον κωδικό πρόσβασης του διαδικτυακού σας καταστήματος για να χρησιμοποιήσετε το Shopify Pixel Helper.

Βήματα:

1. Από τον Διαχειριστή Shopify, μεταβείτε στις Ρυθμίσεις > Συμβάντα πελατών.

2. Κάντε κλικ στο προσαρμοσμένο εικονοστοιχείο που θέλετε να δοκιμάσετε.

3. Κάντε κλικ στην επιλογή Δοκιμή για να ανοίξετε το προσαρμοσμένο εικονοστοιχείο στον ιστότοπό σας για δοκιμή.

4. Προαιρετικά: Ανάλογα με τις ρυθμίσεις συναίνεσης του καταστήματός σας και τις ρυθμίσεις απορρήτου πελατών του προσαρμοσμένου εικονοστοιχείου, το παράθυρο διαλόγου του Βοηθητικού εργαλείου εικονοστοιχείων ενδέχεται να εμφανίσει το μήνυμα Το εικονοστοιχείο αναμένει συναίνεση. Κάντε ένα από τα παρακάτω για να συνεχίσετε τη δοκιμή:

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

5. Για να δείτε ποια συμβάντα φορτώνονται, επισκεφθείτε κάθε σελίδα για την οποία θέλετε να δοκιμάσετε το εικονοστοιχείο και ελέγξτε το παράθυρο διαλόγου του Βοηθητικού εργαλείου εικονοστοιχείων για να βεβαιωθείτε ότι η εγγραφή στο συμβάν και η λειτουργία επανάκλησης ήταν επιτυχείς στην ενότητα Συμβάντα που ελήφθησαν:

   • Μεταβείτε σε μια νέα σελίδα για να δοκιμάσετε το συμβάν page_viewed.
   • Κάντε κλικ σε ένα προϊόν για να δοκιμάσετε το συμβάν product_viewed.
   • Προσθέστε ένα προϊόν στο καλάθι σας για να δοκιμάσετε το συμβάν product_added_to_cart.
   • Μεταβείτε στην ολοκλήρωση αγοράς για να δοκιμάσετε το συμβάν checkout_started.
   • Εισαγάγετε τα στοιχεία αποστολής σας κατά την ολοκλήρωση αγοράς για να ελέγξετε ότι το συμβάν checkout_shipping_info_submitted αντικαθιστά το συμβάν checkout_started.
   • Ολοκληρώστε την αγορά για να ελέγξετε ότι το συμβάν checkout_completed αντικαθιστά το συμβάν checkout_shipping_info_submitted. Μάθετε περισσότερα σχετικά με την υποβολή δοκιμαστικής παραγγελίας.

6. Για να δείτε τα δεδομένα συμβάντος που ελήφθησαν, κάντε κλικ στο για να αναπτύξετε το παράθυρο διαλόγου του βοηθητικού εργαλείου εικονοστοιχείων.

Προβολή της ενότητας «Συμβάντα που ελήφθησαν»

Όταν ελέγχετε ποια συμβάντα φορτώνονται στο βήμα 5, εμφανίζεται μία από τις ακόλουθες καταστάσεις στην ενότητα Συμβάντα που ελήφθησαν του παραθύρου διαλόγου του Βοηθητικού εργαλείου εικονοστοιχείων:

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

analytics.subscribe("all_standard_events", event => {
  console.log("Event data ", event?.data);
  throw new Error("callback error");
});

throw new Error("top level error")

Για να μάθετε περισσότερα σχετικά με την επιδιόρθωση σφαλμάτων JavaScript, επισκεφτείτε τη σελίδα Αντιμετώπιση προβλημάτων JavaScript.

Αντιμετώπιση προβλημάτων του προσαρμοσμένου εικονοστοιχείου σας

Αν το εικονοστοιχείο σας δεν φορτώνει ή δεν ενεργοποιείται κατά τη διάρκεια του ελέγχου και έχετε ήδη ελέγξει τα δεδομένα συμβάντος και τον κώδικα του εικονοστοιχείου σας για σφάλματα, δοκιμάστε τα παρακάτω μέτρα αντιμετώπισης προβλημάτων.

Ελέγξτε τις ρυθμίσεις απορρήτου των πελατών σας

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

Από τον Διαχειριστή Shopify, μεταβείτε στις Ρυθμίσεις > Απόρρητο πελατών για να ελέγξετε για ρυθμίσεις απορρήτου πελατών στον Διαχειριστή Shopify σας που ενδέχεται να ισχύουν για την περίοδο σύνδεσής σας. Ανάλογα με τις ρυθμίσεις απορρήτου των πελατών σας, ακολουθήστε τα παρακάτω βήματα:

• Αν έχετε ρυθμίσεις απορρήτου πελατών που απαιτούν συγκατάθεση στην περιοχή σας, βεβαιωθείτε ότι έχετε δώσει τη συγκατάθεσή σας μέσω του μπάνερ για cookie.
• Αν δεν έχετε ρυθμίσεις απορρήτου πελατών που εμποδίζουν τη φόρτωση του εικονοστοιχείου, κάντε εκκαθάριση των cookie του προγράμματος περιήγησής σας για να γίνει επαναφορά του μπάνερ για cookie και για να δώσετε τη συγκατάθεσή σας.
• Εάν χρησιμοποιείτε ένα εργαλείο τρίτου για τη διαχείριση της συναίνεσης, όπως μια εφαρμογή για μπάνερ για cookie, τότε αυτό το εργαλείο πρέπει να συγχρονίζει τη συναίνεση με το Shopify μέσω του Customer Privacy API. Εάν η συναίνεση δεν συγχρονιστεί με το Shopify, τότε το εικονοστοιχείο σας ενδέχεται να μην ενεργοποιηθεί ακόμη και αφού ο πελάτης παρέχει τη συναίνεσή του. Επικοινωνήστε με τον τρίτο πάροχο για να επιβεβαιώσετε ότι η συναίνεση συγχρονίζεται με το Shopify ή για πρόσθετη υποστήριξη.

Πρόσθετη αντιμετώπιση προβλημάτων

Αν εξακολουθεί να μην είναι σαφές εάν το προσαρμοσμένο εικονοστοιχείο σας έχει εγγραφεί σωστά σε ένα συμβάν πελάτη, δοκιμάστε τα παρακάτω μέτρα αντιμετώπισης προβλημάτων:

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

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

Έλεγχος με βοηθό εικονοστοιχείου τρίτου

Ένα SDK (κιτ ανάπτυξης λογισμικού) εικονοστοιχείου περιέχει τα εργαλεία με τα οποία το εικονοστοιχείο σας συλλέγει πληροφορίες σχετικά με τη συμπεριφορά των πελατών. Μπορείτε να χρησιμοποιήσετε τον βοηθό εικονοστοιχείου από τον τρίτο πάροχό σας για να ελέγξετε τις ακόλουθες συμπεριφορές του εικονοστοιχείου σας και να βεβαιωθείτε ότι το SDK του εικονοστοιχείου λειτουργεί όπως αναμένεται:

• Έλεγχος φόρτωσης του SDK τρίτου για το εικονοστοιχείο
• Έλεγχος αρχικοποίησης και λήψης συμβάντων από το SDK τρίτου για το εικονοστοιχείο

Έλεγχος φόρτωσης του SDK τρίτου για το εικονοστοιχείο

Τα βήματα για τον έλεγχο της καρτέλας δικτύου εξαρτώνται από το πρόγραμμα περιήγησης που χρησιμοποιείτε. Για παράδειγμα, για να μάθετε πώς να ελέγχετε την καρτέλα δικτύου στο Google Chrome, ανατρέξτε στην τεκμηρίωση του Chrome για προγραμματιστές Επιθεώρηση δραστηριότητας δικτύου.

Για να ελέγξετε ότι έχει φορτωθεί ένα SDK τρίτου για το εικονοστοιχείο, πρέπει πρώτα να ανακτήσετε τον κώδικα του τρίτου παρόχου σας για το URL του SDK, ώστε να μπορείτε να τον προσθέσετε στον κώδικα του εικονοστοιχείου σας. Για υποστήριξη, επικοινωνήστε με τον τρίτο πάροχο του εικονοστοιχείου σας.

Βήματα:

1. Από τον Διαχειριστή Shopify, μεταβείτε στις Ρυθμίσεις > Συμβάντα πελατών.

2. Κάντε κλικ στο προσαρμοσμένο εικονοστοιχείο που θέλετε να δοκιμάσετε.

3. Στην ενότητα Κώδικας, εισαγάγετε το SDK του εικονοστοιχείου που σας παρείχε ο τρίτος πάροχός σας στο τέλος του κώδικα του εικονοστοιχείου σας.

4. Κάντε κλικ στο κουμπί Αποθήκευση.

5. Επισκεφθείτε το διαδικτυακό σας κατάστημα και, στη συνέχεια, ελέγξτε την καρτέλα δικτύου σας για να βεβαιωθείτε ότι γίνεται λήψη του URL του SDK του τρίτου παρόχου.

6. Προαιρετικά: Αν το SDK τρίτου για το εικονοστοιχείο δεν φορτώνει, ελέγξτε για σφάλματα χρόνου εκτέλεσης JavaScript στο sandbox. Για παράδειγμα, στο Chrome μπορείτε να επιλέξετε ένα συγκεκριμένο iFrame για να ελέγξετε τα αρχεία καταγραφής της κονσόλας και, στη συνέχεια, να περιορίσετε τα αρχεία καταγραφής στο συγκεκριμένο εικονοστοιχείο που ελέγχετε. Για να μάθετε περισσότερα σχετικά με τον έλεγχο για σφάλματα χρόνου εκτέλεσης JavaScript στο Chrome, ανατρέξτε στην τεκμηρίωση του Chrome Εντοπισμός σφαλμάτων JavaScript.

Αν το SDK τρίτου για το εικονοστοιχείο δεν φορτώνει κατά τη διάρκεια του ελέγχου, επικοινωνήστε με τον τρίτο πάροχο του εικονοστοιχείου σας για υποστήριξη.

Άλλοι έλεγχοι του SDK τρίτου για το εικονοστοιχείο

Για να ελέγξετε αν ένα SDK τρίτου για το εικονοστοιχείο έχει αρχικοποιηθεί ή συλλέγει συμβάντα, ανατρέξτε στην τεκμηρίωση του τρίτου παρόχου του εικονοστοιχείου σας.

Για να ελέγξετε αν ένα SDK εικονοστοιχείου συλλέγει συμβάντα, ενδέχεται να λάβετε οδηγίες για να ελέγξετε την καρτέλα δικτύου του προγράμματος περιήγησής σας. Τα βήματα για τον έλεγχο της καρτέλας δικτύου εξαρτώνται από το πρόγραμμα περιήγησης που χρησιμοποιείτε. Για παράδειγμα, για να μάθετε πώς να ελέγχετε την καρτέλα δικτύου σε ένα πρόγραμμα περιήγησης Google Chrome, ανατρέξτε στην τεκμηρίωση του Chrome για προγραμματιστές Επιθεώρηση δραστηριότητας δικτύου.