docs

Tracking (hidden)

Tracking functionality SCAYLE Checkout

An overview of how the tracking functionality works within SCAYLE checkout

How it works

Within Checkout, events enable the tracking of user interactions. You can find an overview of the preconfigured events below. The listed events are defined for the new GA4 structure and they work with the GTM by using the data layer instruction.

Within Checkout, by default we push events to the existing window.dataLayer array, but for embedded forms the postMessage web API is used. Normally, scripts on different pages are allowed to access each other if and only if the pages they originate from share the same protocol, port number, and host. window.postMessage() provides a secure mechanism without these restrictions.

Configuration

We offer configuration options to fine-tune tracking events within the checkout:

  • Send plaintext email
  • Send dataLayer events
  • Send form field errors

Please refer to our configuration options page for detailed information on how to change these options.

Events

Below are listed a full list of tracking events that are triggered by the checkout web component after specific user interactions:

1. General

Shop init

{% hint style="info" %}

This event is triggered upon the initial loading of the checkout frontend.

{% endhint %}

Content view

{% hint style="info" %}

This event is triggered on route changes such as authentication, shipping and payment. Additionally, it includes the empty basket page, error page, and while waiting for longer than usual payment confirmations.

{% endhint %}

Errors

{% hint style="info" %}

This event is triggered when the frontend receives an error code from the backend on an API request, within catch blocks for frontend logic, as well as form field validation errors when sendFormFieldErrors is enabled in the configuration.

{% endhint %}

2. Authentication

Login

{% hint style="info" %}

This event is triggered when a user logs in.

{% endhint %}

Sign up

{% hint style="info" %}

This event is triggered when a user registers a new account.

{% endhint %}

Set password

{% hint style="info" %}

This event is triggered when a user resets their password.

{% endhint %}

Customer data

{% hint style="info" %}

This event is triggered upon interaction with all authentication methods.

{% endhint %}

3. Basket

Add to cart

{% hint style="info" %}

This event is triggered when the basket item quantity is increased.

{% endhint %}

Remove from cart

{% hint style="info" %}

This event is triggered when the basket item is removed or the quantity is decreased.

{% endhint %}

4. Payment

Add payment info

{% hint style="info" %}

This event is triggered when a payment option is selected.

{% endhint %}

Loyalty program

{% hint style="info" %}

These events are triggered after interactions with the loyalty program feature.

{% endhint %}

Complete checkout

5. Features

Address Book

{% hint style="info" %}

These events are triggered when adding, removing, or clicking on address book selections.

{% endhint %}

Vouchers

{% hint style="info" %}

This event is triggered when adding or removing vouchers.

{% endhint %}

Promotion Codes

{% hint style="info" %}

This event is triggered when adding and removing promotion codes.

{% endhint %}

Shipping Information

{% hint style="info" %}

This event is triggered when modifying the shipping method.

{% endhint %}

Payment Method Pre-Selection

{% hint style="info" %}

This event is triggered to show the default pre-selected payment method of the checkout session.

{% endhint %}

Shared Payloads

Correlation Id

{% hint style="info" %}

When a correction id is set as an attribute on the checkout web component, it provides a unique identifier that is passed with all tracking events to track a users session.

{% endhint %}

Ecommerce Object

Shared payloads are referenced in the example tracking events above.