Why Gemfury? Push, build, and install  RubyGems npm packages Python packages Maven artifacts PHP packages Go Modules Debian packages RPM packages NuGet packages

Repository URL to install this package:

Details    
  state
  views
  package.json
  index.js
  README.md
Size: Mime:
  README.md

@doodle/tagmanager

A redux/redux-saga connector that provides actions, reducers and sagas for interacting with Google Tag Manager. It communicates with the Tag Manager through the "Data Layer".

Install

yarn install @doodle/tagmanager

Add tagmanager script:

<html>
  <head>
    <!-- other head stuff -->

    <%- include(`${nodeModulesPath}/@doodle/tagmanager/views/head.ejs`); %>
  </head>
  <body>
    <%- include(`${nodeModulesPath}/@doodle/tagmanager/views/body.ejs`); %>

    <!-- other body stuff -->
  </body>
</html>
// root saga
import { all, call } from 'redux-saga/effects';

import { tagManagerSaga } from '@doodle/tagmanager';

export default function* rootSaga(options = {}) {
  yield all([
    /* ... other sagas */
    call(tagManagerSaga, options.tagManager),
  ]);
}

Dispatch action that pushes values into the data layer:

dispatch(
  pushDataLayer({
    event: 'gtmEvent',
    eventCategory: 'userInteraction',
    eventNonInteraction: 'False',
    eventAction: 'userLogin',
    eventLabel: undefined, //flush datalayer value in order to not mix them up between events
    eventValue: undefined, //flush datalayer value in order to not mix them up between events
  })
);

Development

yarn
yarn start