codeCode Examples

Developer reference for custom events, dataLayer integration, and event structures

GitBook Assistant

This page provides comprehensive code examples for developers integrating with ListenLayer.

circle-info

Custom Events

Send custom events to ListenLayer using the SDK API or dataLayer. Custom events are available in your data warehouse and reporting.

SDK API: Custom Events

Use _ll.track() to send custom events directly.

circle-info

Direct custom events reduce data loss by minimizing latency between event emittance and processing. Use this for critical events, or if you see inaccuracies in your data.

Basic Usage

// Simple event
_ll.track('button_clicked');

// With parameters
_ll.track('feature_used', {
  feature: 'export',
  format: 'csv',
  record_count: 150
});

// With revenue value
_ll.track('subscription_upgraded', {
  from_plan: 'starter',
  to_plan: 'enterprise',
  value: 299
});

Waiting for SDK Ready

When calling SDK methods early in the page lifecycle, use _ll.waitFor() to ensure ListenLayer is ready before executing your code.

Multiple Calls

You can safely call _ll.waitFor() multiple times—each callback runs when ready:

With DOM Events

Combine waitFor with DOM events for guaranteed execution:

circle-info

If you're using GTM or loading ListenLayer asynchronously, also add the stub script to catch early calls. See Installation: Custom Events for setup instructions.

Parameter Rules

Rule
Limit

Max parameters per event

50

Key max length

50 characters (truncated)

String value max length

500 characters (truncated)

Allowed value types

string, number, boolean, null

circle-exclamation

Event Name Rules

Rule
Details

Must start with

Letter (a-z, A-Z)

Allowed characters

Alphanumeric, underscore, dot, hyphen

Max length

100 characters

Cannot use

Reserved names (see below)

chevron-rightReserved Event Nameshashtag

These names are reserved for ListenLayer's automatic tracking and cannot be used with _ll.track():

Core Events pageview, pv, session_state, ss, consent, possiblePerson, pp

Click Events click, linkClick, buttonClick, ctaClick, downloadClick, telClick, mailtoClick

Form Events form, formLoad, formVisible, formStart, formFieldStart, formFieldComplete, formStepChange, formValidationFail, formSubmit, formAbandon, form_load, form_visible, form_start, form_field_start, form_field_complete, form_step_change, form_validation_fail, form_submit, form_abandon, fl, fv, fs, ffs, ffc, fsc, fvf, fsu, fab

Engagement Events scroll, scrollDepth, contentEngagement, pageExit

Identity Events identify, identifyPerson

Chat Events chat, chatLoaded, chatOpened, chatStarted, chatMessageSent, chatMessageReceived, chatEmailCaptured, chatMeetingBooked, chatOfflineForm, chatEnded, chat_loaded, chat_opened, chat_started, chat_message_sent, chat_message_received, chat_email_captured, chat_meeting_booked, chat_offline_form, chat_ended, chs, cho, che, cms, cmr, cec, cmb, cof

Video Events video, videoLoaded, videoPlay, videoPause, videoProgress, videoSeek, videoEnd, videoFullscreen, videoMute, videoUnmute, video_loaded, video_play, video_pause, video_progress, video_seek, video_end, video_fullscreen, video_mute, video_unmute, vpl, vpa, vpr, vpg, ven, vsk, vmt, vum, vfs, vxf

Scheduling Events scheduling, schedulingLoaded, schedulingOpened, schedulingDateSelected, schedulingTimeSelected, schedulingFormStarted, schedulingScheduled, schedulingCancelled, schedulingRescheduled, scheduling_loaded, scheduling_opened, scheduling_date_selected, scheduling_time_selected, scheduling_form_started, scheduling_scheduled, scheduling_cancelled, scheduling_rescheduled, sld, sop, sds, sts, sfs, sch, sca, srs, sbc

eCommerce Events ecommerce, view_item, view_item_list, select_item, add_to_cart, remove_from_cart, view_cart, begin_checkout, add_shipping_info, add_payment_info, purchase, refund

