Examples of web event tracking¶

Product Browsed¶

For this event, you need to send the following data to CDP:

• A customer object: It must contain a customer identifier, SourceCustomerNumber or Email.

• An event instance of type productBrowsed. It must contain a Target with the SourceProductNumber set and a customer instance.

The following is the example of implementation using the model-oriented approach:

var currentVisitor = $A1.Customer({
SourceCustomerNumber: "123",
Email: “[email protected]”
}); //define a customer instance

var productABC123 = $A1.Target({
SourceProductNumber: "ABC123"
}); //define the target for this event, ie the product being browsed

$A1.Event({
type: “productBrowsed”,
customer: currentVisitor,
targets: productABC123
})
.send();

It implies that the current visitor is identified as “john.doe@gmail.com” and the customer SourceCustomerNumber is “123”. Using this information, CDP can now tie this customer “123” and all the actions to the person “john.doe@gmail.com”, thus enabling CDP to target that person in campaigns based on the customer’s web behavior.

It also means that the customer “123” viewed the product “ABC123”.

Category Browsed¶

For this event, you need to send the following data to CDP:

• A customer object: It must contain a customer identifier, SourceCustomerNumber or Email.

• An event instance of type categoryBrowsed with the SourceProductCategoryNumber attribute set and a customer instance.

The following is the example of implementation using the model-oriented approach:

var currentVisitor = $A1.Customer({
SourceCustomerNumber: "123",
Email: “[email protected]”
}); //define a customer instance

$A1.Event({
type: “categoryBrowsed”,
customer: currentVisitor,
SourceProductCategoryNumber: "Category456"
})
.send();

It means that the customer “123” viewed the category “Category456”.

Cart Updates¶

For this event, you need to send the following data to CDP:

• A customer object: It must contain a customer identifier: SourceCustomerNumber or Email.

• An event instance of type cartUpdated with the SourceProductNumber set and a customer instance.

• In the following example, CDP assumes that the visitor is already identified and CDP can reuse that customer instance.

The following is the example of implementation using the model-oriented approach:

var myEvent = $A1.Event({
type: "cartUpdated",
customer: currentVisitor,
targets: productABC123
});
myEvent.send();

It implies that the customer “123” has added product “ABC123” to their cart. If customer “123” adds another product “DEF456” to their cart, here is the additional Javascript that you must execute:

var productDEF456 = $A1.Target({SourceProductNumber: "DEF456"});
 myEvent.add("targets", productDEF456).send();

It implies that there are two cart updates. Customer “123” added products “ABC123” and “DEF456”. If this customer “123” adds another product “GHI789” to the cart, and removes product “DEF456”, here is the additional Javascript that you must execute:

var productGHI789 = $A1.Target({SourceProductNumber: "GHI789"});
myEvent.add("targets", productGHI789).send();

myEvent = $A1.Event({
type: "cartUpdated",
customer: currentVisitor,
targets: [productABC123,productGHI789]
});
myEvent.send();

Any update to the cart or the contents of the cart triggers a cartUpdated event with a set of targets that correspond to the list of products currently in the cart. This is because CDP does not keep track of the state of the cart and therefore not “infer” the content of the cart from past updates.

Checkout¶

For this event, you need to send the following data to CDP:

• In this example, CDP assumes that the visitor is already identified and CDP can reuse that customer instance.

• An event instance of type checkout including a customer, a transaction, and a set of targets.

• Optional: A set of target entities that represent the transaction items with the appropriate attributes set, SourceTransactionItemNumber, SourceProductNumber, and Type.

• Optional: A transaction instance with the appropriate attributes set, SourceTransactionNumber and Total.

The following is the example of implementation using the model-oriented approach:

var item1 = $A1.Target({
    SourceTransactionItemNumber: "WEB958-1",
    Type: “Purchase”,
    Subtype: “Pending”,
    SourceProductNumber: "555",
    quantity: 2,
    saleRevenue: 321.13,
    discount”: 0.00
}); //defining a transactionItem to be included in the checkout event

var item2 = $A1.Target({
    SourceTransactionItemNumber: "WEB958-2",
    Type: “Purchase”,
    Subtype: “Pending”,
    SourceProductNumber: "667",
    quantity: 1,
    saleRevenue: 23.87,
    discount: 0.00
}); //defining another transactionItem to be included in the checkout event

var transactionWEB958 = $A1.Transaction({
    SourceTransactionNumber: "WEB958",
    SourceOrganizationNumber: "12",
    Type: “Purchase”
}); //defining the transaction

// send the event
$A1.Event({
    type: “checkout”,
    customer: currentVisitor,
    transaction: transactionWEB958,
    targets: [item1, item2]
}).send();

It implies that customer “123” placed a transaction “WEB958” for a total revenue of $345. This transaction contains two transaction items. “WEB958-1” containing two products “555” for a total revenue of $321.13. “WEB958-2” containing product “667” for a total revenue of $23.87.

If you do not want to send transactions, but still want to send a checkout event, you must give a SourceTransactionNumber to the event otherwise CDP throws an API error stating that checkout events require transactions. To overcome this restriction, use the following code. It essentially tells the API to consider that there is a transaction attached to the event with SourceTransactionNumber = '', that is, an empty string that never ties to any real transaction.

var currentVisitor = $A1.Customer({
                    SourceCustomerNumber: '123456',
                    Email: '[email protected]'
                    });

                $A1.Event({
                    type: "checkout",
                    customer: currentVisitor,
                    targets:{
                            SourceTransactionNumber: ''
                            }
                    }).send();

Onsite Search¶

For this event, you need to send the following data to CDP:

• A customer object: It must contain a customer identifier, SourceCustomerNumber or Email.

• An event instance of type onsiteSearch with the SearchTerm attribute set and a customer instance.

var visitor = $A1.Customer({
    SourceCustomerNumber: "[email protected]",
    Email: "[email protected]"
    });

    var searchTerm = $A1.Target({
    SearchTerm: document.getElementById('sterm').value
    });

    $A1.Event({
    type: "onsiteSearch",
    customer: visitor,
    targets: searchTerm
    }).send();

It implies that the current visitor, “john.doe@gmail.com” has made a search on your website. The customer searched using the term “C1S1H001”.

Next Steps - CDP Entities¶

To understand in depth what data you can send through these calls, in particular which attributes are standard, see CDP Entities.