315 人が現在オンライン
315 人が現在オンライン
Google アナリティクスの Google タグマネージャを含む計測の設定やトラブルシュートなどについて、ユーザー同士で意見交換ができます。解析を通して浮かんだ質問やアイディアを投げかけ合ってより知識を高めていきましょう。
ガイドを表示
star_border
返信

Webページ上のフォームで入力された文字列をTagMgrで取得したい

中級者 ✭ ✭

皆様

お世話になります。

 

現在、弊社のHP上に、地名を入れると、一番近くの販売店をGoogle Mapでお客様に表示する機能を実装しております。

その機能は正しく実装され、動作しているのですが、お客様が入力したデータ(地名)をログとして採りたいと思っており、そのデータの取得をGTMでトライしていますがなかなかうまく行きません。

地名を入力し、検索ボタンをクリックしたタイミングで、"クリック"のトリガはかけられるのですが、ページのリフレッシュを行なわないためか、地名の入った変数を取り出すことができません。(Googe Mapの呼び出し(Formの送信)は、ページをリフレッシュせず、JavaScript(jQuery)で行なっております。)

具体的には、下記のようなコードになっており、name="q" に地名が入っていると思うのですが、ソースコードに手を加えないと、GTMだけでは取り出せないでしょうか?

よろしくご教授お願いいたします。

 

<form id="storeSearchForm" onsubmit="return false;">
<div class="contentsBox">
<div class="row noMargin">
<div class="col-xs-12">
<div class="row">
<div class="col-xs-12 col-sm-6">
<div class="clearfix">
<input type="search" id="storeSearchQuery" name="q" placeholder="Enter Town and press return" class="searchForm2">
<button id="storeSearchButton" class="searchButton"><img src="/img/header/search_on.png" alt="search"/></button>

 


受理された解決策
ベストアンサーのマーク済み.
解決策
トピック作成者かけだしさんが付与
4月 2016

Re: Webページ上のフォームで入力された文字列をTagMgrで取得したい

中級者 ✭ ✭
山田様

ご教示いただいた方法で、変数の中身を取り出すことができました。
どうもありがとうございました。
大変助かりました。

元の投稿で解決策を見る


すべての返信

Re: Webページ上のフォームで入力された文字列をTagMgrで取得したい

レジェンド
こんにちは。

クリックが取れるので、クリックにdataLayer.push
でイベント送信すればいけるような気がしますけどね。

dataLayer.push の中に、さらに、event を入れて、そのイベント
で、イベントトラッキングなどに発火させればいいような気はします。

ただ、イベントに入れるとCVがどこまで紐づくか、というのは
やってみないとですが、仕掛けとしてはそれいけるような気はします。

取り急ぎ以上。
------
文責:カグア!

Re: Webページ上のフォームで入力された文字列をTagMgrで取得したい

レジェンド

トリガーが取れているということですので、あとは変数の作成だと思います。
いただいたHTMLをもとに考えると、添付の変数を作成することで、変数の中に検索キーワードが設定されると思います。

Re: Webページ上のフォームで入力された文字列をTagMgrで取得したい

中級者 ✭ ✭
カグア様、山田様
早速のご回答ありがとうございます。
カグア様の方法は少々難しかったので、山田様のご提案の方法でトライさせていただきました。
結果としましては、地名は採れず、nullとなってしまいました。(プレビューモードでの変数の確認、及びGAのリアルタイム表示での確認共。)
(トリガ、タグ、及び変数の内容は下記の通りです。最初の問合せの時はID名に"store・・・"と使っていましたが、都合で"dealer・・・"に変更しております。)

追加で質問させていただきたいのですが、
① 変数の属性名のValueは固定の文字列"Value"で正しいでしょうか?
② クリックトリガがかかったときに、少しディレイ時間をおかないと、DOM変数に値が代入されないでしょうか?

よろしくお願いいたします。

<トリガ>
Click_DealerLocator_Place
イベントを選択
クリック
トリガーを設定
ターゲット すべての要素
配信するタイミング
Click URL 含む img/header/search_on.png

<タグ>
タグタイプ ユニバーサル アナリティクス
トラッキング ID
UA-XXXXXXXX-1
ディスプレイ広告向け機能を有効にする

トラッキング タイプ
イベント
カテゴリ
DealerLocator_Place
アクション
{{DealerPlaceValue}}
ラベル
DealerPlace

1
配信するタイミング
Click_DealerLocator_Place

<変数>
DealerPlaceValue

種類を選択
DOM 要素
変数を設定
選択方法
ID
要素 ID
dealerSearchQuery
属性名
Value

Re: Webページ上のフォームで入力された文字列をTagMgrで取得したい

レジェンド


自分もテストアカウントでやってみましたが、最初に書いたやり方では取れませんでした。。。
変数の種類を「カスタムJavaScript」にして、以下を設定することで取得できたので、こちらを
お試しください。

 

function () {
return document.getElementById('dealerSearchQuery').value;
}

 


時間は関係ないので、delayする必要はありません。

ベストアンサーのマーク済み.
解決策
トピック作成者かけだしさんが付与
4月 2016

Re: Webページ上のフォームで入力された文字列をTagMgrで取得したい

中級者 ✭ ✭
山田様

ご教示いただいた方法で、変数の中身を取り出すことができました。
どうもありがとうございました。
大変助かりました。