🎉 Check out DevCenter, our new documentation site for v2.0! (Or keep using this site for earlier versions.)

Switch to DevCenter

Close
Menu
Menu Sheet Overlay
Search

Adding the Analytics Manager

The Analytics Manager is available for version 0.15.0 and later of Mobify's progressive-web-sdk. Here's how to add the Analtyics Manager to your project files.

Installing the Analytics Manager

In web/app/store/index.js, add the following code

import analytics from 'redux-analytics'
import analyticsManager from 'progressive-web-sdk/dist/analytics/analytics-manager'

...

analyticsManager.init({
    projectSlug: AJS_SLUG,
    mobifyGAID: WEBPACK_MOBIFY_GA_ID,
    ecommerceLibrary: 'ec'          // (Required) - The GA ecommerce plugin to use ('ec' or 'ecommerce')
    debug: DEBUG
})

...

const configureStore = (initialState) => {
    const middlewares = [
        thunk,
        analytics(({type, payload}, state) => analyticsManager.distribute(type, payload, state))
    ]
    ...

Make sure to install the redux-analytics package by running npm install redux-analytics --save

Instrumenting Analytics Events

The older SDK version may not have the exact dispatch-action implementation, therefore, we will explain when these events should instrumented and the parameter it should include in the meta payload

Here is a list of libraries that you will need to instrument these events

import {createActionWithAnalytics} from 'progressive-web-sdk/dist/utils/action-creation'
import {
    EVENT_ACTION,
    Page,
    Transaction,
    Product,
    ShoppingList
} from 'progressive-web-sdk/dist/analytics/data-objects/'

Please read the Analytics Schema for details on the data objects

Pageview

Fires when the template changes

createActionWithAnalytics(
    'ACTION NAME',
    ['templateName'],
    EVENT_ACTION.pageview,
    (templateName) => (new Page({[Page.TEMPLATENAME]: templateName}))
)

Purchase

Fires when we display checkout confirmation page to the user

createActionWithAnalytics(
    'ACTION NAME',
    ['transaction', 'products'],
    EVENT_ACTION.purchase,
    (transaction, products) => (new Transaction(transaction, products))
)

IN THIS ARTICLE:

Feedback

Was this page helpful?