追加のSessionCamクラスのカスタマイズ

SessionCamの記録を制御するCSSクラス

SessionCamで記録するページに通常では記録できない要素や、記録してほしくない要素がある場合、該当要素に特殊な追加CSSクラスを付けることで、SessionCamの記録を制御することができます。

使用できる追加クラスは以下のものです。

sessioncammonitorscroll

通常記録されないページ内でスクロールする要素のスクロールをSessionCamで記録する。

セッションリプレイ中にサイトのbody要素とは別にスクロールする要素がある場合（overflow-y：autoが存在するdiv要素がある場合）、要素に”sessioncammonitorscroll”クラスの追加検討する必要があります
body要素とは別のスクロールする要素はSessionCamでは記録しない為、セッションリプレイ等で再生されません。このスクロールもセッションリプレイ中に確認したい場合、該当する要素のclassに”sessioncammonitorscroll”を追加してください。
指定したスクロール要素もセッションリプレイ中で再生されます。

sessioncammonitoroverflow

通常記録されない視差スクロールをSessionCamで記録する。

ReactJSアプリケーション等いくつかの実装で含まれる、視差スクロールが記録されない問題があります。
この解決にはページのbody要素に”sessioncammonitoroverflow”クラスを追加する必要があります。

sessioncammainfixed

サイト全体をカバーする要素が有り場合記録できない。

サイト全体をカバーする要素（div要素やmain要素）があり属性にheight：100％、overflow-y：auto （またはスクロール）、position：fixedなどが含まれている場合記録でき無いためカバーする要素に”sessioncammainfixed”クラスを追加する必要があります。

sessioncamhidetext

ページ内テキストで記録したくない文字がある場合。

ページに機密性の高いデータがある場合は、この情報をマスクしてレコーディングには表示されないようにする必要があります。これを行うには、データを含む可能な最も低い要素（これはp、h*、またはspan要素のようなものになりがちです）に “sessioncamhidetext”クラスを追加します。データが常にマスクされていることを確認するには、クラスをDOMツリーの最下位要素に追加することが重要です。このオプションに関する別の記事がここにあります： ページテキストの記録を無効にする。

sessioncamignorechanges

ユーザーがカラーセレクタとやりとりしたときに色が変化する製品イメージへの特別なオファーでのカウントダウンクロックと同じくらい単純な場合もあります。録画の価値に影響する可能性があるため、これらの変更を追跡したくない場合があります（たとえば、カウントダウンクロックがダウンしていることを知る必要はありません）。この場合、「sessioncamignorechanges」のクラスを常に変化している要素に追加することができます。

sessioncamexclude

あなたのサイトでフォームフィールドをマスキングするには2つのオプションがあります。これはSessionCamコンソール（さまざまなマスキングオプションを使用）から行うことも、 “sessioncamexclude”というクラスを自分のフィールドに追加することで自分のサイトで設定することもできます。このオプションに関する別の記事がここにあります： フォームフィールドの記録を無効にする