- 大塚食品の工場で原料の異物混入を指摘した社員が公益通報後に異動 会社を提訴
- 鬼滅の刃「柱稽古編」初回1時間SP、初回視聴率6.9%を記録!“柱”の登場で話題沸騰
- 超大物歌手と結婚し芸能界引退した元女優、志穂美悦子がシャンソン歌手として再デビュー!
- 【大迫力】北海道でのオーロラ観測が話題沸騰 太陽フレアの影響が注目される理由
- お米炊く時『早炊きモード』使ってるやつ、めちゃくちゃ損してるぞ・・・
- 藤浪晋太郎、日本球界復帰か 今季はマイナーで防御率14.09…苦しむ藤浪に「パ・リーグ複数球団」で争奪戦の可能性
- 『超獣機神ダンクーガ』← ほとんどのスパロボで贔屓されてる理由
- ぼざろ公式、聖地巡礼に4度目の注意喚起
- セル編は親子かめはめ波が神すぎるけどさ・・・・・・
- 孤独のグルメの井之頭五郎が『酒飲めない設定』って明らかに失敗だよな?
- 藤浪晋太郎がマイナーの負傷者リスト入り 負傷内容は公表されず 3Aでここまで四球連発
- 【迷惑行為】“スケボー迷惑行為”逮捕可能に!? リニューアル進む新潟駅で年間1472件の苦情… 新潟市が条例改正
- 名古屋市のマンションで乳児の2遺体が入った箱が見つかる 以前に入居していた38歳の女を逮捕
- 【正義】高校生が無職4匹にボコられる→高校生のバイト先のおっさん4人、無職4匹を捕え同じ目に
- 四球連発でマイナーでも防御率10点超の惨状…クビ寸前の藤浪晋太郎「手を差し伸べそうな」意外な球団
- 星野源、フェスで「みんなで手をあげるやつ、今日はやめましょうか」自由に踊ってほしいとの訴えに賛否
- 兄とデキ婚した兄嫁が母の日をブッチ!記念日を大事にする我が家では大問題。デキ婚嫁を受け入れようと気を遣ってた両親も「あんな非常識な嫁はもう絶縁!」と大激怒
- 【悲報】チェンソーマン、アニメ2期ガチのマジで話題すら上がらない【チェンソーマン】
- <女子テニス>大坂なおみ 快勝で5年ぶり2度目の16強、世界11位にストレート勝ち
- 水原一平被告が罪状認否で無罪主張し有罪答弁に変更の見通し 量刑言い渡しに数カ月の見通し
- 【韓国】イジョンフさん大きなセンターフライにフェンス激突で負傷交代!
- 【定期】グレタ逮捕
- 【動画あり】温泉施設の女湯を盗撮しようと『岩に見える小型カメラ』を設置した31歳男性逮捕 無駄に完成度たけえな!
- 落合博満さん、別人のような姿で野球観戦 オーラが凄いと話題に「一瞬、誰この人!?」「野球仙人みたい」
- ゼルダティアキン1周年記念のイラストが公開!!!!
- 【話題】ジャンプってワンピースとHUNTER×HUNTER終わったらなにもなくね【ジャンプ】
- 【話題】チェンソーマンとかいうアニメ化ですべてにケチがついた漫画www【チェンソーマン】
- 【DQN返し】「よぉっ!兄弟ww俺の使い古しだって分かっ行いしてんでしょ!?久々に使わせてくれよ!」→嫁の元旦那が俺の同級生で、再会した時にしつこく絡まれたんだ
- 巨人・坂本勇人が通算2351安打、「打撃の神様」川上哲治の歴代13位に並ぶ 巧みなバットコントロールで右前H
- 希少な黄色の薔薇で繰り返し咲く品種を探す
- 【Fallout】マイクロソフト重役のキャンプに核が落とされる
- 【正論】なんだよこの漫画www【注意】
- 【パ・リーグ】L 6-2 E [5/12] 西武連勝 中村同点打、蛭間勝ち越し打含む3安打、長谷川3ラン、今井7回2失点 楽天連敗
- 最高傑作だと思う「NHKアニメ」ランキング!「未来少年コナン」「十二国記」を抑えての1位は…
- 【悲報】車屋「タイヤの溝が無くなったら交換しろよ!!」←これwwwwwww
- 【セ・リーグ】S 3-1 G [5/12] ヤクルト・サンタナ同点弾と勝ち越し打! 巨人1日で2位転落
- 任天堂「マリオをペラペラの紙にしたゲームを作ろう!」
- 中国人医学生「中国ではADHDに対する理解がないし、政策も不十分です。だからこうしたら解決するんじゃないかなって!」→なるほど・・・“そっち”にいくのか・・・
- ドラゴンボール全然マジで知らないんだけど、悟空っているじゃん?あいつってカカロットって呼ばれたりもするよな?
- 【パ・リーグ】F 6x-5 M [5/12] 日本ハム逆転サヨナラ勝ち!3連勝!伏見同点打、水野サヨナラ打! ロッテ3連敗益田セーブ失敗
- 【必見】ガンダムのショットランサー解説!コロニー保護のための革新的設計
- 首都高タクシー横転事故、亡くなった乗客は出光タンカーの社長か
- 【セ・リーグ】DB 0-1 T [5/12] 阪神2安打で勝利 中野決勝タイムリー、才木完封勝ち DeNA打線沈黙4安打
- 水原一平被告が罪状認否で無罪主張し有罪答弁に変更の見通し 量刑言い渡しに数カ月の見通し
- 遊戯王復帰したいんだが?
- 鋭いコメントで人気の元横綱・北の富士勝昭さん、夏場所も“休場” 昨年春場所から8場所連続
- 究極のMS登場!テスタメントガンダム、CE技術を駆使して戦場を制す
- 茨城県、外来のカミキリムシを10匹駆除した人にプリペイドカードを進呈する制度を設立
- 【悲報】小野寺は下手したら現ドラかも・・・
- 【悲報】ちいかわナガノ、台湾を国として扱っていたことが判明し、危うい立場に
- 【習慣】朝ごはんに「パンとコーヒー」を食べている人が知らないリスク 専門家が指摘する健康への効果
- 新入社員だけど仕事多すぎて俺だけ残業wwwwwwww
- 茨城県の障害者支援施設、組織的虐待で3カ月の指定停止に
- 「晴海フラッグの謎に迫る!」-何が原因でこの集合住宅が人気を失ったのか?
Google Tag Manager × WordPress ウィジェットごとの表示数を計測する
やりたいこと
WordPressのウィジェットがそれぞれ何回表示されたのかを計測したい。
準備
・Wordpress側で各ウィジェットにユニークなCSSセレクタを設定する(classやid等)。
・データソースとして使用するためGoogle Analyticsを連携しておく。
・結果の表の表示のためLooker Studioを連携しておく。
WordPressでウィジェットにユニークなCSSセレクタを設定する
Google Tag Managerのトリガーの条件とするため、ウィジェットにユニークなCSSセレクタを設定しましょう。
正確に測定するためには最低限、ページごとユニークな値にする必要があります。
ある程度の命名規則を決めておくことをお勧めします。
本サイトの場合はclassを使用し、以下のように設定しています。
(デバイス)-(表示ページ)-(表示場所)-(種別)(連番)
ウィジェットごとのclass設定はプラグインを使用するのが簡単です。
本サイトではWidget Optionsを使用しています。
プラグインを導入すると以下のようにウィジェットごとにclassやidを設定することができます。
Google Tag Managerで要素ごとにトリガーを設定する
以下のようなトリガーを作成します。
①「トリガーのタイプ > 要素の表示」
②「選択方法 > CSSセレクタ」
classではなくidの場合は「ID」で設定しましょう。
「要素セレクタ > (ウィジェットごとユニークなCSSセレクタ)」
③このトリガーを起動するタイミング
計測したい頻度で設定します。
④視認の最小割合
要素が何%表示された段階で表示されたとみなすかの割合です。
ウィジェットごとに1つトリガーを設定しましょう。
Google Tag Managerで変数を設定する
設定したトリガーの条件を満たしたとき、設定したCSSセレクタ or IDをGoogle Analyticsに送るために変数を設定します。
まずは表示された要素までのセレクタをオブジェクトから単純文字列に変換する変数を作成します。
①「変数のタイプ > カスタム JavaScript」を選択。
②カスタム JavaScriptに以下を記載。
function() {
var originalEl = {{Click Element}};
var el = originalEl;
if (el instanceof Node) {
var elList = [];
do {
if (el instanceof Element) {
var classString = el.classList ? [].slice.call(el.classList).join('.') : '';
var elementName = (el.tagName ? el.tagName.toLowerCase() : '') + (classString ? '.' + classString : '') + (el.id ? '#' + el.id : '');
if (elementName) elList.unshift(elementName);
}
el = el.parentNode
} while (el != null);
var objString = originalEl.toString().match(/\[object (\w+)\]/);
var elementType = objString ? objString[1] : originalEl.toString();
var cssString = elList.join(' > ');
return cssString ? elementType + ': ' + cssString : elementType;
}
}
作成した変数をもとにCSSセレクタ or IDのみを切り出す変数を作成します。
①「変数のタイプ > 正規表現の表」を選択。
②「入力変数 > (先ほど作成した変数)」
③「正規表現の表 > パターン > (トリガーに設定したユニークなCSSセレクタ or ID)」
最終的には複数のトリガーを設定すると思いますので、設定したものは全て記載しましょう。
Google Tag Managerで計測用のタグを設定する
①「タグの種類 > Google アナリティクス > Google アナリティクス:GA4 イベント」
「測定ID」Google Analyticsの測定IDを記載します。
※Google Analyticsの「管理 > データストリーム > (ストリーム選択)」で確認できます。
②「イベント名」
任意の値を入力してください。Google Analyticsのカスタム定義と合わせられるように英数字+アンダースコアでつけるとよいです。
③「イベントパラメータ」
以下の二つを送るようにしてください。
a. イベントパラメータとして切り出したCSSセレクタ or IDを送るパラメータ
値は先ほど設定した切り出し変数を選択してください。
b. 送られたイベントの回数を数えるパラメータ
定数で「1」を入力してください。
④「配信トリガー」
ウィジェットごとに作成したトリガーを全て登録してください。
ここまで出来たら念のためプレビューでタグの発火を確認しておきましょう。
確認ができたら右上にある公開を押して設定した内容をリリースしましょう。
Google Analyticsでカスタムディメンション、カスタム指標を設定する
「管理 > カスタム定義 > カスタムディメンション > カスタムディメンションを作成」から新規のカスタムディメンションを作成します。
このカスタムディメンションの項目で送られてきた切り出し済みのCSSセレクタ or IDを登録します。
「ディメンション名」
任意の値を入力します。後ほどLooker Studioで分析する際に使用しますのでわかりやすい値にしましょう。
「イベントパラメータ」
先ほどGoogle Tag Managerのタグ設定で設定したイベントパラメータのうち、切り出し済みのCSSセレクタ or IDを値に選んだ方を記載します。
「管理 > カスタム定義 > カスタム指標 > カスタム指標を作成」から新規のカスタム指標を作成します。
このカスタム指標の項目で送られてきたイベント回数を登録します。
「指標名」
任意の値を入力します。後ほどLooker Studioで分析する際に使用しますのでわかりやすい値にしましょう。
「イベントパラメータ」
先ほどGoogle Tag Managerのタグ設定で設定したイベントパラメータのうち、イベント回数を数える方を記載します。
Looker Studioでデータソースを更新する
「リソース > 追加済みのデータソースの管理 > (Google Analyticsデータソースの)アクション > 編集」を選択します。
左下の「フィールドを更新」を選択してカスタムディメンションおよびカスタム指標を取り込み、完了を選択します。
Looker Studioでウィジェットごとの表示回数を表示する
「グラフを追加 > 表」でグラフを挿入し、ディメンションに先ほど作成したカスタムディメンションを、指標に作成したカスタム指標を選択します。
ウィジェットごとの表示回数の表が作成できました。
これでどのウィジェットが何回表示されているのかを確認することができます。
適宜ページ種別やデバイスでフィルターをかけて分析に活かしましょう。
参考
https://www.simoahava.com/analytics/create-css-path-variable-for-click-element/
- 兄「俺の妹は美少女!」兄友「話してみたい!電話でもいいから!」→ブサな私『あの、お兄ちゃぁん…ふぇぇ…』かわいい妹を2年間、演じた結果www
- テンハッピーローズの追い切り映像について
- 【超衝撃】新宿タワマン刺殺事件・容疑者のヤバすぎる新事実が判明・・・地獄すぎ
- 自称ワンピース博士だけど質問ある?
- 【画像】有名女性タレントのオールヌードwwwwwwwwwwww
- 【画像】最近の女子校、屋上で栽培している模様
- ロンドンのバス停でスリを撃退した老人にブラボー!
- 【違反】迷惑系ジュキヤ、チャンネルBANに
- 【歓喜】ファンタジー世界にあった「ポータル」完成するwww
- 西野七瀬、ショートボブにイメチェン!ファンからは絶賛の声が続々
ディスカッション
コメント一覧
まだ、コメントがありません
本日の人気記事
プロフィール
Author:AIまとめちゃんねる
AIを中心に技術/経済等いろいろなニュースやネタをまとめています。
About & Privacy Policy
最近の人気記事
フォローお願いします
ブログランキング
人気ブログランキング
にほんブログ村
先週の人気記事
お問い合わせ
アンテナサイト
キター(゚∀゚)ー! アンテナ
まとめチェッカー
おまとめ
にけつアンテナ
カオスアンテナ
ブルーアンテナ
相互RSSアンテナ
antenna now
アナグロあんてな