GTM Integration

Tracking visitor analytics and behavior are essential in order to provide accurate and visitor-specific search and category page results. UNBXD analyzes visitor events, such as product clicks, products added to cart, orders, etc. These events are tracked using browser cookies. With this information, a profile is built for every visitor, based on his/her affinity to different categories, brands, or prices.

This information is then aggregated and analyzed for two purposes:

• Generating reports
• Providing relevant and personalized search & category pages results

When visitors browse through your store, the integrated trackers log everything visitors do – the products they visit, orders, even the various store properties they interact with. We take that information, analyze it, and assemble a detailed profile of the visitor. We know their browsing patterns, preferences and can even determine susceptibility to merchandising campaigns. The trackers are unique tracking codes that must be configured onto the store properties that yield an interaction. We call this interaction as an “event”, for example, click on the “Add to Cart” button.

The visitor profiles help fetch relevant and personalized products as search results. It also helps in generating detailed reports.

📘

NOTE

For Unbxd E-commerce Search to function correctly on your site, Unbxd Analytics must be configured.

Introduction to GTM

Google Tag Manager is a free tool that allows you to manage and deploy marketing tags (snippets of code or tracking pixels) on your website (or mobile app) without having to modify the code.

Here’s a very simple example of how GTM works. Information from one data source (your website) is shared with another data source (Analytics) through Google Tag Manager. GTM becomes very handy when you have lots of tags to manage because all the code is stored in one place.

Basic components of GTM

Following are the basic components within Google Tag Manager:

• Tags – Tags are tracking codes and code fragments that tell GTM what action to take on that page.

For example: Sending searched query to Unbxd analytics.

• Triggers: Triggers specify the conditions under which a Tag should fire.For example: A trigger with a condition to only fire a Tag when a user views URLs containing the path /search/.
• Variables: Variables are values used in triggers and tags to filter when a specific tag should fire. GTM provides built-in variables and allows you to create custom user-defined variables. For example: A ‘click’ class variable has a value name (such as a word string) assigned to buttons on the website.
• DataLayer: The dataLayer is a JSON that contains name value pairs of data points you wish to pass from your website into GTM. (And GTM can then, in turn, pass on to any tags that are managed in GTM, including Unbxd tags.)

Requirements for Unbxd tracking through GTM

Unbxd analytics scripts need to be loaded across all the pages. We require a tag which will need to be loaded on all the pages. Below is the required code block for Unbxd analytics script. This should be loaded before other Unbxd tracking scripts and must be added to all pages.

// Container ID is present in GTM-XXXX format in GTM Dashboard
// HTML ID can be found in the url. Eg:
// containers/422XXXX/workspaces/20 , 20 is the HTML ID

