https://github.com/tracktor/react-google-tag-manager
React library for use easily the Google Tag Manager
https://github.com/tracktor/react-google-tag-manager
Last synced: 5 months ago
JSON representation
React library for use easily the Google Tag Manager
- Host: GitHub
- URL: https://github.com/tracktor/react-google-tag-manager
- Owner: Tracktor
- Created: 2023-03-16T15:25:55.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2024-06-27T09:53:38.000Z (about 2 years ago)
- Last Synced: 2025-06-18T18:04:31.242Z (about 1 year ago)
- Language: TypeScript
- Size: 323 KB
- Stars: 0
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
Awesome Lists containing this project
README
# React Google Tag Manager
[](https://badge.fury.io/js/%40tracktor%2Freact-google-tag-manager)
**Very light React library for use easily the Google Tag Manager**
- [Installation](#Installation)
- [Usage](#Usage)
- [Props and options](#Props-and-Options)
- [Hooks](#kook)
## Installation
```console
yarn add @tracktor/react-google-tag-manager
```
or
```console
npm install @tracktor/react-google-tag-manager
```
or
```console
bun add @tracktor/react-google-tag-manager
```
## Usage
```typescript jsx
import { GoogleTagManagerProvider, useGoogleTagManager } from "@tracktor/react-google-tag-manager";
const App = () => (
);
const YourComponent = () => {
const { sendEvent } = useGoogleTagManager();
return (
Your Component
sendEvent({ event: "eventName", value: "someValue" })}>
Click me
);
};
export default App;
```
## Props and options
Your can provide some props and options to the provider.
```typescript jsx
import { GoogleTagManagerProvider } from "@tracktor/react-google-tag-manager";
const App = () => (
...
);
export default App;
```
| Props | Type | Default | Description |
|---------|------------|-----------|-------------------------------------------------------------------------------------------------------------------------------|
| id | GTM-XXXXXX | undefined | Define the Google Tag Manager ID id. You can create an account to get an ID here : https://tagmanager.google.com/?hl=fr#/home |
| options | object | undefined | Provider options |
| Option | Type | Default | Description |
|---------------|--------|-----------------------------------------|-------------------------|
| scriptUrl | string | https://www.googletagmanager.com/gtm.js | Set script url to load |
| dataLayerName | string | dataLayer | Set the data layer name |
## Hooks
`useGoogleTagManager`
| Export | type | Description |
|-----------|----------|----------------|
| sendEvent | function | Send GTM event |
| id | string | The GTM id |