Analytics Reporting Integration in SFRA

To record analytics events in SFRA (Storefront Reference Architecture), you construct the corresponding URL patterns by calling helper methods in the reportingUrls.js module. Each of these helper methods constructs URLs and returns an array of URLs. This array is then passed as a variable (pdict.reportingURLs) to the template reportingUrls.isml.

SFRA Analytics Reporting Helper Script

The app_storefront_base/cartridge/scripts/reportingUrls.js script provides the following helper methods:


getAccountOpenReportingURLs(registeredCustomerCount)         // AccountOpen event
getBasketOpenReportingURLs(currentBasket)                    // BasketOpen event 
getCheckoutReportingURLs(UUID, step, stepName)               // Checkout event
getItemPromoReportingURLs(productLineItem, reportingURLs)    // ItemPromo event
getOrderPlacedReportingURLs(orderCount, reportingURLs)       // UserOrders event 
getOrderPromoReportingURLs(priceAdjustments, reportingURLs)  // OrderPromo event
getOrderReportingURLs(order)                                 // Order and Item events
getProductSearchReportingURLs(productSearch)                 // ProductSearch event
getShippingPromoReportingURLs(shipment, reportingURLs)       // ShippingPromo event 

SFRA Analytics Reporting Template

The following code snippet shows the body of the app_storefront_base/cartridge/templates/default/reporting/reportingUrls.isml template:


<isloop items="${pdict.reportingURLs}" var="URL">
	<isinclude url="${URL}" />
</isloop>

Any SFRA template that wants to record analytics events must include this template. For example, here is a code snippet taken from the app_storefront_base/cartridge/templates/default/checkout/confirmation/confirmation.isml template:


<isif condition="${pdict.reportingURLs && pdict.reportingURLs.length}">
	<isinclude template="reporting/reportingUrls" />
</isif>

Example Usage

The following code shows how controllers in SFRA generates an array of URLs for analytics events and passes the array to templates during rendering.

This code snippet is taken from the app_storefront_base/cartridge/controllers/Order.js controller:


var reportingUrlsHelper = require('*/cartridge/scripts/reportingUrls'); // Instantiate helper module

	...

var reportingURLs = reportingUrlsHelper.getOrderReportingURLs(order);   // Call helper method

if (!req.currentCustomer.profile) {
   passwordForm = server.forms.getForm('newPasswords');
   passwordForm.clear();
   res.render('checkout/confirmation/confirmation', {  // Rendering template includes 
      order: orderModel,                               // the reportingUrls.isml template 
      returningCustomer: false,
      passwordForm: passwordForm,
      reportingURLs: reportingURLs                     // Pass in URL array
      });
} else {
   res.render('checkout/confirmation/confirmation', {  // Rendering template includes 
      order: orderModel,                               // the reportingUrls.isml template
      returningCustomer: true,
      reportingURLs: reportingURLs                     // Pass in URL array
      });
}

Related Links

Analytics

Analytics Metrics Definitions

Analytics Reporting Integration

Analytics Reporting Integration Events

Analytics Reporting Integration URL Patterns

Analytics Reporting Integration in SiteGenesis (SGJC)

X Privacy Update: We use cookies to make interactions with our websites and services easy and meaningful, to better understand how they are used and to tailor advertising. By continuing to use this site you are giving us your consent to do this.