<script type="text/javascript">
   /* * * CONFIGURATION * * */
   // Replace the value with the Unbxd Site Key and API Key.

   var UnbxdSiteName = "{{UNBXD_SITE_NAME}}";
   var UnbxdApiKey = "{{UNBXD_API_KEY}}";

   /* * * DON'T EDIT BELOW THIS LINE * * */
   (function() {
   var ubx = document.createElement('script');
   ubx.type = 'text/javascript';
   ubx.async = true; ubx.src='//d21gpk1vhmjuf5.cloudfront.net/unbxdAnalytics.js';
   ubx.addEventListener('load', function() {
   window.google_tag_manager[{{Container ID}}].onHtmlSuccess({{HTML ID}}); });
   (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(ubx);
   })();
</script>

The above JS snippet needs to be added in a tag and also enable Built-In Variables, i.e., Container ID and HTML ID without fail.

• TagName: UnbxdAnalyticsScript
• TagType: Custom HTML Tag
• Trigger: AllPagesPageView

Search Query Tracker

A Search hit event is tracked to understand the query and intent of your visitors. Each search query is tracked to enable visitor per-query analytics. A typical search hit event involves,SearchQueryTrigger, through GTM to integrate this event, we need to follow the below approach:

1. Create a Trigger in GTM to catch the search Query on form hit.

Trigger Configuration:

• TriggerName: UnbxdSearchQueryTrigger
• Trigger Type: Custom Event
• Event Name: SearchQuery
• TriggerFiresOn: All custom events

2. Create a variable in GTM to fetch the query from the dataLayer.

Variable Configuration:

• Variable Name: UnbxdSearchQueryPayload
• Variable Variable Type: Data Layer Variable
• Data Layer Variable Name: SearchQueryPayload

HTML Content:

3. Create a JavaScript tag with the details below.

   Tag Configuration:

   • Tag Name: UnbxdSearchQueryTag
   • Tag Type: Custom HTML
   • HTML Content:

// Pass payload to Unbxd.track function
// to call the tracker API

<script type="text/javascript">
   var u_payload = {{UnbxdSearchQueryPayload}};
   if (Unbxd && typeof Unbxd.track === 'function'
       && u_payload.hasOwnProperty("query")) {
       Unbxd.track("search", u_payload);
   } else {
       console.error('unbxdAnalytics.js is not loaded or payload incorrect!')
   }
</script>

Pushing the event to the dataLayer through a search query.

// Add payload to Datalayer variable SearchQueryPayload
// Should be triggered on search form submit
// Please change selectors for form and input box

<script​ ​type=​"text/javascript"​>
jQuery('#input_form_id').on("submit", function(){
       var searchQuery = jQuery("#myInput").val();
       if (searchQuery.length >= 1) {
           window.dataLayer = window.dataLayer || [];
               dataLayer.push(
               {
                   'event': 'SearchQuery',
                   'SearchQueryPayload':
                   {
                     'requestId' : '{{unbxd-request-id}}',
                     'query' : '{{searchQuery}}'
                    }
               }
           );
       }
   });
</script>

Payload Details:

On a search query, please pass the searched query to the dataLayer as shown above. The event flow will be:

• As soon as the SearchQuery event got pushed data layer.
• This initiates the trigger UnbxdSearchQueryTrigger which we created in the step-1.
• UnbxdSearchQueryTrigger executes the tag: UnbxdSearchQueryTag which we created in step-3.
• Inside UnbxdSearchQueryTag, we have added Unbxd analytics search tracker code.
• Search tracker code gets the searched query from the variable UnbxdSearchQueryPayload, which we created in step 2.
• Finally searched query will be updated in Unbxd analytics database for the particular siteKey.

Product Click Unbxd Tracker

Tracking the product clicks of visitors helps our search engine to understand their preferences over other products on the listing page. This information is used to compute popular products and render relevant and personalized results. It needs to be tracked in case of search and navigation pages. It is also integrated if the customer is using the recommendation widgets.

Through GTM to integrate this event, we need to follow the below approach:

1. Create a Trigger in GTM to catch the click event.

Trigger Configuration:

• TriggerName: UnbxdProductClickTrigger
• TriggerType: Custom Event
• EventName: ProductClick
• TriggerFiresOn: All Custom Events

2. Create a Variable in GTM to fetch the product details from the dataLayer. Variable Configuration:

• VariableName: UnbxdProductClickPayload
• Variable Type: Data Layer Variable
• Data Layer Variable Name: ProductClickPayload

3. Create a JavaScript tag with the details below.

   Tag Configuration:

   • Tag Name: UnbxdProductClickTag
   • Tag Type: Custom HTML
   • HTML Content:

   // Pass payload to Unbxd.track function
   // to call the tracker API
   
   <script type="text/javascript">
      var u_payload = {{UnbxdProductClickPayload}};
      if (Unbxd && typeof Unbxd.track === 'function'
          && u_payload.hasOwnProperty("pid")
          && u_payload.hasOwnProperty ("prank")){
          Unbxd.track('click', u_payload);
        } else {
          console.error('unbxdAnalytics.js is not loaded or payload incorrect!')
      }
   </script>

   Pushing the event to the Data Layer through the Product Click.

// Add payload to Datalayer variable ProductClickPayload
// Should be triggered on product click

<script type="text/javascript">
   window.dataLayer = window.dataLayer || [];
   dataLayer.push(
     {
      'event': 'ProductClick',
      'ProductClickPayload':
       {
         'requestId': 'REQUEST ID',
         'pid': 'PRODUCT ID',
         'variantId': 'VARIANT ID OF SELECTED VARIANT',
         'prank': 'RANK',
         'query': 'SEARCH QUERY'
       }
     });
</script>

Payload Details:

// Add payload to Datalayer variable ProductOrderedPayload
// Should be triggered on order success page
// for all products in order added to a list

<script  type="text/javascript">
   window.dataLayer = window.dataLayer || [];
   dataLayer.push(
     {
      'event': 'ProductOrder',
      'ProductsOrderedPayload':
       [{
           'requestId': 'REQUEST ID',
           'pid': 'PRODUCT ID',
           'variantId': 'VARIANT ID OF SELECTED VARIANT',
           'qty': 'QUANTITY SELECTED',
           'price': 'UNIT PRICE FOR PRODUCT'
       },
       {
           'requestId': 'REQUEST ID',
           'pid': 'PRODUCT ID',
           'variantId': 'VARIANT ID OF SELECTED VARIANT',
           'qty': 'QUANTITY SELECTED',
           'price': 'UNIT PRICE FOR PRODUCT'
       },
       {
           'requestId': 'REQUEST ID',
           'pid': 'PRODUCT ID',
           'variantId': 'VARIANT ID OF SELECTED VARIANT',
           'qty': 'QUANTITY SELECTED',
           'price': 'UNIT PRICE FOR PRODUCT'
       }]
     });
</script>

// Add payload to Datalayer variable ProductOrderedPayload
// Should be triggered on order success page
// for all products in order added to a list

<script  type="text/javascript">
   window.dataLayer = window.dataLayer || [];
   dataLayer.push(
     {
      'event': 'ProductOrder',
      'ProductsOrderedPayload':
       [{
           'requestId': 'REQUEST ID',
           'pid': 'PRODUCT ID',
           'variantId': 'VARIANT ID OF SELECTED VARIANT',
           'qty': 'QUANTITY SELECTED',
           'price': 'UNIT PRICE FOR PRODUCT'
       },
       {
           'requestId': 'REQUEST ID',
           'pid': 'PRODUCT ID',
           'variantId': 'VARIANT ID OF SELECTED VARIANT',
           'qty': 'QUANTITY SELECTED',
           'price': 'UNIT PRICE FOR PRODUCT'
       },
       {
           'requestId': 'REQUEST ID',
           'pid': 'PRODUCT ID',
           'variantId': 'VARIANT ID OF SELECTED VARIANT',
           'qty': 'QUANTITY SELECTED',
           'price': 'UNIT PRICE FOR PRODUCT'
       }]
     });
</script>

Search Impression

A search impression event is fired when a search results page loads for the first time, and whenever results changes on applying pagination, autoscroll, sort, and filters. For each of these action, unique Ids of the products visible on search page should be sent as payload. Through GTM to integrate this event we need to follow the below approach:

1. Create a Trigger in GTM to catch the search impression

Trigger Configuration

• TriggerName: ​ UnbxdSearchImpressionTrigger
• TriggerType: ​ Custom Event​
• EventName: SearchImpression
• TriggerFiresOn: All Custom Events

2. Create Variable in GTM to fetch the list of product Ids from the dataLayer.

Variable Configuration

• VariableName: UnbxdSearchImpressionPayload
• Variable Type: Data Layer Variable
• Data Layer Variable Name: SearchImpressionPayload

2. Create a javascript tag with the below details.

Tag Configuration

• Tag Name: UnbxdSearchImpressionTag
• Tag Type: Custom HTML
• HTML Content:

// Pass payload to Unbxd.track() function
// to call the tracker API

<script type="text/javascript">
   var u_payload = {{UnbxdSearchImpressionPayload}};
   if (Unbxd && typeof Unbxd.track === 'function'
       && u_payload.hasOwnProperty("pids_list")
       && u_payload.hasOwnProperty("query")){
           Unbxd.track('search_impression',u_payload);
   } else {
       console.error('unbxdAnalytics.js is not loaded or payload incorrect!')
   }
</script>

3. Pushing event to the dataLayer when the search page loads.

// Add payload to Datalayer variable SearchImpressionPayload
// Should be triggered on search result load


<script type="text/javascript">
   window.dataLayer = window.dataLayer || [];
   dataLayer.push(
     {
      'event': 'SearchImpression',
      'SearchImpressionPayload':
       {
         'requestId' : '{{unbxd-request-id}}',
         'pids_list': [LIST OF UNIQUE ID OF PRODUCTS],
         'query': 'search_query'
       }
     });
</script>

Payload Details

Events Flow will be:

1. As soon as the ‘SearchImpression’ event got pushed to the dataLayer.
2. This initiates the trigger UnbxdSearchImpressionTrigger which we created in step 1.
3. UnbxdSearchImpressionTrigger executes the tag UnbxdSearchImpressionTag ​which we created in step 3.
4. Inside UnbxdSearchImpressionTag we have added an Unbxd analytics search impression tag.
5. Search tracker code gets the data from variable UnbxdSearchImpressionPayload ​which we created in step 2.
6. Finally, UnbxdSearchImpressionTrigger event data will be updated in the Unbxd analytics database for the particular site key.

Product Page View

Product Page View indicates the total number of visits made to the product details page (PDP) by the visitor, irrespective of the source (search result page, category page, search engine, email, marketing campaigns, etc.). This can be tracked by passing the product ID in the payload.

To integrate this event through GTM, we need to follow the approach below:

1. Create a Trigger in GTM to catch the product view.

Trigger Configuration

• TriggerName: UnbxdProductViewTrigger
• TriggerType: Custom Event
• EventName: ProductView
• TriggerFiresOn: All Custom Events.

2. Create a Variable in GTM to fetch the product ID from the dataLayer.

Variable Configuration

• VariableName: UnbxdProductViewPayload
• Variable Type: Data Layer Variable
• Data Layer Variable Name: ProductViewPayload

3. Create a Javascript tag with the below details

Tag Configuration

• Tag Name: UnbxdProductViewTag
• Tag Type: Custom HTML
• HTML Content:

// Pass payload to Unbxd.track function
// to call the tracker API

<script type="text/javascript">
   var u_payload = {{UnbxdProductViewPayload}};
   if (Unbxd && typeof Unbxd.track === 'function'
       && u_payload.hasOwnProperty("pid")){
       Unbxd.track('product_view', u_payload);
     } else {
       console.error('unbxdAnalytics.js is not loaded or payload incorrect!')
   }
</script>

4. Pushing the event to the dataLayer through a product view.

// Add payload to Datalayer variable ProductViewPayload
// Should be triggered when a user lands on product page

<script type="text/javascript">
   window.dataLayer = window.dataLayer || [];
   dataLayer.push(
     {
      'event': 'ProductView',
      'ProductViewPayload':
       {
         'requestId': 'REQUEST ID',
         'pid': 'PRODUCT ID',
         'variantId': 'VARIANT ID OF SELECTED VARIANT'
       }
     });
</script>

Payload Details

Events Flow will be:

1. As soon as the ‘Productview` event was pushed to the dataLayer,
2. This initiates the trigger UnbxdProductViewTrigger which we created in step 1.
3. UnbxdProductViewTrigger executes the tag UnbxdProductViewTag, which we created in step 3.
4. Inside UnbxdProductViewTrigger we have added an Unbxd analytics product view tag.
5. Product view tracker code gets the data from the variable UnbxdProductViewPayload which we created in step-2.
6. Finally, UnbxdProductViewTrigger event data will be updated in the Unbxd analytics database for the particular siteKey.

Facets Unbxd Tracker

A Facet event tracks the guided navigation on the Product Listing Page. The event query will list the specific filters the shopper has selected to narrow down the results on the search results page.

To track the facets a shopper has chosen on the Search page through GTM, we need to follow the below approach:

1. Create a Trigger in GTM to catch the product view.

Trigger Configuration

• TriggerName: UnbxdFacetTrigger
• TriggerType: Custom Event
• EventName: UnbxdFacet
• TriggerFiresOn: All Custom Events

2. Create Variable in GTM to fetch the selected facet from the dataLayer.

Variable Configuration

• VariableName: UnbxdFacetPayload
• Variable Type: Data Layer Variable
• Data Layer Variable Name: FacetPayload

3. Create a JavaScript tag with the details below.

Tag Configuration

• Tag Name: UnbxdFacetTag
• Tag Type: Custom HTML
• HTML Content:

// Pass payload to Unbxd.track function
// to call the tracker API

<script type="text/javascript">
   var u_payload = {{UnbxdFacetPayload}};
   if (Unbxd && typeof Unbxd.track === 'function'
       && u_payload.hasOwnProperty("query")
       && u_payload.hasOwnProperty("facets")) {
       Unbxd.track('facets',u_payload);
   } else {
       console.error('unbxdAnalytics.js is not loaded or payload incorrect!')
   }
</script>

📘

Point to Remember

Note that in case of the search listing page, the Unbxd.track, function will have arguments as “query” and “facets”, and in case of category listing page, it will be “page”, “pagetype”, and “facets”.

4. Pushing the event to the dataLayer when the facet is selected.

// Add payload to Datalayer variable FacetPayload
// Should be triggered on search page
// when a user selects a facet

<script  type="text/javascript">
   window.dataLayer = window.dataLayer || [];
   dataLayer.push(
     {
      'event': 'UnbxdFacet',
      'FacetPayload':
       {
           'requestId': 'REQUEST ID',
           'facets': {"facet_name": ["facet_value", "facet_value"],
                      "facet_name": ["facet_value"]},
           'query': 'QUERY VALUE'
       }
     });
</script>

Payload Details

Events Flow will be:

1. As soon as the “UnbxdFacet” event got pushed to the dataLayer.
2. This initiates the trigger UnbxdFacetTrigger, which we created in step 1.
3. UnbxdFacetTrigger executes the tag UnbxdFacetTag: which we created in step 3.
4. Inside UnbxdFacetTrigger we have added an Unbxd analytics facet tag.
5. The facet tracker code gets the data from the variable UnbxdFacetPayload, which we created in step 2.
6. Finally, “facet” event data will be updated in the Unbxd analytics database for the particular siteKey.

Autosuggest

Events from Autosuggest

In this section, we will give examples of events that may originate from the user’s interaction with the Autosuggest widget. Hence, suggestion-related metadata should be sent with the payload. This will cover the GTM-based approach for integrating the autosuggest events.

Search

UnbxdAutosuggestSearchTrigger

Through GTM to integrate this event we need to follow below approach:

1. Create Trigger in GTM to catch the search Query on form hit.

Trigger Configuration

• TriggerName: UnbxdAutosuggestSearchTrigger
• Trigger Type: Custom Event
• Event Name: AutosuggestSearchTrigger
• TriggerFiresOn: All custom events

2. Create a Variable in GTM to fetch the query from the dataLayer.

Variable Configuration

• Variable Name: UnbxdAutosuggestSearchPayload
• Variable Variable Type: Data Layer Variable
• Data Layer Variable Name: AutosuggestSearchPayload

3. Create a JavaScript tag with the details below.

Tag Configuration

• Tag Name: UnbxdAutosuggestSearchTag
• Tag Type: Custom HTML

HTML Content:

<script type='text/javascript'>
   var payload = {{UnbxdAutosuggestSearchPayload}}
   if (Unbxd && typeof Unbxd.track === 'function') {
       Unbxd.track('search', payload)
   } else {
       console.error('unbxdAnalytics.js is not loaded!')
   }
</script>

4. While pushing the event to the dataLayer through a search from the Auto Suggest box, the payload will vary based on the suggestion type that is selected in Autosuggest as follows:

   In case it is IN_FIELD Suggestion which is selected and submitted, the datalayer push will have the following payload:

<script type="text/javascript">
jQuery('#input_form_id').on("submit", function(){
    var searchQuery = jQuery("#myInput").val();
    if (searchQuery.length >= 1) {
        window.dataLayer = window.dataLayer || [];
            dataLayer.push(
                   'event': 'AutosuggestSearchTrigger',
                   'AutosuggestSearchPayload':{
                       query: '',
                       autosuggestParams:  {
                           'autosuggest_type': 'IN_FIELD',
                           'autosuggest_suggestion': '{{suggestion}}',
                           'field_name': '{{infield-name}}',
                           'field_value': '{{infield-value}}',
                           'src_field': '{{src-field-name}}',
                           'internal_query': '{{original-query}}'
                       }
                   }
            }
        );
    }
});
</script>

Payload Details: IN_FIELD Autosuggest

In case it is POPULAR_PRODUCT suggestion which is selected and submitted:

<script type= "text/javascript">
jQuery('#input_form_id').on("submit", function(){
    var searchQuery = jQuery("#myInput").val();
    if (searchQuery.length >= 1) {
        window.dataLayer = window.dataLayer || [];
            dataLayer.push(
            {
                'event': 'AutosuggestSearchTrigger',
                'AutosuggestSearchPayload': {
                   query: '',
                   autosuggestParams:  {
                     'autosuggest_type': 'POPULAR_PRODUCT',
                     'pid': '{{uniqueId-of-the-products}}',
                     'unbxdprank': '{{suggestion-type}}',
                     'internal_query': '{{original-query}}'
                 }
               }
            }
        );
    }
});
</script>

Payload Details: POPULAR_PRODUCT Autosuggest

<script type="text/javascript">
jQuery('#input_form_id').on("submit", function(){
    var searchQuery = jQuery("#myInput").val();
    if (searchQuery.length >= 1) {
        window.dataLayer = window.dataLayer || [];
            dataLayer.push(
            {
               'event': 'AutosuggestSearchTrigger',
               'AutosuggestSearchPayload': {
                   query: '',
                   autosuggestParams:  {
                       'autosuggest_type': 'KEYWORD_SUGGESTION',
                       'autosuggest_suggestion': '{{suggestion}}',
                       'field_name': '{{infield-name}}',
                       'field_value': '{{infield-value}}',
                       'src_field': '{{src-field-name}}',
                       'internal_query': '{{original-query}}'
                   }
               }
           }
        );
    }
});
</script>

Payload Details: KEYWORD_SUGGESTION Autosuggest

Click

📘

NOTE

Autosuggest click event only needs to be fired in the case of popular product suggestions when it directly redirects to PDP.

UnbxdAutosuggestClickTrigger: Through GTM to integrate this event we need to follow below approach:

1. Create Trigger in GTM to catch the search Query on form hit.

Trigger Configuration

• TriggerName: UnbxdAutosuggestClickTrigger
• Trigger Type: Custom Event
• Event Name: AutosuggestClickTrigger
• TriggerFiresOn: All custom events

2. Create a Variable in GTM to fetch the query from the dataLayer.

Variable Configuration

• Variable Name: UnbxdAutosuggestClickPayload
• Variable Variable Type: Data Layer Variable
• Data Layer Variable Name: AutosuggestClickPayload

3. Create a JavaScript tag with the below details.

Tag Configuration

• Tag Name: UnbxdAutosuggestClickTag
• Tag Type: Custom HTML
• HTML Content:

<script type='text/javascript'>
   var payload = {{ UnbxdAutosuggestClickPayload }}
   if (Unbxd && typeof Unbxd.track === 'function') {
       Unbxd.track('click', payload)
   } else {
       console.error('unbxdAnalytics.js is not loaded!')
   }
</script>

4. Pushing the event to the dataLayer through a search from Auto Suggest box:

<script type= "text/javascript">
jQuery('#input_form_id').on("submit", function(){
    var searchQuery = jQuery("#myInput").val();
    if (searchQuery.length >= 1) {
        window.dataLayer = window.dataLayer || [];
            dataLayer.push(
            {
                'event': 'AutosuggestClickTrigger',
                'AutosuggestClickPayload': {
                   query: '',
                   autosuggestParams:  {
                     'autosuggest_type': 'POPULAR_PRODUCT',
                     'pid': '{{uniqueId-of-the-products}}',
                     'unbxdprank': '{{suggestion-type}}',
                     'internal_query': '{{original-query}}'
                 }
               }
            }
        );
    }
});
</script>

Payload Details: Autosuggest Selection (Search Submit)

AddToCart

UnbxdAutosuggestAddtoCartTrigger: Through GTM to integrate this event we need to follow below approach:

1. Create a Trigger in GTM to catch the search query when the form is hit.

Trigger Configuration

• TriggerName: UnbxdAutosuggestAddtoCartTrigger
• Trigger Type: Custom Event
• Event Name: AutosuggestAddtoCartTrigger
• TriggerFiresOn: All custom events

2. Create a Variable in GTM to fetch the query from the dataLayer.

Variable Configuration

• Variable Name: UnbxdAutosuggestAddtoCartPayload
• Variable Variable Type: Data Layer Variable
• Data Layer Variable Name: AutosuggestAddtoCartPayload

3. Create a JavaScript tag with the below details.

Tag Configuration

• Tag Name: UnbxdAutosuggestAddtoCartTag
• Tag Type: Custom HTML
• HTML Content:

<script type='text/javascript'>
   var payload = {{ UnbxdAutosuggestAddtoCartPayload }}
   if (Unbxd && typeof Unbxd.track === 'function') {
       Unbxd.track('addToCart', payload)
   } else {
       console.error('unbxdAnalytics.js is not loaded!')
   }
</script>