Sample Ecommerce Sitemap

Review this sample sitemap.

Example

1SalesforceInteractions.init({
2  consents: new Promise(resolve => {
3    const { OptIn, OptOut } = SalesforceInteractions.ConsentStatus
4    const purpose = SalesforceInteractions.ConsentPurpose.Tracking
5    const provider = 'Test Provider'
6    
7    // user clicks button that grants consent
8    document.getElementById('opt-in')
9      .addEventListener(
10        'click', 
11        () => resolve([{ purpose, provider, status: OptIn }]), 
12        { once: true }
13      )
14
15    // user clicks button that revokes consent
16    document.getElementById('opt-out')
17      .addEventListener(
18        'click', 
19        () => resolve([{ purpose, provider, status: OptOut }]), 
20        { once: true }
21      )
22  })
23}).then(() => {
24  // set the log level during sitemap development to see potential problems
25  SalesforceInteractions.log.level = 'debug'
26
27  const { 
28    cashDom,
29    listener, 
30    resolvers,
31    sendEvent,
32    util,
33    CartInteractionName,
34    CatalogObjectInteractionName,
35    OrderInteractionName,
36  } = SalesforceInteractions
37
38  const global = {
39    listeners: [
40      // capture email address when a user signs up
41      listener('submit', '.user-signup-form', (actionEvent) => {
42        const emailAddress = cashDom("#user_email").val()
43        if (emailAddress) {
44          sendEvent({ 
45            interaction: {
46              name: 'Email Sign Up'
47            },
48            user: {
49              attributes: { 
50                email: emailAddress,
51                eventType: 'contactPointEmail' }
52            }
53          })
54        }
55      })
56    ],
57    
58    // attach optional data to every actionEvent that is sent out
59    onActionEvent: (actionEvent) => {
60      const email = window && window._userInfo && window._userInfo.email
61      if (email) {
62          actionEvent.user = actionEvent.user || {}
63          actionEvent.user.attributes = actionEvent.user.attributes || {}
64          actionEvent.user.attributes.emailAddress = email
65      }
66      return actionEvent
67    }
68  }
69
70  const productIdResolver = resolvers.fromSelectorAttribute('.product', 'data-id')
71  
72  const productPage = {
73    name: 'product',
74    isMatch: () => /products/.test(window.location.pathname),
75    // capture the product being viewed when the page is opened
76    interaction: {
77      name: CatalogObjectInteractionName.ViewCatalogObject,
78      catalogObject: {
79        type: 'Product',
80        id: productIdResolver,
81        attributes: {
82          name: resolvers.fromSelector('.product-title'),
83          url: resolvers.fromHref(),
84          imageUrl: resolvers.fromSelectorAttribute('.product img', 'src')
85        },
86        relatedCatalogObjects: {
87          Color: resolvers.fromSelectorAttributeMultiple('.color-value', 'data-attr-value')
88        }
89      }
90    },
91    listeners: [
92      // capture when the user adds this product to their cart
93      listener('click', '.add-to-cart', () => {
94        sendEvent({
95          interaction: {
96            name: CartInteractionName.AddToCart,
97            lineItem: {
98              catalogObjectType: 'Product',
99              catalogObjectId: productIdResolver(),
100              quantity: parseInt(cashDom('.product .quantity input').val(), 10),
101              price: parseFloat(cashDom('.product .price').text().trim())
102            }
103          }
104        })
105      }),
106      // capture when the user shares the product to social media
107      listener('click', '.share', () => {
108        sendEvent({
109          interaction: {
110            name: CatalogObjectInteractionName.ShareCatalogObject,
111            catalogObject: {
112              type: 'Product',
113              id: productIdResolver()
114            }
115          }
116        })
117      })
118    ]
119  }
120
121  const cartPage = {
122    name: 'Cart',
123    isMatch: () => /^\/cart/.test(window.location.href),
124    listeners: [
125      // capture when a user removes an item from their cart
126      listener('click', '.remove-from-cart', (event) => {
127        const $cartItem = cashDom(event.target).parents('.cart-item').first()
128        sendEvent({
129          interaction: {
130            name: CartInteractionName.RemoveFromCart,
131            lineItem: {
132              catalogObjectType: 'Product',
133              catalogObjectId: $cartItem.attr('data-id'),
134              quantity: parseInt($cartItem.find('.quantity').text().trim(), 10),
135            }
136          }
137        })
138      })
139    ]
140  }
141
142  const orderConfirmationPage = {
143    name: 'Order Configuration',
144    isMatch: /\/confirmation/.test(window.location.href),
145    // capture when a user completes an order
146    interaction: {
147      name: OrderInteractionName.Purchase,
148      order: {
149        id: resolvers.fromSelectorAttribute('.order', 'data-id'),
150        totalValue: parseFloat(resolvers.fromSelector('.order .total').trim()),
151        lineItems: () => cashDom('.order .line-items').map((index, el) => {
152          const $lineItem = cashDom(el)
153          return {
154            catalogObjectType: 'Product',
155            catalogObjectId: $lineItem.attr('data-id'),
156            quantity: parseInt($lineItem.find('.quantity').text().trim(), 10)
157          }
158        })
159      }
160    }
161  }
162
163  const pageTypeDefault = {
164    name: 'default'
165  }
166  
167  SalesforceInteractions.initSitemap({
168    global,
169    pageTypeDefault,
170    pageTypes: [cartPage, orderConfirmationPage, productPage]
171  })
172})

Sample for Profile Events

To implement profile events like Identity, ContactPointEmail, and ContactPointPhone refer this example.

Example

1SalesforceInteractions.listener('click', '#register', () => {
2        SalesforceInteractions.reinit()
3        const email = window.email
4        const phone = window.phonenumber
5        const firstname = window.firstname
6        const lastname = window.lastname
7
8        if (email) {
9          SalesforceInteractions.sendEvent({
10            user: {
11              attributes: {
12                email: email,
13                eventType: 'contactPointEmail'
14
15              }
16            }
17          })
18        }
19        if (phone) {
20          SalesforceInteractions.sendEvent({
21            user: {
22              attributes: {
23                phoneNumber: phone,
24                eventType: 'contactPointPhone'
25              }
26            }
27          })
28        }
29        SalesforceInteractions.sendEvent({
30          user: {
31            attributes: {
32              firstName: firstname || '',
33              lastName: lastname || '',
34              eventType: 'identity',
35              isAnonymous: 0
36            }
37          }
38        })
39      })