circle-info

Reserved name checking is case-insensitive. For example, PageView, PAGEVIEW, and pageview are all reserved.

Data Warehouse Output

When you call _ll.track(), the event is stored in the Data Warehouse:

Auto-PII Detection

ListenLayer scans custom event parameters for identity information:


SDK API: eCommerce Events

Track eCommerce transactions using _ll.ecommerce.* methods. ListenLayer supports both GA4 format and ListenLayer enhanced format.

GA4 Format:

ListenLayer Enhanced Format:

With Customer Identity:

All eCommerce Methods

Method
Description

_ll.ecommerce.viewItem()

Product detail page view

_ll.ecommerce.viewItemList()

Category or search results view

_ll.ecommerce.selectItem()

Product clicked in list

_ll.ecommerce.addToCart()

Item added to cart

_ll.ecommerce.removeFromCart()

Item removed from cart

_ll.ecommerce.viewCart()

Cart page viewed

_ll.ecommerce.beginCheckout()

Checkout started

_ll.ecommerce.addShippingInfo()

Shipping details entered

_ll.ecommerce.addPaymentInfo()

Payment details entered

_ll.ecommerce.purchase()

Order completed

_ll.ecommerce.refund()

Order refunded

_ll.ecommerce.viewPromotion()

Promotion banner viewed

_ll.ecommerce.selectPromotion()

Promotion clicked

_ll.ecommerce.addToWishlist()

Item added to wishlist

Field Reference

chevron-rightOrder-Level Fieldshashtag
GA4 Field
ListenLayer Field
Required
Description

transaction_id

order_id

Yes

Unique order identifier

currency

currency

Yes

ISO 4217 currency code

value

grand_total

Yes

Total order value

subtotal

No

Sum of item totals before discounts

tax

tax

No

Tax amount

shipping

shipping

No

Shipping cost

coupon

coupon

No

Order-level coupon code

cart_discount

No

Cart-level discount amount

item_discounts_total

No

Sum of item discounts

total_discount

No

Total discount (cart + items)

adjusted_subtotal

No

Subtotal minus discounts

affiliation

affiliation

No

Store or affiliate name

chevron-rightItem-Level Fieldshashtag
GA4 Field
ListenLayer Field
Required
Description

item_id

item_id

Yes

Product SKU or ID

item_name

item_name

Yes

Product name

price

unit_price

Yes

Unit price

quantity

quantity

Yes

Quantity

item_variant

variant

No

Variant name (e.g., "Red")

variant_id

No

Variant SKU

item_brand

brand

No

Brand name

item_category

category

No

Primary category

item_category2

No

Category level 2

item_category3

No

Category level 3

discount

item_discount

No

Item discount amount

coupon

coupon

No

Item-level coupon

index

index

No

Position in list

item_list_id

list_id

No

List identifier

item_list_name

list_name

No

List name

item_total

No

unit_price × quantity

item_adjusted_total

No

item_total - item_discount


SDK API: Identity Events

Use _ll.identifyPerson() to explicitly identify a visitor.

Basic Usage

When to Call

Call _ll.identifyPerson() when you know who the visitor is:

  • After login or signup

  • When loading a page for an authenticated user

  • After receiving identity from your backend

  • When syncing with your CRM

Field Reference

Field
Type
Required
Description

email

string

Yes*

Email address

phone

string

Yes*

Phone number (E.164 format preferred)

firstName

string

No

First name

lastName

string

No

Last name

zipCode

string

No

Postal/ZIP code

externalId

string

No

Your system's user/customer ID

company.domain

string

Yes**

Company domain (required if company provided)

company.name

string

No

Company name

customFields

object

No

Custom properties (string, number, boolean)

* At least one of email or phone is required. ** Required only if company object is provided.

circle-check
circle-info

All identity data is encrypted client-side before transmission. ListenLayer never sends PII in cleartext.


