This page provides instructions to configure WebTag 2.0 using Google Tag Manager (GTM).
Use the following checklist to configure WebTag:
S.No. | Task | Description |
---|---|---|
1 | Configure the Acquia Global tag (WebTag 2.0) | CDP - Global is a default essential tag for GTM. |
3 | Configure the Acquia Customer Object tag | CDP - Customer Object is a default essential tag for GTM. |
4 | Configure optional tags | The following are the default primary tags for GTM: |
Configuring the Acquia Global tag (WebTag 2.0)
- In the GTM user interface, click Tags > New.
- Name the tag as CDP - Global.
- Click Tag Configuration.
- In Choose tag type, click Custom HTML.
In HTML, create the Acquia Global tag script:
<script> var $A1Config = { webtagId: "your-webtag-id", // Paste your webtagId value provided by Acquia. tenantId: 999, // Example set the static tenant ID. host: "//url.endpoint.com" // Set the service endpoint URL according to your hosted environment and cloud region. }; </script> <script src="https://scripts.agilone.com/latest/acquia-cdp-webtag.js"></script>
- In Advanced Settings, set Tag firing options to Once per page.
Click Triggering and set the triggering process to fire the tag at Initialization - All Pages.
If you are using Google Tag Manager consent mode support, you must select the Consent Initialization - All Pages option.
- Click Save.
Configuring the Acquia Customer Object tag
- In the GTM user interface, click Tags > New.
- Name the tag as CDP - Customer Object.
- Click Tag Configuration.
- In Choose tag type, click Custom HTML.
In HTML, create the Acquia Customer Object script:
<script> var visitor = {"id" : "{{GA - ClientID}}"}; if ("{{GA - Data Layer - User Email}}" != "unknown") { visitor.email = "{{GA - Data Layer - User Email}}"; } var $a1vis = $A1.Customer(visitor); </script>
- In Advanced Settings > Tag Sequencing, do the following:
- Check the Fire a tag before CDP - Customer Object fires checkbox.
- In Setup Tag, select CDP - Global.
- Click Triggering and set the triggering process to fire the tag at All Page - Page View.
- Click Save.
Configuring CDP - Login
- In the GTM user interface, click Tags > New.
- Name the tag as CDP - Login.
- Click Tag Configuration.
- In Choose tag type, click Custom HTML.
In HTML, create the Login script:
<script> var $a1event = {type: "Login", customer: $a1vis}; alignhere $A1.Event($a1event).send(); </script>
- In Advanced Settings > Tag Sequencing, do the following:
- Check the Fire a tag before CDP - login fires checkbox.
- In Setup Tag, select CDP - Customer Object.
- Click Triggering and set the triggering process to fire the tag at User Logged In - Window Loaded as Window Loaded or any other trigger applicable.
- Click Save.
Configuring CDP - Logout
Refer to the CDP - Login example and replace the HTML script with the following:
<script>
var $a1event = {type: "Logout", customer: $a1vis};
$A1.Event($a1event).send();
</script>
Configuring CDP - Products Browsed - (PDP - Product Details Page)
Refer to the CDP - Login example and replace the HTML script with the following:
<script>
var $a1prod = {productId: "{{PDP - Product SKU - JS}}"};
var $a1event = {type: "productBrowsed", customer: $a1vis, targets: $a1prod};
$A1.Event($a1event).send();
</script>
Configuring CDP - Cart Updated - Product Details Page (PDP) or Product List Page (PLP) for Add to Cart
Refer to the CDP - Login example and replace the HTML script with the following:
<script>
var $a1prod = {productId: "{{PDP - Product SKU - JS}}"};
var $a1event = {type: "cartUpdated", customer: $a1vis, targets: $a1prod};
$A1.Event($a1event).send();
</script>
Configuring CDP - Category Browsed - (PLP - Product List Page)
Refer to the CDP - Login example and replace the HTML script with the following:
<script>
var $a1cat = {SourceProductCategoryNumber: "{{Page Path}}"};
var $a1event = {type: "categoryBrowsed", customer: $a1vis, targets: $a1cat};
$A1.Event($a1event).send();
</script>
Configuring CDP - Search
Refer to the CDP - Login example and replace the HTML script with the following:
<script>
var $a1search = {terms: "{{Site Search Term}}"};
var $a1event = {type: "onsiteSearch", customer: $a1vis, targets: $a1search};
$A1.Event($a1event).send();
</script>
Configuring CDP - Checkout
Refer to the CDP - Login example and replace the HTML script with the following:
<script>
var _ix = {};
_ix.order = dataLayer[0];
_ix.orderId = _ix.order.transactionId;
_ix.total = _ix.order.transactionSubtotal;
_ix.price = [];
_ix.skus = [];
_ix.quantity = [];
_ix.items = [];
for (var x in _ix.order.transactionProducts) {
_ix.items.push({
id: _ix.orderId + "-" + (x + 1),
type: "Purchase",
subType: "pending",
productId: _ix.order.transactionProducts[x].sku,
quantity: _ix.order.transactionProducts[x].quantity,
saleRevenue: _ix.order.transactionProducts[x].Price * _ix.order.transactionProducts[x].quantity,
discount: 0
});
}
var $tx = {
id: _ix.orderId,
type: "Purchase"
};
var $a1event = {
type: "checkout",
customer: $a1vis,
transaction: $tx,
targets: _ix.items
};
$A1.Event($a1event).send();
</script>