このドキュメントに関するご質問は、 https://www.facebook.com/groups/Website.Improvement.Open.Source/ までお願いします。

1. Ptengine
1. 「PAGE SCENE」でスマートフォン向けページのヒー
トマップが正しく表示されない場合の対処方法
2. 「ウェブビュー」でスマートフォン向けページの
ヒートマップを正しく表示させる方法
v.1.1
株式会社Ptmind

2. 目次
1. 「PAGE SCENE」でスマートフォン向けページのヒートマップが正しく表示されない場合の対処方法 P3
2. 「ウェブビュー」でスマートフォン向けページのヒートマップを正しく表示させる方法 P14
2

3. 1. 「PAGE SCENE」でスマートフォン向けページのヒートマップ
が正しく表示されない場合の対処方法
3

4. 「PAGE SCENE」でスマートフォン向けページのヒートマップが正しく表示さ
れない場合の対処方法
• 「PAGE SCENE」の「デバイス・センター」で「Smartphone」を指定した際に、スマートフォン向けページのヒー
トマップが正しく表示されない場合の対処方法の対策をご説明します。
4

5. 「PAGE SCENE」でスマートフォン向けページのヒートマップが正しく表示さ
れない場合の対処方法(1) Chromeの場合
• Chromeの場合
1. ChromeのUA（ユーザーエージェント＝Webサーバーが、ユーザーがどんな端末でアクセスしてきて
いるかを知るための情報）偽装（禁止されている行為ではありません）プラグインを利用します。ま
ず、Chromeのウェブストアページにアクセスします →
https://chrome.google.com/webstore/category/extensions?hl=ja
2. 「User-Agent Switcher for Chrome」を検索します。「+ CHROMEに追加」ボタンをクリックし、Chrome
ブラウザにこのプラグインを追加します。
5
プラグインが追加されると、左のような
アイコンが表示されます。

6. 「PAGE SCENE」でスマートフォン向けページのヒートマップが正しく表示さ
れない場合の対処方法(1) Chromeの場合
• Chromeの場合
3. 「User-Agent Switcher for Chrome」のアイコンをクリックし、「iOS」→「iPhone6」の順にクリックしま
す。これで、スマートフォン向けページのヒートマップが表示されるはずです。
6
このアドオンを使用すると、他の
ページもスマートフォン対応画面が
表示されますので、終わったら、
「Chrome」→「default」に戻しておいて
ください。

7. 「PAGE SCENE」でスマートフォン向けページのヒートマップが正しく表示さ
れない場合の対処方法(2) Firefoxの場合
• Firefoxの場合
1. 右上のメニューアイコンをクリックし、「アドオン」をクリックして、アドオン入手ページを開き、
「configuration mania」を検索します。
7

8. 「PAGE SCENE」でスマートフォン向けページのヒートマップが正しく表示さ
れない場合の対処方法(2) Firefoxの場合
• Firefoxの場合
2. 「インストール」をクリックして、インストールしてください。
3. FireFoxのメニューバーを表示している場合は、「ツール」から「configuration mania」を選択してくださ
い。メニューバーを表示していない場合は、P11へ。
8

9. 「PAGE SCENE」でスマートフォン向けページのヒートマップが正しく表示さ
れない場合の対処方法(2) Firefoxの場合
• Firefoxの場合
4. 「ブラウザ」→「User-Agent」の「プリセット」をクリックし、SafariのiPhoneを選択してください。
9
このアドオンを使用すると、他の
ページもスマートフォン対応画面が
表示されますので、終わったら、
「プリセット」の隣の「標準に戻す」
で、元に戻しておいてください。

10. 「PAGE SCENE」でスマートフォン向けページのヒートマップが正しく表示さ
れない場合の対処方法(2) Firefoxの場合
• Firefoxの場合
5. 「PAGE SCENE」の右上にあるリロードボタンをクリックすると、スマートフォン向けページのヒート
マップが表示されるはずです。
10

11. 「PAGE SCENE」でスマートフォン向けページのヒートマップが正しく表示さ
れない場合の対処方法(2) Firefoxの場合
• Firefoxの場合
6. Firefoxのメニューバーを表示していない場合は、右上、一番右のアイコンをクリックし、アドオンをク
リックしてください。 「configuration mania」の設定をクリック。ウィンドウが開きます。
11

12. 「PAGE SCENE」でスマートフォン向けページのヒートマップが正しく表示さ
れない場合の対処方法(2) Firefoxの場合
• Firefoxの場合
6. 「User-Agent」の「プリセット」をクリックし、SafariのiPhoneを選択してください。
12
このアドオンを使用すると、他の
ページもスマートフォン対応画面が
表示されますので、終わったら、
「プリセット」の隣の「標準に戻す」
で、元に戻しておいてください。

13. 「PAGE SCENE」でスマートフォン向けページのヒートマップが正しく表示さ
れない場合の対処方法(2) Firefoxの場合
• Firefoxの場合
5. 「PAGE SCENE」の右上にあるリロードボタンをクリックすると、スマートフォン向けページのヒート
マップが表示されるはずです。
13

14. 2. 「ウェブビュー」でスマートフォン向けページのヒートマップ
を正しく表示させる方法
14

15. 「ウェブビュー」でスマートフォン向けページのヒートマップを正しく表示
させる方法 （ブラウザは Chrome をご利用ください）
• ブラウザは Chrome をご利用ください。
• 「クリック」または「アテンション」ヒートマップの右上にある「ウェブビュー」のボタンをクリックしてください。
15

16. 「ウェブビュー」でスマートフォン向けページのヒートマップを正しく表示
させる方法 （ブラウザは Chrome をご利用ください）
• ポップアップウィンドウが出た場合は、「確定」をクリックしてください。（ウィンドウが出ない場合もあります。）
16

17. 「ウェブビュー」でスマートフォン向けページのヒートマップを正しく表示
させる方法 （ブラウザは Chrome をご利用ください）
• 下記のような画面が開くので、矢印の部分をマウスで掴んで広げてから、「Emulation」をクリックしてください。
17
Emulation
広げる

18. 「ウェブビュー」でスマートフォン向けページのヒートマップを正しく表示
させる方法 （ブラウザは Chrome をご利用ください）
• 下記のような画面が表示されている場合は、右下の線で囲んだアイコンをクリックすると、前ページと同じレ
イアウトにすることができます。
18

19. 「ウェブビュー」でスマートフォン向けページのヒートマップを正しく表示
させる方法 （ブラウザは Chrome をご利用ください）
• 「Emulation」内の＜Select model＞をクリックして、スマートフォンのモデルを選んでください。
19
＜Select model＞

20. 「ウェブビュー」でスマートフォン向けページのヒートマップを正しく表示
させる方法 （ブラウザは Chrome をご利用ください）
• ブラウザのリロードボタンをクリックすると、スマート
フォン向けページのヒートマップが表示されるはずで
す。
20