DataLayer Events

ListenLayer intercepts window.dataLayer.push() calls and can capture them as events based on rules in your account.

Required Structure

Any object pushed with an event property can be captured and treated as a custom event if the event property is targeted with rules inside you ListenLayer account. This allows you to send custom events to ListenLayer based on existing tracking activity you already have in place.

How Data is Translated to Data Warehouse

When a dataLayer push matches a rule, ListenLayer captures it as a custom event. The rule ID (defined inside your account) becomes the event name, and the full dataLayer payload is automatically collected.

Example: DataLayer Push with Matching Rule (Rule ID: Pricing Calculator Rule)

Nested Properties are Preserved

Nested objects in the dataLayer are automatically captured:

Field
Description

data.name

The rule ID configured in ListenLayer

data.source

Always dataLayer for dataLayer events

params._dl_event

Original event property value

params.*

All properties from the dataLayer push (flat and nested)

circle-info

All properties from the dataLayer push are automatically captured—no configuration required. Nested objects are preserved in their original structure.

Identity Detection

circle-info

PII is encrypted client-side. Only hashes are visible in raw events. When using the Preview tools, unencrypted values are shown for debuggin.

ListenLayer detects identity from dataLayer pushes using two tiers:

Tier 1: Explicit Identity (High Confidence)

Standard field names, included inside the user_data or person object, that indicate known identity. Use these when you want to explicitly emite the visitors identity as opposed to letting us infer a possible person.

Tier 2: Flexible Detection (Medium Confidence)

Email patterns detected anywhere in the payload (outside of the explicit user_data or person objects):

Excluded Events

These events are not captured as generic dataLayer events:

Pattern
Reason

gtm.*

GTM internal events

ll.*, _ll.*

ListenLayer internal (prevents loops)

GA4 eCommerce (purchase, add_to_cart, etc.)

Handled by eCommerce listener

DataLayer Rules

Configure rules in ListenLayer settings to map dataLayer events to custom events:


DataLayer Push Back

After processing events, ListenLayer pushes matched triggers back to the dataLayer for GTM and other tools to consume.

How It Works

  1. SDK sends event to ListenLayer Edge

  2. Edge processes event and matches against configured triggers

  3. SDK polls for trigger responses

  4. Matched triggers are pushed to window.dataLayer

Trigger Structure

When a trigger matches, ListenLayer pushes to the dataLayer:

Using Triggers in GTM

Create a Custom Event trigger in GTM:

  1. Trigger Type: Custom Event

  2. Event Name: ll_form_submission (or use regex ll_.* for all)

  3. Use in Tags: Fire your conversion pixels, webhooks, etc.

Example: Fire Google Ads Conversion

Polling Behavior

The SDK uses intelligent polling to retrieve triggers:

Phase
Timing
Purpose

Fast polling

0ms, 25ms, 37ms, 55ms...

Immediate trigger delivery

Backoff

Up to 500ms intervals

Reduce server load

Safety polls

500ms, 1.5s, 3s, 5s

Cross-page trigger recovery

Triggers survive page navigation—if you navigate before a trigger is delivered, it will be delivered on the next page.


Event Structure (Data Warehouse)

This section documents the structure of events as stored in your data warehouse.

circle-exclamation
circle-info

The examples below show raw event formats as received by the Data Warehouse. The Data Warehouse processes these events and transforms them into optimized, enriched structures for analysis and reporting.

Base Event Envelope

Every event includes these fields. The data field contains event-specific payload.

chevron-rightCore Fieldshashtag
Wire
Field
Type
Description

a

account_id

string

Your ListenLayer account ID

t

event_type

string

Event type (pv, click, form_submit, etc.)

ts

timestamp

number

Client timestamp (Unix ms)

tm

tracking_mode

string

id (identified), anon (anonymous), dnt (do-not-track)

url

url

string

Current page URL

tt

page_title

string

Document title

