ページヘッダーがヒートマップ全体の上に表示されている場合、ヒートマップを修正するにはどうすればよいですか?
ウェブサイトが「視差スクロール」を使用している場合、またはページの一部がブラウザの高さの100%に設定されている場合、ヒートマップサンプルが正しく表示されないことがあります。通常、ヘッダーはヒートマップ全体に引き伸ばされて表示され、ウェブページの他の部分は見えません。この問題を解決するには、CSSまたはJavaScriptを使用して、この要素に最大高さを設定します。例えば
.welcome { max-height: 1000px; }
ヒートマップだけにこのスタイルを設定したい場合は、セレクタの前に “html.matomoHeatmap “を付けます:
html.matomoHeatmap .welcome { max-height: 1000px; }
1000pxはあくまで一例であり、任意の高さに設定することができます。カスタムスタイルシートについて詳しくはこちら。
注::vh
単位でエレメントの高さを設定すると、正確なスクリーンショットが撮れない場合があります。この場合、代わりに要素を特定のビューポート用の固定パーセントまたはピクセル高値に設定することができます。