Acquia CDP

Examples of web event tracking

This section provides examples to explain how you can send the data to CDP for each website event that you want to track through the CDP WebTag Library.

As described in the Adding the CDP Webtag to your website, this section contains examples that showcase the model-oriented implementations.

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.

Note

Only send Transactions and TransactionItem entities if the SourceTransactionNumber and SourceTransactionItemNumber values correspond to what you are sending to CDP in the standard Transaction feed and standard Transaction Item feed. Otherwise, if the same transactions come through the WebTag with different identifiers, it creates a new transaction in CDP. This transaction is the duplicate of another transaction, thus doubling any revenue or transaction count or other metrics.

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();

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.