このブログで
Turboに
変更した
Turboの バージョン
7.2.0
を
npm list --depth=0 | grep @hotwired/turbo ├── @hotwired/turbo@7.2.0
元々の Turbolinkの ページビューイベント送信コード
// Turbolinkで遷移した場合の初期化処理 document.addEventListener('turbolink:load', function(event) { const url = event.data.url; dataLayer.push({ 'event': 'turbolinks_load_pageView', 'virtualUrl': url, }); previousUrl = event.data.url; });
Turboの ページビューイベントの 送信コード
変更点は
* イベント名が、turbolink:load
からturbo:load
へ
* urlのevent.data.url
からevent.detail.url
へ
// Turboで遷移した場合の初期化処理 document.addEventListener('turbo:load', function(event) { const url = event.detail.url; dataLayer.push({ 'event': 'turbolinks_load_pageView', 'virtualUrl': url, }); previousUrl = event.detail.url; });
GTMでの 設定
GTM(Google Tag Manager)では
カスタムイベントトリガーの 作成
トリガーの
タイプ
カスタムイベントイベント名
turbolinks_load_pageview
この
トリガーの 発生場所
すべてのカスタムイベント
タグを 作成
GA4の
設定は
コメント