web-dev-qa-db-ja.com

WordPressでGoogle Analyticsにクリックイベントを送信する：簡単な方法

WordPressでリンクトラッキングを設定しようとしています。同じサイトへのリンクがいくつかあり、それらはすべて同じクラスを共有しています。

<a class="gaClickTrack" href="https://www.Amazon.es/Heromask-HeroMask-Aprende-idiomas-jugando/dp/B06XWHZ5Q4" target="_blank" rel="noopener">Buy Now Securely On Amazon!</a>

<img class="gaClickTrack wp-image-3372 size-medium" src="https://www.edinventa.com/wp-content/uploads/2018/07/buy-now-300x207.png" alt="Buy Now" width="300" height="207" />

プラグイン「ページ単位」を使用しています。これにより、カスタムJSやカスタムHTMLなど、特定のページのセクションにコンテンツを追加できます。これは追加されたカスタムコードです。

<script>
jQuery('.gaClickTrack').on('click', function() {
    ga('send', 'event', 'button', 'click', 'Amazon-button-clicked');
});
</script>

注：JQueryの代わりに$を使用すると、機能していないように見えます。コンソールはエラーを返します。

Chrome拡張機能のGoogle Analytics Debuggerを使用していますが、使用方法がわからないか、何も検出されません。

Google Analytics - Real time - General Visionを見ると、ページに誰かがいることが検出されていますが、クリックイベントはどこにも表示されていません（Real time - Eventsに表示されるはずです）。

私たちの間違いはどこですか??

jqueryjavascriptgoogle-analytics
1
chelder

これは私のWordPressサイトで機能しています。プラグイン「ページ単位」を使用していることを思い出してください。これにより、カスタムJSやカスタムHTMLなど、特定のページのセクションにコンテンツを追加できます。これは追加されたカスタムコードです。

<script>// <![CDATA[
jQuery(document).ready(function($){ 

$('.class-name-of-the-button').click(function() {  

  ga('send', 'event', {
    eventCategory: 'Outbound Link',
    eventAction: 'click',
    eventLabel: event.target.href,
    transport: 'beacon'
  });

});

});
// ]]></script>

説明：

  • 最初にjQuery(document).ready(function($){を追加する必要があります
  • 注：// <![CDATA[と// ]]>は実際には必要ないと思います
  • ボタンを使用して外部のWebサイトに移動するときに、ここで説明されているようにeventLabel: event.target.hrefを追加する必要があります。 https://developers.google.com/analytics/devguides/collection/analyticsjs/events
  • もちろん、.class-name-of-the-buttonを変更して、Push meのようなIDをボタンに追加することができます。したがって、$('#mybutton999').click(function() {になります。
  • transport：「ビーコン」は、Googleアナリティクスに送信されるまで外部URLの読み込みを遅らせます。ただし、すべてのインターネットブラウザーとの互換性はありません。
  • 繰り返しになりますが、eventCategory、eventAction、transportなどの詳細については、こちらをご覧ください。 https://developers.google.com/analytics/devguides/collection/analyticsjs/events

最後に、ボタンを押してテストするときに、Googleアナリティクス（リアルタイム-イベント）でリアルタイムで確認しました。

0
chelder