Cloudflare ZarazでWordPressサイトにLINE Tagのトラッキングコードを追加する
この記事では、Cloudflare Zarazを使用してLINEのトラッキングタグ（LINE Tag）をWebサイトに追加する方法が紹介されています。LINE TagはLINE公式アカウント向けのトラッキングタグで、Webサイトからの流入やコンバージョンを測定するのに活用されます。WordPressサイトを変更せずにトラッキングコードを追加することが目指され、Cloudflare Zarazを使用することでCDNエッジからコードを挿入します。料金や無料枠の管理には注意が必要です。
目次
この記事では、LINEのトラッキングタグ（LINE Tag）をWebサイトに追加するために、Cloudflare Zarazを使う方法を紹介します。「LINEDC Advent Calendar 2024」および「Cloudflare Advent Calendar 2024」8日目の記事として作成しました。
この記事の背景
運用しているWebサイトで、LINEへの動線を構築する必要がありました。その中でWebサイトからの流入（コンバージョン）などを測定するのに、LINE Tagが使えそうでしたので、試してみることにしました。
LINE Tagとは
LINE TagはLINE公式アカウント向けのトラッキングタグです。サイト上での行動と、メッセージの成果などを計測することに使える・・・らしいです。
コンバージョンを厳密に計測する必要があるわけではないのですが、実験的にテストサイトへ導入することにしました。
WordPressサイトをカスタマイズせずに、トラッキングコードを追加したい
ここで問題になったのは、トラッキングコードの追加方法です、JavaScriptコードを追加する必要がありますが、できるだけWordPressサイト側に手を入れずに実現することを目指しました。スクリプトタグを追加できるプラグインは何種類もありますが、バグや脆弱性などへのサポートコストを最小化するため、サードパーティのプラグインや自分で書いたコードをできるだけ使わない方法を模索します。
Cloudflare ZarazでCDNエッジから挿入する
今回試したのは、Cloudflare Zarazです。これならば、CDNエッジ上でトラッキングタグなどのコードを挿入できます。
Step1: LINE Tagを取得する
まずはLINE Tagのコードを取得します。タグの発行はPC画面からしかできないとのことですので、必ずPCから作業しましょう。
何種類かのタグがありますが、今回は基本となるベースコードを取得します。コードを全てコピーしておきましょう。
Step2: Cloudflare Zarazでコードを挿入する
取得したコードを挿入するため、Cloudflare ダッシュボードへ移動します。Zarazを開き、Custom HTMLを追加しましょう。
Custom HTMLでは、任意のHTMLタグを追加できます。今回は全てのトラフィックに対して実行するため、All Tracksをトリガーとし、先ほど取得したHTMLをペーストします。
これだけで設定が完了しました。あとは1日ほど様子を見ると、どれくらい実行されているかなどが確認できます。
設定してみて
Cloudflare Zarazを使うことで、Webサイトに任意のコードを簡単に追加できます。カスタムイベントなどで、任意の情報等をトラッキングコードに追加することもできる様子ですので、より詳細なトラッキングについてはこちらもお試しください。
注意が必要なことは料金です。100万イベントまで無料で使うことができますが、これはサイトに対する合計値です。そのため、複数のツールを設定すると、その数だけ無料枠を早く使い切ります。
Zarazのコストとサイト改修・運用保守コスト、どちらが高くなりそうかを比較検討しながら選定しましょう。