WordPressサイトでダウンロード数をカウントする【プラグインで解決】

2020-07-29
プラグイン

WordPressサイトに設置したダウンロードリンクのクリック数(ダウンロード数)をカウントする方法です。

WordPressでダウンロード数をカウントする方法はいくつかありますが、私は色々失敗した結果、プラグイン「WP Google Analytics Events」を使った方法で成功しました。(失敗した方法は参考資料として記事後半にまとめています)

このプラグインとGoogleアナリティクスを連携すれば、リンクごとのダウンロード数を計測することができるようになります。

ようやく成功した「プラグインを使い、Googleアナリティクスのクリックイベントを計測する方法」について書いておきますね。

クリック数を計測するプラグイン「WP Google Analytics Events」

WordPressでダウンロード数やクリック数をカウントする方法として、一番簡単なのは「Simple Download Monitor」というダウンロードボタンの設置プラグインを使った方法だと思うのですが、過去にAMPプラグインとの不具合が起きたので、私は使用をやめました。(この件の詳細はこちらで

代わりに、Googleアナリティクスの目標設定にある「イベントトラッキング機能」を使って、ダウンロード数(クリック数)をカウントする方法に切り替えることに。

そこで見つけたのが「WP Google Analytics Events」というプラグインです。

このプラグインは、ダウンロードボタンにクラス名を割り当てるだけで、簡単にダウンロード数などのイベントトラッキングをカウントすることができます。

では、導入実践編に移ります。

WP Google Analytics Eventsの使い方と設定方法

プラグインの新規追加で「WP Google Analytics Events」をインストールし、有効化します。(プラグイン > 新規追加 > WP Google Analytics Events > インストール > 有効化)

“使用中のWordPressバージョンで未検証”となっていますが、問題なく作動しています。(WordPress 5.4.2以降)

設定画面に入り、赤枠のところを記入していきます。

「General Setting(一般設定)」の設定

Google Analytics Tracking ID
GoogleアナリティクスのトラッキングIDを入力します。
(確認方法:アナリティクスの管理 > トラッキング情報 > トラッキングコード)

Snippet type to add
2017年以降のGoogleアナリティクスを使ってるならデフォルトでOK(Global Site Tag)
※補足:アナリティクスとユニバーサルアナリティクスの違い(外部サイト)

設定後は「変更を保存」をクリックし、次の「Click Tracking(クリックトラッキング)」タブに移ります。

Click Tracking(クリックトラッキング)の登録

「Add New」で新しいイベントを登録します。赤枠が必須項目、その他は任意です。

  • Selector → ダウンロード名(英数字ならなんでもOK)
  • Selector Type → class
  • Event Category → download
  • Event Action → click
  • Event Label → カウント管理用のイベント名(※なくてもOK)
  • Event Value →そのまま
  • Non-Interaction → そのまま

記入後、Add Click Eventをクリックすればプラグイン側の処理は完了です!

WordPressにダウンロードボタンを設置する(カウント用)

次に、WordPressサイト側のダウンロードボタンに、カウント用のクラス名をつけます。

ダウンロードボタンはブロック追加の「メディア > ファイル」を選択し、ダウンロード用のファイルを選べば簡単に作ることができます。

仕上がりはこんな感じですね↓

このダウンロードボタン(リンク)に、先ほど「WP Google Analytics Events」の「Selector」で設定したクラス名をつけます。ダウンロードリンクを選択し、右側の設定画面にある「追加CSSクラス」のところに「Selector」のクラス名を入力。

カスタムhtmlでダウンロードリンクを作っている場合は、<a>タグで囲まれているリンクにclassを追加します。こんな感じで。

<a class="downloadimages(←任意のクラス名)" href="画像のURL">ダウンロード</a>

カスタムhtmlでダウンロードボタンを作る方法はこちらで。

ダウンロードボタンを実装するHTMLコード【Googleアドセンス風】 – freespace

WordPress公式のAMPプラグインとの不具合が発覚し、以前使っていた「Si…
officehojo.com

以上で設置完了です。あとはGoogleアナリティクスでカウントするだけ。

Googleアナリティクスでイベントを計測する【目標の設定】

Googleアナリティクスのホーム画面下にある「管理 > 目標」へ移動します。ここでお問い合わせの件数や動画の再生回数など、いろんなイベントをトラッキングすることができます。

「新しい目標」をクリックし、以下の流れで登録します。

  1. 目標設定:
    • 「カスタム」を選択。
  2. 目標の説明:
    • 名前は管理用なのでなんでもOK。
    • タイプは「イベント」を選択
  3. 目標の詳細:
    • カテゴリ…download
    • アクション…click
    • ラベル…クラス名(Selectorと同じ名前)
    • 値…そのままでOK(任意)

保存を押して、全部設定完了です!

あとはGoogleアナリティクスでちゃんとカウントされているか確認します。

Googleアナリティクスでイベント計測を確認

ダウンロードリンクのカウントが問題なく作動しているのか確認しておきます。手っ取り早く確認するなら「リアルタイム計測」がおすすめ。アナリティクス > リアルタイム > イベントへ移動。

この画面を表示したまま、自分のスマホやPCなどの別ウィンドウで、実際のダウンロードリンクをクリックしてみてください。

うまく動いていれば下に「download」というイベントカテゴリ名が現れ、アクティブユーザーが1(自分)になっているはずです。ダウンロードの数だけ上のイベントバーにカウントされるので、全部のリンクが作動しているか確認しておきましょう。

もし動いていなかったら、おそらくどこかの設定が間違えていると思うので、class名の割り当てがうまくいってるかどうかチェック。

ダウンロード数のトラッキング集計は「行動 > イベント > 概要」でチェックできます。

【補足】イベントのトラッキングで直帰率が下がる?

アナリティクスでイベントを設定後、直帰率が大幅に下がる現象が起こりました。これは、クリック先のページを1セッションとしてカウントするため、クリック数が上がるのと比例して直帰率が下がるらしい。

そして、以下にトライ&エラーの記録をまとめておきます。(多分みんながやってる方法は1番目と3番目)

【失敗1】onClickでダウンロード数をカウントする方法

まず一番初めに試したのが、ダウンロードリンクのhtmlに「onClick」というコードを入れ、Googleアナリティクスの目標でイベントを計測する方法。

残念なことに、WordpressではonClickコードが使えないらしい。(更新するとコードが変更される)

問題を解決するには「function.php」にonClick制御のコードを入れる必要があるらしいのですが、これはテーマ更新のときに面倒なので却下。

しかも、旧アナリティクス(ユニバーサルアナリティクス※2014-2017)と新アナリティクス(2017以降)では、使えるタグが違うというのもややこしいポイント。

新アナリティクスでは「グローバルサイトタグ(gtag.js)」を使うのが正解らしいので、情報サイトに載っている方法が使えないことも多かった。

ちなみにグローバルサイトタグでのイベントカウント記述方法はこのようなコードになるようです。

onClick=”gtag(‘event’, ‘click’, {‘event_category’: ‘download, ‘event_label’: ‘wallpaper’, ‘value’: ‘0’});”

【失敗2】外部のダウンロードカウントプログラムを導入

使ってみたのはPHP工房さんで配布されているダウンロード(クリック)カウンター(フリーBeta版)です。このオープンソースのPHPファイルを使ってダウンロードをカウントしてみようと実践してみました。

結果は、管理画面までは開いたけど肝心のカウントはとれていなかった。理由はまたしてもWordpressによるコードの置き換わり。どうやら直接プログラムを記述する系は使えないものと思われます。(ここでプログラムでのカウント方法は諦めモードに)

【失敗3】Googleタグマネージャーでダウンロード数を管理

Googleタグマネージャーは、サイトのhtmlやphpファイルに直接コードを書き加えなくてもタグを差し込める便利なアプリです。プログラムでの計測ができないので、タグマネージャーで管理する方法がメジャーかと思い導入してみたものの、よく分からず。

うまくいかない原因として、思い当たる節を箇条書きでまとめてみました。

  • safariではプレビューモードが使えない(拡張機能orセキュリティとのバッティング?)
  • Google Chromeではプレビューモードがonになったけど、肝心のサイトではプレビューツールが現れない(タグマネージャーがうまく導入されていない?)
  • タグマネージャーの設定(コンテナ、変数、トリガー、タグ)はたぶん問題ない。
  • アナリティクスとタグマネのアカウントに相違がある?(もともとアナリティクスではicloudとgmailの2つのアカウントで重複しており、大元の関連付けに問題あり。2つのアカウントは登録済み)
  • aタグの中に子タグが入ってることでaタグと認識されていない可能性もあり
  • WordPressのheadタグ内とbodyタグ直下に入れるタグマネの導入タグが認識されていない(デベロッパーツールでコードが確認できなかった)
  • WordPressのテーマではグローバルサイトタグが推奨されている(これは関係ないかな?)

そもそもタグマネージャーとWordpressサイトとの連携がうまくいってないのでは?というようなこともありました。テーマエディターでphpファイルにタグを入れたのに、実際のサイトをデベロッパーツールで確認したら、タグが確認できなかったからです。

なんで?と気持ち悪いまま放置しましたが、ブックマークとしてタグマネージャーの資料サイトを置いておきます。

モバイルバージョンを終了