> For the complete documentation index, see [llms.txt](https://rangle.gitbook.io/redux-beacon/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://rangle.gitbook.io/redux-beacon/index/google-analytics.md).

# GoogleAnalytics

* [Setup](/redux-beacon/index/google-analytics.md#setup)
* [Usage](/redux-beacon/index/google-analytics.md#usage)
* [Event Definitions](/redux-beacon/index/google-analytics.md#event-definitions)

## Setup

1. Sign up for Google Analytics and [create a new web property](https://support.google.com/analytics/answer/1008015?hl=en).
2. Add the [JavaScript Tracking Snippet](https://developers.google.com/analytics/devguides/collection/analyticsjs/) to your site. Update the tracking snippet with your [tracking Id](https://support.google.com/analytics/answer/1008080).

   During development and testing it is often helpful to use the debug version of analytics.js. Follow the instructions [here](https://developers.google.com/analytics/devguides/collection/analyticsjs/debugging) to enable it.
3. Install the target:

   ```bash
    npm install --save @redux-beacon/google-analytics
   ```

### *Multiple Trackers Setup*

* This target supports named trackers. Add the following line to the tracking snippet for each named tracker:

  ```javascript
  ga('create', 'UA-XXXXX-Z', 'auto', 'clientTracker');
  ```
* The tracker can be specified in each [event definition](/redux-beacon/index/google-analytics.md#event-definitions)

  using the `tracker` property.

### *Ecommerce Plugin Setup*

* Add this line to the end of your tracking snippet: `ga('require', 'ecommerce');`. This line must be added **after** you call `ga('create', 'UA-XXXXX-Y')`.

  Google Analytics will *fail silently* if you try to use these events without adding the require call in your initial tracking code. It is also **not** recommended to use GA's basic analytics plugin if you're also going to use the enhanced ecommerce plugin.

### *Enhanced Ecommerce Plugin Setup*

* Add this line to the end of your tracking snippet: `ga('require', 'ec');`. This line must be added **after** you call `ga('create', 'UA-XXXXX-Y')`.

  Google Analytics will *fail silently* if you try to use these events without adding the require call in your initial tracking code. It is also **not** recommended to use GA's basic analytics plugin if you're also going to use the basic ecommerce plugin.

## Usage

```javascript
import GoogleAnalytics from '@redux-beacon/google-analytics';

// Create or import an events map.
// See "getting started" pages for instructions.

const ga = GoogleAnalytics();

const gaMiddleware = createMiddleware(eventsMap, ga);
const gaMetaReducer = createMetaReducer(eventsMap, ga);
```

## Event Definitions

* [`pageView`](/redux-beacon/index/google-analytics.md#pageview)
* [`event`](/redux-beacon/index/google-analytics.md#event)
* [`timing`](/redux-beacon/index/google-analytics.md#timing)
* [`socialInteraction`](/redux-beacon/index/google-analytics.md#socialinteraction)
* [`exception`](/redux-beacon/index/google-analytics.md#exception)
* [`ecommItem`](/redux-beacon/index/google-analytics.md#ecommitem)
* [`ecommTransaction`](/redux-beacon/index/google-analytics.md#ecommtransaction)
* [`ecommSend`](/redux-beacon/index/google-analytics.md#ecommsend)
* [`ecommClear`](/redux-beacon/index/google-analytics.md#ecommclear)
* [`ecommImpression`](/redux-beacon/index/google-analytics.md#ecommimpression)
* [`ecommProduct`](/redux-beacon/index/google-analytics.md#ecommproduct)
* [`ecommPromotion`](/redux-beacon/index/google-analytics.md#ecommpromotion)
* [`ecommAction`](/redux-beacon/index/google-analytics.md#ecomaction)

Don't see your event listed? Please submit a pull request to the [Redux Beacon repository](https://github.com/rangle/redux-beacon) with the missing event. Use the source of the existing `event-helpers` to guide your work. If you need any support feel free to make the pull request with all you're able to do. We can fill in the gaps from there.

### pageView

#### Docs:

<https://developers.google.com/analytics/devguides/collection/analyticsjs/pages>

```javascript
import { trackPageView } from '@redux-beacon/google-analytics';

const pageView = trackPageView((action, prevState, nextState) => {
 return {
   page: /* fill me in */,
   title: /* (optional) */,
   location: /* (optional) */,
 };
}, /* (optional) tracker names array or tracker name string */ );
```

{% hint style="danger" %}
The last line of the tracking snippet `ga('send', 'pageview')` hits Google Analytics with a page view that matches the first loaded route. If you're tracking page views using Redux Beacon, be sure to remove this line so the initial page load isn't recorded twice.
{% endhint %}

### event

#### Docs:

<https://developers.google.com/analytics/devguides/collection/analyticsjs/events>

```javascript
import { trackEvent } from '@redux-beacon/google-analytics';

const event = trackEvent((action, prevState, nextState) => {
  return {
    category: /* fill me in */,
    action: /* fill me in */,
    label: /* (optional) */,
    value: /* (optional) */,
  };
}, /* (optional) tracker names array or tracker name string */ );
```

### timing

#### Docs:

<https://developers.google.com/analytics/devguides/collection/analyticsjs/user-timings>

```javascript
import { trackTiming } from '@redux-beacon/google-analytics';

const userTiming = trackTiming((action, prevState, nextState) => {
  return {
    category: /* fill me in */,
    var: /* fill me in */,
    value: /* fill me in */,
    label: /* (optional) */,
  };
}, /* (optional) tracker names array or tracker name string */ );
```

### socialInteraction

#### Docs:

<https://developers.google.com/analytics/devguides/collection/analyticsjs/social-interactions>

```javascript
import { trackSocialInteraction } from '@redux-beacon/google-analytics';

const socialInteraction = trackSocialInteraction((action, prevState, nextState) => {
  return {
    network: /* fill me in */,
    action: /* fill me in */,
    target: /* fill me in */,
  };
}, /* (optional) tracker names array or tracker name string */ );
```

### exception

#### Docs:

<https://developers.google.com/analytics/devguides/collection/analyticsjs/exceptions>

```javascript
import { trackException } from '@redux-beacon/google-analytics';

const exception = trackException((action, prevState, nextState) => {
  return {
    description: /* (optional) */,
    isFatal: /* (optional) */,
  };
}, /* (optional) tracker names array or tracker name string */ );
```

Don't need to track `description` or `isFatal`?

```javascript
import { trackException } from '@redux-beacon/google-analytics';

const noop = () => {};
const exception = trackException(noop, /* (optional) tracker names array or tracker name string */ );
```

### ecommItem

#### Docs:

<https://developers.google.com/analytics/devguides/collection/analyticsjs/ecommerce>

#### Requires:

[Ecommerce Plugin Setup](/redux-beacon/index/google-analytics.md#ecommerce-plugin-setup)

```javascript
import { trackEcommItem } from '@redux-beacon/google-analytics';

const ecommItem = trackEcommItem((action, prevState, nextState) => {
  return {
    id: /* fill me in */,
    name: /* fill me in */,
    sku: /* (optional) */,
    category: /* (optional) */,
    price: /* (optional) */,
    quantity: /* (optional) */,
  };
}, /* (optional) tracker names array or tracker name string */ );
```

### ecommTransaction

#### Docs:

<https://developers.google.com/analytics/devguides/collection/analyticsjs/ecommerce>

#### Requires:

[Ecommerce Plugin Setup](/redux-beacon/index/google-analytics.md#ecommerce-plugin-setup)

```javascript
import { trackEcommTransaction } from '@redux-beacon/google-analytics';

const ecommTransaction = trackEcommTransaction((action, prevState, nextState) => {
  return {
    id: /* fill me in */,
    affiliation: /* (optional) */,
    revenue: /* (optional) */,
    shipping: /* (optional) */,
    tax: /* (optional) */,
  };
}, /* (optional) tracker names array or tracker name string */ );
```

### ecommSend

#### Docs:

<https://developers.google.com/analytics/devguides/collection/analyticsjs/ecommerce>

#### Requires:

[Ecommerce Plugin Setup](/redux-beacon/index/google-analytics.md#ecommerce-plugin-setup) or [Enhanced Ecommerce Plugin Setup](/redux-beacon/index/google-analytics.md#enhanced-ecommerce-plugin-setup)

```javascript
import { ecommSend } from '@redux-beacon/google-analytics';

const ecommSendSignal = ecommSend(/* (optional) tracker names array or tracker name string */);
```

### ecommClear

#### Docs:

<https://developers.google.com/analytics/devguides/collection/analyticsjs/ecommerce>

#### Requires:

[Ecommerce Plugin Setup](/redux-beacon/index/google-analytics.md#ecommerce-plugin-setup) or [Enhanced Ecommerce Plugin Setup](/redux-beacon/index/google-analytics.md#enhanced-ecommerce-plugin-setup)

```javascript
import { ecommClear } from '@redux-beacon/google-analytics';

const ecommClearSignal = ecommClear(/* (optional) tracker names array or tracker name string */);
```

### ecommImpression

#### Docs:

<https://developers.google.com/analytics/devguides/collection/analyticsjs/enhanced-ecommerce>

#### Requires:

[Enhanced Ecommerce Plugin Setup](/redux-beacon/index/google-analytics.md#enhanced-ecommerce-plugin-setup)

```javascript
import { trackEcommImpression } from '@redux-beacon/google-analytics';

const ecommImpression = trackEcommImpression((action, prevState, nextState) => {
  return {
    id: /* either this or the name field has to be filled */,
    name: /* either this or the id field has to be filled */,
    list: /* (optional) */,
    brand: /* (optional) */,
    category: /* (optional) */,
    variant: /* (optional) */,
    position: /* (optional) */,
    price: /* (optional) */,
  };
}, /* (optional) tracker names array or tracker name string */ );
```

### ecommProduct

#### Docs:

<https://developers.google.com/analytics/devguides/collection/analyticsjs/enhanced-ecommerce>

#### Requires:

[Enhanced Ecommerce Plugin Setup](/redux-beacon/index/google-analytics.md#enhanced-ecommerce-plugin-setup)

```javascript
import { trackEcommProduct } from '@redux-beacon/google-analytics';

const ecommProduct = trackEcommProduct((action, prevState, nextState) => {
  return {
    id: /* either this or the name field has to be filled */,
    name: /* either this or the id field has to be filled */,
    brand: /* (optional) */,
    category: /* (optional) */,
    variant: /* (optional) */,
    price: /* (optional) */,
    quantity: /* (optional) */,
    coupon: /* (optional) */,
    position: /* (optional) */,
  };
}, /* (optional) tracker names array or tracker name string */ );
```

### ecommPromotion

#### Docs:

<https://developers.google.com/analytics/devguides/collection/analyticsjs/enhanced-ecommerce>

#### Requires:

[Enhanced Ecommerce Plugin Setup](/redux-beacon/index/google-analytics.md#enhanced-ecommerce-plugin-setup)

```javascript
import { trackEcommPromotion } from '@redux-beacon/google-analytics';

const ecommPromotion = trackEcommPromotion((action, prevState, nextState) => {
  return {
    id: /* either this or the name field has to be filled */,
    name: /* either this or the id field has to be filled */,
    creative: /* (optional) */,
    position: /* (optional) */,
  };
}, /* (optional) tracker names array or tracker name string */ );
```

### ecommAction

#### Docs:

<https://developers.google.com/analytics/devguides/collection/analyticsjs/enhanced-ecommerce>

#### Requires:

[Enhanced Ecommerce Plugin Setup](/redux-beacon/index/google-analytics.md#enhanced-ecommerce-plugin-setup)

```javascript
import { trackEcommAction } from '@redux-beacon/google-analytics';

const ecommAction = trackEcommAction((action, prevState, nextState) => {
  return {
    actionName: /* fill me in */
    id: /* fill me in if the actionName is "purchase" or "refund" */,
    affiliation: /* (optional) */,
    revenue: /* (optional) */,
    tax: /* (optional) */,
    shipping: /* (optional) */,
    coupon: /* (optional) */,
    list: /* (optional) */,
    step: /* (optional) */,
    option: /* (optional) */,
  };
}, /* (optional) tracker names array or tracker name string */ );
```