cherrypulp/laravel-datalayer

Datalayer helper

1.0.5 2019-10-04 09:43 UTC

This package is auto-updated.

Last update: 2022-11-25 08:26:16 UTC


README

Build Status styleci Scrutinizer Code Quality SensioLabsInsight Coverage Status

Packagist Packagist Packagist

Package description: Laravel package that generating Google's DataLayer script

Installation

Install via composer

composer require cherrypulp/laravel-datalayer

Register your Google ID

Add this ` GOOGLE_ID=YOUR_GOOGLE_ID` at the end of your .env file

Register Service Provider

Note! This and next step are optional if you use laravel>=5.5 with package auto discovery feature.

Add service provider to config/app.php in providers section

Cherrypulp\DataLayer\ServiceProvider::class,

Register Facade

Register package facade in config/app.php in aliases section

'DataLayer' => Cherrypulp\DataLayer\Facades\DataLayer::class,

Usage

In your Controllers

Push one value in the DataLayer

DataLayer::push('foo', 'bar');

Push an array of data in the DataLayer

DataLayer::pushArray([
    'user_name' => 'John Doe',
    'age' => '42',
    'country' => 'Belgium',
]);

Don't hesitate to check the prototype of the method to view all possibles options

In your View

Publish the DataLayer in the view

Just call this method in your app layout before the closing HEAD tag.

DataLayer::publish();

It will print this entire HTML code in your layout

<script>
    dataLayer = dataLayer || [];
</script>

<script>
    dataLayer.push({foo:'bar',user_name:'John Doe',age:42,country:'Belgium'});
</script>

<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','YOUR_GOOGLE_ID');</script>
<!-- End Google Tag Manager -->

Don't forget to call DataLayer::noScript() right after your BODY tag

DataLayer::noScript();

It will print the following :

<noscript><iframe src="//www.googletagmanager.com/ns.html?id=YOUR_GOOGLE_ID"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>

You can use an optional array to choose if you do not want to initialise the global JS object or/and the Google's GTM script

DataLayer::publish(['init' => false, 'script' => false]);

It will just print this

<script>
    dataLayer.push({foo:'bar',user_name:'John Doe',age:42,country:'Belgium'});
</script>

The DataLayer is reset after each call to the DataLayer::publish() method.

Others methods

Load the data from session

DataLayer::load();

Save the data in the session

DataLayer::save();

Clear the data in the session

DataLayer::clear();

Get the array data

DataLayer::getData();

Print the global JS object in the view

DataLayer::init();

It will print this in the HTML

<script>
    window.dataLayer = window.dataLayer || [];
</script>

Print the Google's GTM script in the view

The $google_id parameter is optional. If omitted, it will use the Google ID set in your .env file

DataLayer::script([$google_id = null]);
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','YOUR_GOOGLE_ID');</script>
<!-- End Google Tag Manager -->

Also, don't forget to add the no-script tag with

DataLayer::noScript([$google_id = null]);
<noscript><iframe src="//www.googletagmanager.com/ns.html?id=YOUR_GOOGLE_ID"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>

Show the content of the DataLayer (debug purpose)

DataLayer::dd();

Security

If you discover any security related issues, please email anthony@cherrypulp.com instead of using the issue tracker.

Credits

See also