AI Content Disclosure Demo

Automatically Disclose AI-Generated Videos

The stock Vidyard player exposes an is_ai_video flag in its metadata. A few lines of JavaScript read that flag and, when it's true, show a disclosure banner — helping you meet content-transparency regulations.

Reading player metadata…

How it works

The video above is a real AI-generated clip, so its player reports is_ai_video: true — and the banner appears on its own, with no per-video configuration. Nothing here is simulated:

On each player's ready event it reads player.metadata.is_ai_video from the Player API.
When that flag is true, it inserts the disclosure banner above the player's own container.
No UUID or wrapper markup required — it applies to every player on the page.

Pick the snippet that matches where your player lives. Drop either on an ordinary (non-AI) video and no banner appears — the flag is simply false. See the Player API docs.

Vidyard sharing page

Paste into Advanced Settings → Custom CSS / HTML → Body JS. The player and embed script are already on the page, so this is all you need.

Body JS

<script>
(function () {
  // On a sharing page the player and its API are already loaded.
  var api = window.VidyardV4 && window.VidyardV4.api;
  if (!api) return;

  api.addReadyListener(function (_, player) {
    if (!(player.metadata || {}).is_ai_video) return;   // only AI videos

    var container = player.container || player.element;
    if (!container || !container.parentNode) return;

    var prev = container.previousElementSibling;
    if (prev && prev.classList && prev.classList.contains("ai-disclosure")) return;

    var banner = document.createElement("div");
    banner.className = "ai-disclosure";
    banner.setAttribute("role", "note");
    banner.innerHTML =
      '<svg width="18" height="18" viewBox="0 0 24 24" fill="#0F3221" aria-hidden="true">' +
      '<path d="M11 3l1.7 4.8L17.5 9.5l-4.8 1.7L11 16l-1.7-4.8L4.5 9.5l4.8-1.7z"/>' +
      '<path d="M18 14l.8 2.2L21 17l-2.2.8L18 20l-.8-2.2L15 17l2.2-.8z"/></svg>' +
      '<span>This video contains AI-generated content.</span>';
    banner.style.cssText =
      "display:flex;align-items:center;gap:8px;" +
      "font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;" +
      "font-size:14px;font-weight:500;color:#0F3221;" +
      "background:#CFF2E1;border:1px solid #3BCB85;border-radius:8px;" +
      "padding:10px 14px;margin-bottom:12px;";
    container.parentNode.insertBefore(banner, container);
  });
})();
</script>

Your own website

Embedding the player on your own page. The disclosure script waits for the embed API to load before reading the flag.

Embed snippet

<!-- Vidyard embed script — once per page, in <head>. -->
<script type="text/javascript" async src="https://play.vidyard.com/embed/v4.js"></script>

<!-- Your stock Vidyard player embed, unchanged. -->
<img
  class="vidyard-player-embed"
  src="https://play.vidyard.com/YOUR_UUID.jpg"
  data-uuid="YOUR_UUID"
  data-v="4"
  data-type="inline"
/>

<script>
(function () {
  // The embed script loads async, so wait for its ready hook.
  var prevHook = window.onVidyardAPI;
  window.onVidyardAPI = function (embed) {
    if (typeof prevHook === "function") prevHook(embed);   // don't clobber other hooks

    embed.api.addReadyListener(function (_, player) {
      if (!(player.metadata || {}).is_ai_video) return;    // only AI videos

      var container = player.container || player.element;
      if (!container || !container.parentNode) return;

      var prev = container.previousElementSibling;
      if (prev && prev.classList && prev.classList.contains("ai-disclosure")) return;

      var banner = document.createElement("div");
      banner.className = "ai-disclosure";
      banner.setAttribute("role", "note");
      banner.innerHTML =
        '<svg width="18" height="18" viewBox="0 0 24 24" fill="#0F3221" aria-hidden="true">' +
        '<path d="M11 3l1.7 4.8L17.5 9.5l-4.8 1.7L11 16l-1.7-4.8L4.5 9.5l4.8-1.7z"/>' +
        '<path d="M18 14l.8 2.2L21 17l-2.2.8L18 20l-.8-2.2L15 17l2.2-.8z"/></svg>' +
        '<span>This video contains AI-generated content.</span>';
      banner.style.cssText =
        "display:flex;align-items:center;gap:8px;" +
        "font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;" +
        "font-size:14px;font-weight:500;color:#0F3221;" +
        "background:#CFF2E1;border:1px solid #3BCB85;border-radius:8px;" +
        "padding:10px 14px;margin-bottom:12px;";
      container.parentNode.insertBefore(banner, container);
    });
  };
})();
</script>