ga-track
v2.4.1
Published
Google Analytics Tracking helper
Downloads
34
Readme
GA-Track
Google Analytics Tracking helper with support for GTag, ga and _gaq.
Installation
npm install ga-track
Usage
Make sure you also include your Google Analytics script as shown in the example.
import 'ga-track';
// or
import GATrack from 'ga-track';
Any element with data-ga-track
as an attribute, will be tracked on click. Here's a quick reference:
| Attribute | Description | Default |
|------------------------|-----------------------|---|
| data-ga-track
| Needed for autotracking. If a value is given it serves as category. | ga-track
|
| data-ga-track-label
| Label of the event. | Element's href
|
| data-ga-track-action
| Action of the event. | Element's textContent
|
| data-ga-track-href
| Should this be false
the link won't be navigated to. Otherwise ga-track
will wait till the track happens and then navigates. | Element's href
|
Methods
GATrack exposes a few method being the following two the most importants. It is a safe call so if Google Analytics gets blocked by an adblocker it won't throw any exceptions due to not being present.
sendEvent(category, action, label, callback, timeout)
Manually sends an event to Google Analytics.
Parameters:
category
- {string} - Event's category.
action
- {string} - Event's action.
label
- {string} - Event's label.
[callback]
- {Function} - Callback to be called once the event has been tracked.
[timeout=1000]
- Timeout after which the callback will be called if it didn't finish.
sendData()
Safely pass data to Google Analytics:
GATrack.sendData('set', 'dimension2', 'member');
Example
See the complete example.
<html>
...
</body>
...
<span>Click</span>
<span>Me</span>
<span>One</span>
<span>Time</span>
<a data-ga-track href="http://www.firstandthird.com">Link</a>
<a data-ga-track href="http://www.firstandthird.com" target="_blank">External link</a>
<script>
GaTrack.track([
{
element: 'span',
category: 'span',
label: 'click'
}
])
</script>
</body>
</html>