Dynamic Watermarks

Adding a Dynamic Watermark to a player can be achieved in two ways, editing the iframe URL query parameter or via simple JS snippet on your page where the video is embedded.

1. Adding iframe URL query:

This is the example iframe code provided by Publitio:

<div><div style="left: 0px; width: 100%; height: 0px; position: relative; padding-bottom: 56.25%;"><figure style="left: 0px; width: 100%; height: 0px; position: relative; padding-bottom: 56.25%; margin-block: 0px; margin-inline: 0px;"><iframe src="https://media.publit.io/file/ToriiGates.html?player=myplayer" scrolling="no" allowfullscreen="allowfullscreen" style="border: 0px; top: 0px; left: 0px; width: 100%; height: 100%; position: absolute; overflow: hidden;"></iframe></figure></div></div>

Simply add &wmt=your_desired_text to the iframe src URL, so:

https://media.publit.io/file/ToriiGates.html?player=myplayer

Becomes:

https://media.publit.io/file/ToriiGates.html?player=myplayer&wmt=your_desired_text

You can visit the link to see your Dynamic Watermark in action.

2. Adding a JS snippet to your page:

<script>
    window.onload = (event) => {
        let text = "your_desired_text";
        document.querySelectorAll("iframe[id^='pv_']").forEach(iframe => {
           iframe.contentWindow.postMessage({"event_id": "publitio_dynamic_watermark", "text": text}, '*');
        })
    };
</script>

Adding this JS snippet to your page will set a Dynamic Watermark to each Publitio video embedded via iframe code on your page.

Simply replace the your_desired_text with the text you wish to set and you are good to go.