Meet npm Pro: unlimited public & private packages + package-based permissions.Learn more »

This package has been deprecated

Author message:

Package has been renamed to @ta-interaktiv/react-gtm, please update at your convenience.

ta-react-gtm

2.1.0 • Public • Published

GoogleTagManager

Component to use Google Tag Manager on the page. This component should only be mounted when the GMT ID has be defined.

Version: 2.1

module.exports ⇐ React.PureComponent

Set up the GTM tracking. Apart from a noscript fallback, this pretty much doesn't render anything, but sets up the GTM dataLayer in the constructor, loads the GTM.js script by Google while mounting and pushes a pageview event into the dataLayer, using the passed-in props.

Apart from props.gtmId, all props are part of the statistics object provided by the Newsnet API.

As this class extends PureComponent, it shouldn't be rerendered all the time.

Kind: Exported class
Extends: React.PureComponent

new module.exports()

Param Type Description
props.gtmId string The GTM ID to use.
props.pagetype string The pagetype (e.g. 'article').
props.category string The category of the article.
[props.subcategory] string The subcategory of the article.
[props.article_id] number The legacy article ID.
[props.premium] bool Whether this is a premium article.

Installation

yarn add ta-react-gtm

Usage

import GoogleTagManager from 'ta-react-gtm';
 
// more code ...
 
class YourComponent extends React.Component {
 
  componentDidMount() {
    // Get the Webseismo statistics object from Newsnet API here
    // NOT ACTUAL IMPLEMENTATION!
    this.setState({
      gtmObject: data.statistics.gtm,
      gtmId: data.gtmId
    })
  }
 
 
  render() {
 
    return (
      <GoogleTagManager gtmId={this.state.gtmId} {...this.state.gtmObject} />
    )
  }
}
 

Install

npm i ta-react-gtm

DownloadsWeekly Downloads

51

Version

2.1.0

License

ISC

Last publish

Collaborators

  • avatar