pvid

pageview_id

string

Unique ID for this page load

d

data

object

Event-specific payload

chevron-rightReferrer Objecthashtag
Wire
Field
Type
Description

url

referrer_url

string

Full referrer URL

host

referrer_host

string

Hostname only

path

referrer_path

string

Path portion

same

is_same_site

boolean

Same domain

type

referrer_type

string

internal, external, direct, search, social

chevron-rightUTM Parameters Objecthashtag
Wire
Field
Description

s

utm_source

Traffic source (google, facebook, newsletter)

m

utm_medium

Marketing medium (cpc, email, social)

c

utm_campaign

Campaign name

t

utm_term

Keyword (paid search)

n

utm_content

Ad variation

Plus ValueTrack params: matchtype, network, device, adgroup, creative, etc.

chevron-rightClick IDs Object (19 Platforms)hashtag
Wire
Parameter
Platform

gc

gclid

Google Ads

gb

gbraid

Google iOS

wb

wbraid

Google web-to-app

fb

fbclid

Meta/Facebook

ms

msclkid

Microsoft/Bing

tt

ttclid

TikTok

li

li_fat_id

LinkedIn

pin

epik

Pinterest

snap

sclid

Snapchat

tw

twclid

Twitter/X

rd

rdt_cid

Reddit

qq

qclid

Quora

dc

dclid

DoubleClick/DV360

yh

vmcid

Yahoo DSP

vi

viant_clid

Viant/Adelphic

sa

sapid

StackAdapt

ad

ef_id

Adobe Advertising

tb

click_id

Taboola

ob

ob_click_id

Outbrain

chevron-rightViewport & Device Objecthashtag
Wire
Field
Type
Description

w

viewport_width

number

Visible width (px)

h

viewport_height

number

Visible height (px)

dpr

device_pixel_ratio

number

Retina ratio (1, 2, 3)

sw

scroll_width

number

Total scrollable width

sh

scroll_height

number

Total scrollable height

chevron-rightClient Info Object (Edge-Enriched)hashtag

Geo (Location)

Wire
Field
Description

co

country

ISO 3166-1 alpha-2

rg

region

State/province

rgc

region_code

ISO 3166-2

ct

city

City name

pc

postal_code

Postal/ZIP

lat

latitude

Decimal

lon

longitude

Decimal

tz

timezone

IANA format

cont

continent

NA, EU, AS, AF, OC, SA, AN

eu

is_eu_country

Boolean

Network

Wire
Field
Description

asn

asn

Network provider ID

aso

asn_organization

Network provider name

proto

http_protocol

HTTP/1.1, HTTP/2, HTTP/3

Bot Detection

Wire
Field
Description

bot

bot_score

1-99 (1=bot, 30+=human)

bv

verified_bot

Is known bot

bcat

verified_bot_category

search, preview, ai, etc.

chevron-rightIdentity Fields (Edge-Added)hashtag
Wire
Field
Description

did

device_id

Persistent device identifier

pid

person_id

Cross-device person ID (when identified)

sid

session_id

Current session ID

nd

is_new_device

First event from this device

ns

is_new_session

First event of new session

chevron-rightCore Web Vitals Objecthashtag
Wire
Field
Description

lcp

largest_contentful_paint

Time until largest element visible (ms)

fid

first_input_delay

Time from first interaction to response (ms)

cls

cumulative_layout_shift

Layout stability score (0-1)

inp

interaction_to_next_paint

Responsiveness metric (ms)

fcp

first_contentful_paint

Time until first content visible (ms)

ttfb

time_to_first_byte

Server response time (ms)


Core Events

Event Type: pvpageview

Fired on page load and SPA navigation.

Field
Description

navigation_type

navigate, reload, back_forward, spa_push, spa_replace, spa_pop, spa_hash, bfcache, prerender, prerender_activate

previous_url

Previous page URL (SPA only)

performance.ttfb

Time to first byte (ms)

