Scroll tracking

Example triggers

To determine the correct triggers to use for sending events to AI Paywall, such as firing a 44 event when a paywall component loads, we highly recommend leveraging any existing triggers and event listeners you have on your site.

If you don’t already have these in place, you can use one of the following methods for setting up triggers:

• Through an event listener
• Through dataLayer form events

Prerequisites

Before proceeding, ensure the following conditions are met:

• You are using a client-side implementation (these options are not compatible with server-side solutions).
• There are no existing triggers or listeners that can be leveraged.
• Your forms are built using Zephr’s in-built functionality (event triggers through a listener or dataLayer form events are supported for custom forms).

Via Event Listener

You can deploy an event listener on your page using JavaScript before rendering the forms.

The following example adds a listener for key impression, click, and conversion events, using a switch statement to handle each event:

window.addEventListener(
  "message",
  (event) => {
    if (event.origin !== window.origin || !event.data?.["zephr-form-datalayer-event"]) return;
    const formEvent = event.data["zephr-form-datalayer-event"];
    switch (formEvent.event) {
        case 'zephr_form_render':
            console.log('Form rendered, action 44', formEvent);
            break;
        case 'begin_checkout':
            console.log('Begin checkout, action 28', formEvent);
            break;
        case 'zephr_form_purchase':
            console.log('Form purchase complete, action 151', formEvent);
            break;
        default:
            console.log(`Form event: ${formEvent.event}`, formEvent);
    }
  },
  false,
);

Via dataLayer form events

You can push form events to the dataLayer and use these events as your triggers.

To enable this, go to Zephr > Settings > Data Layer and enable the Send form events to the dataLayer toggle.

Once enabled, use the list of available dataLayer events in the following table as triggers for AI Paywall Event Tracking: