Googleタグマネージャでは、タグの要素名や属性の値なんかを簡単に取得できます。
アナリティクスと連携させて、タグマネージャで取得した上記値を、例えばイベントのアクションやラベルに投げてあげることで様々な計測が可能になります。

計測のための設定自体はとても簡単にできるのですが、アナリティクスに送りたい情報の設定に少し手間取りましたので、この辺のことを記事にしてみたいと思います。

自動イベント変数で要素を選ぶと要素名が[object HTMLHeadingElement]や[object HTMLDivElement]になる

何がしたいかったかというと、GTMでトリガーを「要素の表示」に設定し、そのトリガーとなる要素に「h3やh2」を指定し、ブログ記事内の見出しのどれが表示されたかの計測し、アナリティクスのイベントとしてデータを取得することです。

詳しい方法は下記記事に書いています。

Googleタグマネージャで「どこまで読んでもらえたか」を見出し要素で計測する方法

その際に、

• その要素内のテキスト（つまりは見出し文）の記録
• その要素に設定されているタグの記録

をしたかったのです。

目指すゴールは下記のようなレポートです。

見出し分の記録は簡単で、単純に自動イベントで要素のテキストを選び変数にし、それをイベントのアクションやラベルに変数指定してあげればいいだけです。
簡単に見出し文言が表示されます。

同じ要領で、変数に要素を指定して、イベントのアクションやラベルに指定してみます。

すると、結果は残念なことに[object HTMLHeadingElement]としてしか取得ができませんでした。
H1〜H6の見出しタグの場合HTMLHeadingElementになりますが、div要素の場合は[object HTMLDivElement]になります。

上記画像の左側が失敗例、右側が理想です。

データレイヤー変数で取得すればうまくいく

結論を先に書くと、データレイヤー変数でイベント名を指定してtagNameを取得することで解決しました。

変数の作成で、変数の種類を「データレイヤーの変数」に指定し、データレイヤーの変数名「gtm.element.tagName」にして変数を作成します。
この変数を、イベント指定の際に指定することで、タグ名がアナリティクスに記録されるようになります。

わたしは、「タグ名：見出しテキスト」という形でアナリティクスのイベントラベルに記録されるようにしています。

記事を書く際に、h2、h3、h4と、なんとなくではあるものの自分的なルールがあるそれぞれあると思います。
アナリティクスにこのタグ名とテキストが表示されることで、どの記事のどの変まで見てもらえたのか、が直感的にわかるので大変助かります。

そして何よりも、直帰となった場合はでも、ページのどこまで閲覧されて、ページのどこで離脱となったのかがおおよそではありますがわかるようになり、このデータを元に、情報を詰め込みすぎたか、記事がわかりにくかったのではないだろうか、と色々と改善に役立てることができるようになります。

おまけ。gtm.elementVisibilityのデータレイヤー

GTMのプレビュー機能を利用すれば、そのイベントにどんなデータレイヤーが登録されているかがわかります。

GTMのプレビューでgtm.elementVisibilityイベントのデータレイヤーを見ると、「gtm.element」の値がHTMLHeadingElementになっています。

要素の名前を返してくれる、element.tagNameをデータレイヤー変数として指定してあげることでタグ名を取得できます。

elementのその他のプロパティで、いろんなデータも取れそうです。
といってもあまり必要そうなのはなさそうですが。

以上です(*´∀`*)