Google Analytics 4 Page Types in Data 360

1<script>
2/**
3 * Pushes a page-view object to the sfWebInteractionsDataLayer.
4 */
5sfWebInteractionsDataLayer.push({
6  // Defines the category of the current page for mapping logic
7  pageType: "product",
8
9  // Object containing metadata specific to this page view
10  contextualAttributes: {
11    // 1. Static Attribute: A simple hardcoded string.
12    pageTypeAttr: "product-pageTypeAttr",
13
14    // 2. DOM Selector Resolver: Automatically scrapes the text content
15    // of the first <h2> tag found on the page.
16    pageTypeAttr2: SalesforceInteractions.resolvers.fromSelector("h2"),
17
18    // 3. Simple Resolver: Uses a function to return a value.
19    // .bind() ensures the function executes within the SDK's resolver context.
20    pageTypeAttr3: SalesforceInteractions.util.resolveWhenTrue.bind(
21      function () {
22        return "product-pageTypeAttr2";
23      },
24    ),
25
26    // 4. Asynchronous/Conditional Resolver:
27    // This waiting function waits for a specific condition to be met before returning data.
28    pageTypeAttrAsync: SalesforceInteractions.util.resolveWhenTrue.bind(
29      function () {
30        // Retrieves the standard Google Tag Manager dataLayer array.
31        var events = SalesforceInteractions.getValueFromNestedObject("window.dataLayer");
32
33        // Condition: Only return 'true' once the dataLayer has more than three events.
34        // (Useful for waiting until third-party tags or specific events have loaded.)
35        if (events && events.length > 3) {
36          return true;
37        } else {
38          return false;
39        }
40      },
41      undefined, // Context (defaults to window)
42      1000,      // Timeout: Stop trying after 1000ms (1 second)
43      50,        // Interval: Check the condition every 50ms
44    ),
45  },
46
47  // Boolean flag to trigger an immediate 'page_view' event to the server
48  sendEvent: true,
49});
50</script>

1<script>
2  sfWebInteractionsDataLayer = sfWebInteractionsDataLayer || [];
3</script>
4
5<!-- From Google Tag Manager documentation -->
6<script>
7  (function(w, d, s, l, i) {
8    w[l] = w[l] || [];
9    w[l].push({
10      'gtm.start': new Date().getTime(),
11      event: 'gtm.js'
12    });
13
14    var f = d.getElementsByTagName(s)[0],
15      j = d.createElement(s),
16      dl = l != 'dataLayer' ? '&l=' + l : '';
17
18    j.async = true;
19    j.src = 'https://www.googletagmanager.com/gtm.js?id=' + i + dl;
20    f.parentNode.insertBefore(j, f);
21  })(window, document, 'script', 'dataLayer', 'GTM-XXXXXX');
22</script>
23<!-- End Google Tag Manager -->

1<script>
2  sfWebInteractionsDataLayer = sfWebInteractionsDataLayer || [];
3</script>
4
5<!-- From Google Tag (gtag.js) documentation -->
6<script async src="https://www.googletagmanager.com/gtag/js?id=TAG_ID"></script>
7
8<script>
9  window.dataLayer = window.dataLayer || [];
10
11  function gtag() {
12    dataLayer.push(arguments)
13  };
14
15  gtag('js', new Date());
16  gtag('config', 'TAG_ID');
17</script>
18<!-- End Google Tag (gtag.js) -->