performance.dom_interactive

DOM interactive time (ms)

performance.load

Load event time (ms)

Click Events

Event Type: clkclick

circle-info

Event Naming: The short code clk is used in the wire format (SDK to Edge). The long name click is used in the data warehouse and appears as the event_type value in processed events.

Click Type Values

The click_type field classifies what was clicked:

Type
Description

link

Standard link click

button

Button element click

download

File download link

tel

Phone number link

mailto

Email link

cta

Call-to-action element

rule

Click matched a tracking rule

other

Other clickable element

Scroll Events

Event Type: scrscroll

Milestones: 25%, 50%, 75%, 90%, 100%

Form Events

Form tracking captures the complete form lifecycle from load to submit or abandon.

chevron-rightForm Lifecycle Eventshashtag

Form Load (flform_load)

Fired when a form is added to the DOM.


Form Visible (fvform_visible)

Fired when a form scrolls into the viewport.


Form Start (fsform_start)

Fired when user begins interacting with a form.


Form Submit (fsbform_submit)

Fired when user submits a form.


Form Abandon (fabform_abandon)

Fired when user leaves without submitting.

chevron-rightField Interaction Eventshashtag

Field Start (ffsform_field_start)

Fired when user focuses on a field.


Field Complete (ffcform_field_complete)

Fired when user completes a field.


Step Change (fscform_step_change)

Fired when multi-step form progresses.


Validation Fail (fvfform_validation_fail)

Fired when form validation fails.

Identity Events

Event Type: ididentify

Explicit identification via _ll.identifyPerson().

circle-info

PII is encrypted client-side. Only hashes are visible in raw events.

Chat Events

chevron-rightAll Chat Eventshashtag
Wire Code
Event Type
Description

chl

chat_loaded

Chat widget loaded

cho

chat_opened

Widget opened

chs

chat_started

Conversation began

cms

chat_message_sent

User sent message

cmr

chat_message_received

Bot/agent replied

cec

chat_email_captured

Email collected

cmb

chat_meeting_booked

Meeting scheduled

cof

chat_offline_form

Offline form submitted

che

chat_ended

Conversation ended

Example: Chat Started

Video Events

chevron-rightAll Video Eventshashtag
Wire Code
Event Type
Description

vld

video_loaded

Player initialized

vpl

video_play

Play started/resumed

vpa

video_pause

Video paused

vpr

video_progress

Milestone reached

vsk

video_seek

User seeked

ven

video_end

Video completed

vfs

video_fullscreen

Fullscreen toggled

vmt

video_mute

Video muted

vum

video_unmute

Video unmuted

Example: Video Play

Scheduling Events

chevron-rightAll Scheduling Eventshashtag
Wire Code
Event Type
Description

sld

scheduling_loaded

Widget loaded

sop

scheduling_opened

Widget opened

sds

scheduling_date_selected

Date picked

sts

scheduling_time_selected

Time picked

sfs

scheduling_form_started

Details form started

sch

scheduling_scheduled

Booking confirmed

sca

scheduling_cancelled

Booking cancelled

srs

scheduling_rescheduled

Booking rescheduled

sbc

scheduling_confirmed

Confirmation received

Example: Scheduled

eCommerce Events

chevron-rightAll eCommerce Eventshashtag
Wire Code
Event Type
Description

evi

view_item

Product viewed

eil

view_item_list

Category/list viewed

esi

select_item

Product selected

atc

add_to_cart

Added to cart

rfc

remove_from_cart

Removed from cart

eca

view_cart

Cart viewed

eco

begin_checkout

Checkout started

esh

add_shipping_info

Shipping entered

epi

add_payment_info

Payment entered

epu

purchase

Purchase completed

erf

refund

Order refunded

epr

view_promotion

Promotion viewed

eps

select_promotion

Promotion selected

ewl

add_to_wishlist

Added to wishlist

Example: Purchase

Last updated

Was this helpful?