Sensitive Data Masking is a key security feature of Marker.io. To keep your Marker.io account as secure as possible, check out our detailed guide:
Who can use this feature?
This feature is now available on our Enterprise plan. Contact us today for details.
What is Sensitive Data Masking?
With our Sensitive Data Masking feature, you can automatically keep your customer data private, and ensure it never reaches Marker.io servers. By simply adding a CSS class to your website, this ensures that any sensitive information is automatically excluded from screenshots and session replay videos.
๐ก All information will automatically be excluded or masked from:
Screenshot renderer
Browser Native API screenshots
Browser Extension screenshots
Session replays
How to Use Sensitive Data Masking
We currently offer three CSS classes to manage data visibility:
.mk-exclude
: exclude elements from being captured on client side..mk-mask
: capture the elements while removing its text content on client side.mk-unmask
: unmask an element content on client side
Exclude Elements (.mk-exclude
)
Exclude is the most private rule. The element itself and all its child elements will be ignored from the capture and replaced by a rectangle filled with a wavy pattern.
Because the exclusion applies to all its child elements, it is not possible to Mask or Unmask the child of an excluded element.
Example:
After adding the .mk-exclude
class to the form wrapper, the entire form content has been excluded from the screenshot.
Mask Elements (.mk-mask
)
For masked elements, all texts will be replaced by irreversibly transformed placeholder text to look like a wireframe of the original content. The replaced text will retain the size and length of the original text.
Masking will automatically apply to all children of the targeted element. Unlike excluded elements, specific children elements of a masked element can be Unmasked. This provides a more granular level of privacy control for complex elements.
Example:
After adding the .mk-mask
class to the form wrapper, all text have been replaced by irreversibly transformed placeholder text to look like a wireframe.
Unmask Elements (.mk-unmask
)
By default, all element present on a page will be unmasked and captured.
You can use the .mk-unmask CSS class inside a masked element to prevent the obfuscation of the texts inside this element.
Example:
After adding the .mk-unmask
class to children elements of a .mk-mask
, all obfuscated texts become visible again in the captured screenshot.
Conclusion
Ask your developers to add the CSS classes in your code to specific elements, and their children elements will be automatically excluded or masked from your screenshots and session replays.
This feature is now available on our Enterprise plan. Contact us today for details.