Ptengine　ヒートマップレスポンシブデザインから

スマートフォン専用サイトに変更したのにヒートマップでレスポンシブの画面が出てしまう場合の対処法方法　

v.1.1

株式会社 Ptmind

このドキュメントの目的• 「 PAGE SCENE」の「デバイス・センター」で「 Smartphone」を指定した際に、レスポンシブデザインからスマートフォン専用サイトに変更したのにヒートマップでレスポンシブの画面が出てしまう場合の対処方法をご説明します。　

2

スマートフォン対応画面ではなく、レスポンシブの画面が表示される。

以下の手順を進めていただく場合のお願い：

ブラウザは、 Chromeをご利用ください

3

Chromeにプラグインを入れてください• 以下の手順で、 Chromeにプラグインを入れてください。

1. Chromeの UA（ユーザーエージェント＝Webサーバーが、ユーザーがどんな端末でアクセスしてきているかを知るための情報）偽装（禁止されている行為ではありません）プラグインを利用します。まず、 Chromeのウェブストアページにアクセスします　→　https://chrome.google.com/webstore/category/extensions?hl=ja

2. 「 User-Agent Switcher for Chrome」を検索します。「 + CHROMEに追加」ボタンをクリックし、 Chromeブラウザにこのプラグインを追加します。

4

プラグインが追加されると、左のようなアイコンが表示されます。

「デバイスセンター」で「SmartPhone」を選択してください

• 「デバイスセンター」で「 SmartPhone」をクリックしてください。

5

画面左上にある上記のアイコンをクリックすると、デバイスセンターが開きます

SmartPhoneをクリックしてください

「ウェブビュー」をクリックしてください• 「クリック」または「アテンション」ヒートマップの右上にある「ウェブビュー」のボタンをクリックしてください。

※「ウェブビュー」をクリックする前に、集計期間の指定は済ませておいてください。

6

「ウェブビュー」をクリックして開く画面• 「ウェブビュー」をクリックして開く画面では、まだ、レスポンシブデザインの画面が表示されています。そこで次ページの操作を行ってください。

7

P4で導入したプラグインで、 iPhoneを指定してください (1)

• P4で導入したプラグインのアイコンをクリックして、下記の図のように iPhoneを指定してください。

8

このアドオンを使用すると、他のページもスマートフォン対応画面が表示されますので、終わったら、「 Chrome」→「 default」に戻しておいてください。

P4で導入したプラグインで、 iPhoneを指定してください (2)

• 前ページの操作をしていただくと、「レスポンシブ」の画面から、「スマートフォン専用画面」に表示が変わります。

9

レスポンシブの画面スマートフォン専用画面