How do I allow some non-sensitive data through when scrambling is turned on?
For sensitive sites it can be very useful to enable text scrambling globally to ensure that no sensitive HTML content is transmitted. However, sometimes you might want to see just a few non-sensitive elements within all of that scrambled text to give you more context. Fortunately, you can white list non-sensitive elements on the page so that text scrambling will skip them.
Adding The LoNotSensitive Class
Simply add a class of LoNotSensitive to any element on the page and if text scrambling is enabled it will skip scrambling that element as well as any child elements within it.
Example Code:
<html>
<head></head>
<body>
<div>
By Default, if you turn scrambling on, this text should be scrambled.
<p class="LoNotSensitive">
This text will not be scrambled because it is within an LoNotSensitive element.
<div>But this will ALSO not be scrambled because it is a child element of an LoNotSensitive element.</div>
Don't Worry, input box keypresses are still marked as asterisks even if the parent has LoNotSensitive set.
<input type="text" value=""></input>
<div class="LoSensitive">This will be scrambled because LoSensitive will take precedence</div>
</p>
</div>
</body>
</html><br>
Some important notes:
- LoNotSensitive applies to any child elements as well.
- LoSensitive will take precedence. So, if you mark a DIV with LoNotSensitive but it contains a DIV that has LoSensitive, the LoSensitive DIV will still be considered sensitive data and scrambled.
- Scrambling does not automatically apply to images. You can add the LoSensitive class to images to transmit a "blank" image instead.