anthonypauwels/datalayer

一个辅助包,用于在页面上生成Google的DataLayer脚本

0.1.2 2024-01-24 22:03 UTC

This package is auto-updated.

Last update: 2024-09-09 18:23:40 UTC


README

一个辅助包,用于在页面上生成Google的DataLayer脚本。

安装

使用Composer要求此包。

composer require anthonypauwels/datalayer

Laravel无自动发现

如果您不使用自动发现,请将ServiceProvider添加到config/app.php中的providers数组中

Anthonypauwels\DataLayer\Laravel\ServiceProvider::class,

然后,将此行添加到您的facades中config/app.php

'DataLayer' => Anthonypauwels\DataLayer\Laravel\DataLayer::class,

最后,在config/datalayer.php中添加您的GTM-ID。

<?php
return [
    'gtm_id' => 'GTM-XXXXXXXX'
];

使用方法

无Laravel

您必须创建一个SessionHandler对象。处理器使用会话在页面间传递数据。然后您可以使用构造函数将SessionHandler传递给DataLayerHandler

use Anthonypauwels\DataLayer\DataLayerHandler;
use Anthonypauwels\DataLayer\SessionHandler;

$datalayer = new DataLayerHandler( 
                new SessionHandler(), 
                'GTM-XXXXXXXX'
            );

有Laravel

该包默认为Laravel应用程序提供了一个Facade。您可以直接调用方法或使用别名。

use Anthonypauwels\DataLayer\Laravel\DataLayer;

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

API文档

以下示例使用Laravel Facade DataLayer

在您的控制器中

向DataLayer推送一个值

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

向DataLayer推送一个数据数组

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

不要犹豫查看方法的原型以查看所有可能的选项。

在您的视图中

在视图中发布DataLayer

只需在app布局的关闭标签之前调用此方法。

DataLayer::publish();

它将在布局中打印整个HTML代码

<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=
'//#/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXXXXXX');</script>
<!-- End Google Tag Manager -->

不要忘记在您的标签后立即调用DataLayer::noScript()

DataLayer::noScript();

它将打印以下内容

<noscript><iframe src="//#/ns.html?id=GTM-XXXXXXXX"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>

您可以使用一个可选数组来选择是否不初始化全局JS对象,初始化Google Tag Manager脚本或发布后清除数据。

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

它将只打印以下内容

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

Blade指令

如果您使用Laravel的DataLayerHandler,您可以使用自定义Blade指令在视图中插入代码,而无需直接使用facade

@datalayerInit()

instead of

{{ DataLayer::init() }}
@datalayerScript()

instead of

{{ DataLayer::script() }}
@datalayerNoScript()

instead of

{{ DataLayer::noScript() }}
@datalayerPublish()

instead of

{{ DataLayer::publish() }}
@datalayerPush([
    'user_name' => 'John Doe',
])

instead of

{{ DataLayer::pushData([
    'user_name' => 'John Doe',
]) }}

DataLayer在每个调用DataLayer::publish()方法后清除,除非将选项clear设置为false

向DataLayer推送一个数据数组

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

其他方法

从会话加载数据

DataLayer::load();

将数据保存到会话

DataLayer::save();

清除会话中的数据

DataLayer::clear();

获取数组数据

DataLayer::getData();

在视图中打印全局JS对象

DataLayer::init();

它将在HTML中打印以下内容

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

在视图中打印Google Tag Manager脚本

$gtm_id参数是可选的。如果省略,它将使用在您的.env文件中设置的Google ID。

DataLayer::script([$gtm_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=
'//#/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXXXXXX');</script>
<!-- End Google Tag Manager -->

此外,不要忘记添加带有。

DataLayer::noScript([$gtm_id = null]);
<noscript><iframe src="//#/ns.html?id=GTM-XXXXXXXX"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>

显示DataLayer的内容(调试目的)

DataLayer::dd();

要求

PHP 8.0或更高版本

另请参阅