Manual blocking
The most fundamental way of blocking problematic scripts from running is to deliberately malform the script tag with Confirmic attributes. The two attributes you’ll need to add are:
| Key | Value | Why? |
|---|---|---|
type | text/x-metomic | Tells the browser that this is a data block and not a JavaScript script, causing the browser not process it. Additionally, it allows Confirmic to recognise the element as a blocked script. |
data-micropolicy | any valid micropolicy slug | The slug of the Micropolicy used to unblock this script. When the specified Micropoliocy is consented to, Confirmic will automatically unblock the script tag, converting it back to a JavaScript script, allowing the browser to execute it or download the associated external script. |
Inline scripts
<script type="text/x-metomic" data-micropolicy="MY-POLICY-SLUG">
/** This code only runs when
consent for MY-POLICY-SLUG has been given **/
console.log("ok")
</script>
External scripts
<script
src="http://third-party.example/someScriptThatUsesCookies.js"
type="text/x-metomic"
data-micropolicy="MY-POLICY-SLUG"
>
</script>
Everything else
You can also prevent any html element (e.g. images, iframes, embeds etc) from being parsed and rendered by wrapping them in such a script tag:
<script
type="text/x-metomic"
data-micropolicy="MY-POLICY-SLUG"
>
<!-- this embed won't be loaded or rendered
until consent for MY-POLICY-SLUG has been given -->
<iframe src="http://third-party.example/embedded-content"></iframe>
</script>
Note
The above technique relies on the content being HTML. If you are wrapping plain text, you will need to either wrap the text in an element, or begin the block with an html comment.
Avoid nesting scripts
Be careful not to nest <script> tags inside each other, or the first closing tag will close the entire block:
<script
type="text/x-metomic"
data-micropolicy="MY-POLICY-SLUG"
>
<!-- This next line will be read as the `text` property of the opening
script and thus will not load the third party script -->
<script src="http://third-party.example/embedded-content.js">
<!-- However, this closing tag will close the entire block -->
</script>
<p>
This content will be rendered since the closing script tag
already closed the entire block.
</p>
</script>
A better way…
Blocking scripts manually is always an available option - but to help make things easier, Confirmic can do the work for you with Autoblocking.
Updated over 3 years ago