« Back to demos index

Surround a video with a frame using a watermark

Watermarking is mostly used for printing logo's or copyright information on every frame of a video. For this use case, please checkout this basic demo

With slight assembly modifications however, we can also 'invert' watermarking and use it as a frame that the video gets printed in. It requires a png with a transparent surface. Checkout this demo to get the idea. Or » See full documentation

As a bonus, this demo also showcases the webm format, make sure your browser supports it.

"steps": {
  "vid_frame_watermark": {
    "use": ":original",
    "robot": "/video/encode",
    "preset": "webm",
    "width": 640,
    "height": 480,

    "watermark_url": "https://transloadit.com/img/waterframe.png",
    "watermark_size": "100%",
    "watermark_position": "top-left"
  }
}
$(function() {
  $('form').transloadit({
    wait: true,
    autoSubmit: true
  });
});

The form

For demos we allow a maximum of 30MB.

This form is html5-multiupload enabled. If your browser supports it, you can select multiple files and execute the template with them.