Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/spatie/laravel-googletagmanager
Easily setup and send data to Google Tag Manager in Laravel apps
https://github.com/spatie/laravel-googletagmanager
Last synced: 15 days ago
JSON representation
Easily setup and send data to Google Tag Manager in Laravel apps
- Host: GitHub
- URL: https://github.com/spatie/laravel-googletagmanager
- Owner: spatie
- License: mit
- Created: 2015-06-04T09:03:44.000Z (over 9 years ago)
- Default Branch: main
- Last Pushed: 2024-03-01T12:57:50.000Z (8 months ago)
- Last Synced: 2024-09-08T13:44:58.804Z (2 months ago)
- Language: PHP
- Homepage: https://murze.be/2015/06/easily-setup-and-send-data-to-google-tag-manager-in-laravel-apps/
- Size: 102 KB
- Stars: 402
- Watchers: 23
- Forks: 56
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Funding: .github/FUNDING.yml
- License: LICENSE.md
Awesome Lists containing this project
- laravel-awesome - Laravel Googletagmanager - Easily setup and send data to Google Tag Manager (Popular Packages)
README
# Google Tag Manager integration for Laravel
[](https://packagist.org/packages/spatie/laravel-googletagmanager)
[](LICENSE.md)
[](https://scrutinizer-ci.com/g/spatie/laravel-googletagmanager)
[](https://packagist.org/packages/spatie/laravel-googletagmanager)
An easy [Google Tag Manager](http://www.google.com/tagmanager/) implementation for your Laravel 5 application.
Laravel 4 version: [spatie/laravel4-googletagmanager](https://github.com/spatie/laravel4-googletagmanager)
Spatie is a webdesign agency in Antwerp, Belgium. You'll find an overview of all our open source projects [on our website](https://spatie.be/opensource).
## Support us
[
](https://spatie.be/github-ad-click/laravel-googletagmanager)
We invest a lot of resources into creating [best in class open source packages](https://spatie.be/open-source). You can support us by [buying one of our paid products](https://spatie.be/open-source/support-us).
We highly appreciate you sending us a postcard from your hometown, mentioning which of our package(s) you are using. You'll find our address on [our contact page](https://spatie.be/about-us). We publish all received postcards on [our virtual postcard wall](https://spatie.be/open-source/postcards).
## Google Tag Manager
Google Tag Manager allows you manage tracking and marketing optimization with AdWords, Google Analytics, et al. without editing your site code. One way of using Google Tag Manager is by sending data through a `dataLayer` variable in javascript after the page load and on custom events. This package makes managing the data layer easy.
For concrete examples of what you want to send through the data layer, check out Google Tag Manager's [Developer Guide](https://developers.google.com/tag-manager/devguide).
You'll also need a Google Tag Manager ID, which you can retrieve by [signing up](https://tagmanager.google.com/#/home) and creating an account for your website.
## Install
You can install the package via Composer:
```bash
composer require spatie/laravel-googletagmanager
```
In Laravel 5.5 and up, the package will automatically register the service provider and facade
In L5.4 or below start by registering the package's the service provider and facade:
```php
// config/app.php
'providers' => [
...
Spatie\GoogleTagManager\GoogleTagManagerServiceProvider::class,
],
'aliases' => [
...
'GoogleTagManager' => Spatie\GoogleTagManager\GoogleTagManagerFacade::class,
],
```
*The facade is optional, but the rest of this guide assumes you're using the facade.*
Next, publish the config files:
```bash
php artisan vendor:publish --provider="Spatie\GoogleTagManager\GoogleTagManagerServiceProvider" --tag="config"
```
Optionally publish the view files. It's **not** recommended to do this unless necessary so your views stay up-to-date in future package releases.
```bash
php artisan vendor:publish --provider="Spatie\GoogleTagManager\GoogleTagManagerServiceProvider" --tag="views"
```
If you plan on using the [flash-functionality](#flashing-data-for-the-next-request) you must install the GoogleTagManagerMiddleware, after the StartSession middleware:
```php
// app/Http/Kernel.php
protected $middleware = [
...
\Illuminate\Session\Middleware\StartSession::class,
\Spatie\GoogleTagManager\GoogleTagManagerMiddleware::class,
...
];
```
## Configuration
The configuration file is fairly simple.
```php
return [
/*
* The Google Tag Manager id, should be a code that looks something like "gtm-xxxx".
*/
'id' => '',
/*
* Enable or disable script rendering. Useful for local development.
*/
'enabled' => true,
/*
* If you want to use some macro's you 'll probably store them
* in a dedicated file. You can optionally define the path
* to that file here, and we will load it for you.
*/
'macroPath' => '',
/*
* The key under which data is saved to the session with flash.
*/
'sessionKey' => '_googleTagManager',
/*
* Configures the Google Tag Manager script domain.
* Modify this value only if you're using "Google Tag Manage: Web Container" client
* to serve gtm.js for your web container. Else, keep the default value.
*/
'domain' => 'www.googletagmanager.com',
];
```
During development, you don't want to be sending data to your production's tag manager account, which is where `enabled` comes in.
Example setup:
```php
return [
'id' => 'GTM-XXXXXX',
'enabled' => env('APP_ENV') === 'production',
'macroPath' => app_path('Services/GoogleTagManager/Macros.php'),
'sessionKey' => '_googleTagManager',
// Base domain used in your GTM server container
'domain' => 'gtm.yourdomain.com',
];
```
## Usage
### Basic Example
First you'll need to include Google Tag Manager's script. Google's docs recommend doing this right after the body tag.
```
{{-- layout.blade.php --}}
@include('googletagmanager::head')
{{-- ... --}}
@include('googletagmanager::body')
{{-- ... --}}
```
Your base dataLayer will also be rendered here. To add data, use the `set()` function.
```php
// HomeController.php
public function index()
{
GoogleTagManager::set('pageType', 'productDetail');
return view('home');
}
```
This renders:
```html
dataLayer = [{"pageType":"productDetail"}];
/* Google Tag Manager's script */
```
#### Flashing data for the next request
The package can also set data to render on the next request. This is useful for setting data after an internal redirect.
```php
// ContactController.php
public function getContact()
{
GoogleTagManager::set('pageType', 'contact');
return view('contact');
}
public function postContact()
{
// Do contact form stuff...
GoogleTagManager::flash('formResponse', 'success');
return redirect()->action('ContactController@getContact');
}
```
After a form submit, the following dataLayer will be parsed on the contact page:
```html
dataLayer = [{"pageType":"contact","formResponse":"success"}];
/* Google Tag Manager's script */
```
### Other Simple Methods
```php
// Retrieve your Google Tag Manager id
$id = GoogleTagManager::id(); // GTM-XXXXXX
// Check whether script rendering is enabled
$enabled = GoogleTagManager::isEnabled(); // true|false
// Enable and disable script rendering
GoogleTagManager::enable();
GoogleTagManager::disable();
// Add data to the data layer (automatically renders right before the tag manager script). Setting new values merges them with the previous ones. Set also supports dot notation.
GoogleTagManager::set(['foo' => 'bar']);
GoogleTagManager::set('baz', ['ho' => 'dor']);
GoogleTagManager::set('baz.ho', 'doorrrrr');
// [
// 'foo' => 'bar',
// 'baz' => ['ho' => 'doorrrrr']
// ]
```
### Dump
GoogleTagManager also has a `dump()` function to convert arrays to json objects on the fly. This is useful for sending data to the view that you want to use at a later time.
```
Product
```
```js
$('[data-gtm-click]').on('click', function(event) {
event.preventDefault();
var self = this;
dataLayer.push({
'event': 'productClick',
'ecommerce': {
'click': {
'products': $(self).data('gtm-product')
}
},
'eventCallback': function() {
document.location = $(self).attr('href');
}
});
});
```
### DataLayer
Internally GoogleTagManager uses the DataLayer class to hold and render data. This class is perfectly usable without the rest of the package for some custom implementations. DataLayer is a glorified array that has dot notation support and easily renders to json.
```php
$dataLayer = new Spatie\GoogleTagManager\DataLayer();
$dataLayer->set('ecommerce.click.products', $products->toJson());
echo $dataLayer->toJson(); // {"ecommerce":{"click":{"products":"..."}}}
```
If you want full access to the GoogleTagManager instances' data layer, call the `getDataLayer()` function.
```php
$dataLayer = GoogleTagManager::getDataLayer();
```
### Macroable
Adding tags to pages can become a repetitive process. Since this package isn't supposed to be opinionated on what your tags should look like, the GoogleTagManager is macroable.
```php
GoogleTagManager::macro('impression', function ($product) {
GoogleTagManager::set('ecommerce', [
'currencyCode' => 'EUR',
'detail' => [
'products' => [ $product->getGoogleTagManagerData() ]
]
]);
});
GoogleTagManager::impression($product);
```
In the configuration you can optionally set the path to the file that contains your macros.
## Changelog
Please see [CHANGELOG](CHANGELOG.md) for more information what has changed recently.
## Contributing
Please see [CONTRIBUTING](https://github.com/spatie/.github/blob/main/CONTRIBUTING.md) for details.
## Security
If you've found a bug regarding security please mail [[email protected]](mailto:[email protected]) instead of using the issue tracker.
## Postcardware
You're free to use this package, but if it makes it to your production environment we highly appreciate you sending us a postcard from your hometown, mentioning which of our package(s) you are using.
Our address is: Spatie, Kruikstraat 22, 2018 Antwerp, Belgium.
We publish all received postcards [on our company website](https://spatie.be/en/opensource/postcards).
## Credits
- [Sebastian De Deyne](https://github.com/sebastiandedeyne)
- [All Contributors](../../contributors)
## License
The MIT License (MIT). Please see [License File](LICENSE.md) for more information.