エクスチュア株式会社ブログホームエクスチュア株式会社コーポレートサイトお問い合わせエクスチュア総合研究所ブログへのリクエストエクスチュア株式会社ブログマーケティングテクノロジーの情報やノウハウ・TIPS、エクスチュア社の情報を発信。【ブログネタ募集】ご興味のある分野を教えてください!ご要望の内容を記事に起こします!メニューの「ブログへの」リクエストよりお送りください。Javascript編こんにちは、エクスチュアCTOの権です。Analyticsの計測コードであるAppMeasurement.jsの実装時に使うと便利なツールについて紹介します。AppMeasument.jsはJavascriptで書かれています。Analyticsを導入するためには、多少のJavascriptの開発が必要です。デベロッパーツール言わずと知れたデバッグツールです。selector]でセレクタをクリップボードにコピーできる点です。セレクタをクリップボードにコピーするこれでJQueryを使ったカスタムリンクの実装や、DTMでのイベントルールの設定が非常に楽になりました。スマホのエミュレートモードも搭載されているので、スマホ用の実装の検証も捗ります。あと、ユーザーエージェントの変更機能もあるのですが、デフォルトでは隠れています。Conditions]を開くと、User-Agent設定項目が出て来ます。Printという機能があります。読みづらいJavascriptソースが、一気に読みやすくなります。printを使えば読みやすいもし興味があれば、この機能を使ってAppMeasurement.jsファイルがどんな事をしているのか覗いてみてください。昔、私がオムニチュアに入った時の入社試験の課題で、「s_code.js(SiteCatalystのレガシーJS)が何をしているのか解読する」という課題がありました。このツールが当時から存在していたらもっと楽だったかも知れません。開発ツール長年愛用し続けたFirebugがとうとう開発終了してしまいました。50からはFirebugが正常に動作しません。試したところ「スクリプト」タブが全く動作せず、ページ内でロードされているJavascriptファイルのデバッグが出来ませんでした。そのため、今後はFirefox標準の開発ツールを使う事になります。UIがFirebugと異なるので、最初は慣れが必要ですが、慣れれば便利そうです。)ローカルストレージ/セッションストレージのインスペクタもデフォルトで搭載されており、Firebugのように追加機能のインストールは不要です。レスポンシブデザインモードがあり、これを使うと画面の解像度を自由に変更してテスト可能です。Switcherも使うと便利です。2016年12月現在開発中のFirefox52ではレスポンシブモードにデバイス選択機能も搭載される予定で、これを使えばスマホのエミュレートも簡単に出来るようになります。https://developer.mozilla.org/ja/docs/Tools/Responsive_Design_Modeリリースが待ち遠しいです。他には、Safariの開発メニュー、IE/EdgeのF12開発者ツールなども存在します。いずれもユーザーエージェント変更機能やコンソールがあり、AppMeasurement.jsの実装・検証に役立つツールです。各ブラウザそれぞれの開発ツールの使い方を覚えると、作業が捗る事、間違いなしです。カスタムリンク計測を1行で書くこんにちは、エクスチュアCTOの権です。カスタム計測のされ方の違い...こんにちは。Webサイト内で発生したJavascriptエラーの内容をAdob...こんにちは、エクスチュアCTOの権です。GTMのdataLayerをAdobeAnalyticsの処理ルール...こんにちは、エクスチュアCTOの権です。DWHレポートをAWSのS3バケットに配信するこんにちは、エクスチュアの権泳東(コン・ヨンドン)です。