«Thank You» page
Introduction
The «Thank you» page is the page displayed to customers immediately after they successfully purchased their items.
On the purchase complete page, the following objects must be declared and filled: transaction
, page
, website
, user
, cart
, version
.
Required variables
page
You need to define only one variables in the digitalData.page
object. All other variables are either optional or will be automatically filled by the SegmentStream SDK.
Example:
window.digitalData = {
...,
page: {
type: 'confirmation'
},
...
}
transaction
The digitalData.transaction
object must be declared and filled on the ‘Thank you’ page.
More about the transaction object
Example:
window.digitalData = {
...,
transaction: {
orderId: "AC-4324-945"
cartId: "CART2203",
isFirst: true,
isReturning: false,
vouchers: [
"MYVOUCHER1"
],
voucherDiscount: 20,
shippingCost: 5,
shippingMethod: "Delivery",
currency: "GBP",
subtotal: 100,
total: 85,
lineItems: [
...,
{
product: {
id: "1234567890",
url: "http://website.com/product.html",
imageUrl: "http://website.com/image.png",
thumbnailUrl: "http://website.com/image_thumb.png",
name: "Big Boots",
description: "Product description",
manufacturer: "Timberland",
category: ["Footwear","Boots"],
currency: "GBP",
unitPrice: 60,
unitSalePrice: 50,
skuCode: "TBL6065RW"
},
quantity: 2,
subtotal: 100
},
...
]
},
...
}
cart
On the ‘Thank You’ page the digitalData.cart
object must describe an empty cart
Example:
window.digitalData = {
...,
cart: {
currency: "GBP",
subtotal: 0,
total: 0,
lineItems: []
},
...
}
website
You need to declare and fill in only 6 variables in the digitalData.website
object. The following 3 variables are required: website.type
, website.currency
, website.environment
. The remaining variables depend on the characteristics of your site.
Example:
window.digitalData = {
...,
website: {
region: "London",
regionId: "11",
type: "desktop",
language: "en-gb",
currency: "GBP",
environment: "production"
},
...
}
user
The composition of the digitalData.user
object strongly depends on the requirements of the project. We recommend that you fill at least the following variables: userId
, user.email
, user.isLoggedIn
, user.firstName
, user.isSubscribed
If you do not have information about a particular property of a visitor, do not declare the variable. For example: you do not know if the visitor is subscribed to the email-list.
Correct: do not declare the variabledigitalData.user.isSubscribed
.
Wrong: declare a variable and assign it a value of FALSE.
Example:
window.digitalData = {
...,
user: {
firstName: "John",
userId: "4638mn1",
email: "[email protected]",
isLoggedIn: true,
isSubscribed: false
},
...
}
version
The digitalData.version
variable must be declared and filled when loading each page of the site.
More about the version variable
Example:
window.digitalData = {
...,
version: '1.1.3',
...
}
Example
In the end, your code will be similar to:
window.digitalData = {
page: {
type: 'confirmation',
category: 'Confirmation'
},
website: {
type: "desktop",
currency: "GBP",
environment: "production"
},
user: {
firstName: "John",
userId: "4638mn1",
email: "[email protected]",
isLoggedIn: true,
isSubscribed: false
},
cart: {
currency: "GBP",
subtotal: 0,
total: 0,
lineItems: []
},
transaction: {
orderId: "AC-4324-945"
cartId: "CART2203",
isFirst: true,
isReturning: false,
vouchers: [
"MYVOUCHER1"
],
voucherDiscount: 20,
shippingCost: 5,
shippingMethod: "Delivery",
currency: "GBP",
subtotal: 100,
total: 85,
lineItems: [
{
product: {
id: "1234567890",
url: "http://website.com/product.html",
imageUrl: "http://website.com/image.png",
thumbnailUrl: "http://website.com/image_thumb.png",
name: "Big Boots",
description: "Product description",
manufacturer: "Timberland",
category: ["Footwear","Boots"],
currency: "GBP",
unitPrice: 60,
unitSalePrice: 50,
skuCode: "TBL6065RW"
},
quantity: 2,
subtotal: 100
},
]
},
version: '1.1.3'
}
/**
* SegmentStream JavaScript SDK snippet should be
* placed after the digitialData object definition
*/
For convenience, we did not list the repeating elements of the
items
andlineItems
arrays.
Other body
This document was last updated on April 13, 2020. If you notice any gaps, outdated information or simply want to leave some feedback to help us improve our documentation, please let us know!