Βοήθεια
Σύνδεση

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

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

Μπορείτε να χρησιμοποιήσετε το 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. Αν το εικονοστοιχείο δεν είναι συνδεδεμένο, τότε κάντε κλικ στο ... και, στη συνέχεια, κάντε κλικ στην επιλογή Σύνδεση.

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

Αφού επαληθεύσετε ότι το προσαρμοσμένο εικονοστοιχείο σας είναι συνδεδεμένο, μπορείτε να χρησιμοποιήσετε το 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 σχετικά με τις περιγραφές τυπικών συμβάντων για να βεβαιωθείτε ότι εκτελείτε τα απαιτούμενα βήματα για την ενεργοποίηση του συμβάντος.

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

Ένα 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 για προγραμματιστές Επιθεώρηση δραστηριότητας δικτύου.