Framesite
Skip to content
Framesite.aiDocsOpen Framesite
Browse documentation

Place VideoObject code on your page

Copy one approved Framesite packet, place it with the matching video and visible page content, then verify the rendered page.

The code belongs on the public page where a visitor can watch the video it describes. Framesite already combines the VideoObject with its clips, transcript, page relationships, and language facts. Install that result as one unit.

  1. 1. Open the approved Video Code

    In Video Detail, choose the language version that matches the player you are publishing. Open Video Code and copy the complete packet. Downloads and copy actions appear only after the version is approved and current.

  2. 2. Use the page where the video is watchable

    Put the packet on the page where visitors can play that exact asset. The visible title, summary, transcript or supporting copy, player, and structured data should describe the same thing.

  3. 3. Paste the complete script once

    Put the JSON-LD script in the <head> when your site or CMS gives you a safe head-code field. Google also supports JSON-LD in the <body>, so a body embed is valid when that is the placement your platform provides.

    html
    <head>
  <title>How the Model 42 works</title>

  <!-- Paste the complete approved Framesite packet once. -->
  <script type="application/ld+json">
  {
    "@context": "https://schema.org",
    "@graph": [
      {
        "@type": "WebPage",
        "@id": "https://example.com/model-42#page",
        "url": "https://example.com/model-42",
        "name": "How the Model 42 works",
        "inLanguage": "en"
      },
      {
        "@type": "VideoObject",
        "@id": "https://example.com/model-42#video",
        "name": "How the Model 42 works",
        "description": "A source-backed demonstration of the Model 42.",
        "inLanguage": "en",
        "thumbnailUrl": ["https://example.com/media/model-42-poster.jpg"],
        "uploadDate": "2026-08-01",
        "duration": "PT4M12S",
        "contentUrl": "https://example.com/media/model-42.mp4",
        "embedUrl": "https://example.com/model-42",
        "transcript": "[0:00] Welcome to the Model 42 demonstration.",
        "hasPart": [
          {
            "@type": "Clip",
            "name": "Set up the Model 42",
            "startOffset": 18,
            "endOffset": 54,
            "url": "https://example.com/model-42?t=18"
          }
        ]
      }
    ]
  }
  </script>
</head>
<body>
  <main>
    <h1>How the Model 42 works</h1>
    <!-- The matching visible video player and source-backed page content live here. -->
  </main>
</body>

  4. 4. Remove competing code for the same player

    Check your theme, SEO plugin, video plugin, tag manager, and page template. Do not paste a second VideoObject block for the same video. Keep unrelated Product, Organization, Breadcrumb, or other schema when it describes real visible content and does not duplicate the Framesite graph.

  5. 5. Publish and inspect the rendered page

    View source or inspect the rendered HTML and confirm the script appears once. Confirm the player, thumbnail, media URL, captions, and language choice work without a login. Then run Google's Rich Results Test and use Search Console URL Inspection on the public URL.

Formatting checklist

  • Copy from the opening <script type="application/ld+json"> through the closing </script>. Do not paste Markdown backticks around it.
  • Keep the JSON inside the script as valid JSON: double-quoted names and text, no trailing commas, and no JavaScript comments inside the JSON object.
  • Keep every generated @id, full https:// URL, date, ISO 8601 duration such as PT4M12S, transcript, and clip offset exactly as delivered.
  • Paste raw HTML into a head-code or custom-HTML field. A rich-text editor that prints the angle brackets as visible text is the wrong field.
  • Use one complete packet for the matching page and player. Do not merge fields from two language versions.

Where to paste it by site type

  • Custom site or headless CMS: render the script with the page template for that exact video URL. Server-render it when possible.
  • CMS with a page-level head field:paste the complete script into that page's head or custom-code field, not into a global site field that would repeat it on unrelated pages.
  • CMS that only accepts body embeds:paste the same complete script once near the matching video or in the page's custom HTML block. Do not also paste it in the head.
  • Connected Framesite destination:use the destination's approved publish flow. Do not paste a manual copy on top of code Framesite already installed.

Language placement rules

  • Caption-only translation stays attached to the original playable video and its one VideoObject.
  • A dubbed media file is a separate playable asset and gets its own VideoObject.
  • A translated page gets its own URL and reciprocal language links when the visible page is translated.
  • Install the packet selected for that exact page, player, and language version.

Read Multilingual video and AI search for the difference between page language, spoken language, captions, and dubs.

After installation

Common questions

Can the JSON-LD go in the body?
Yes. Google supports JSON-LD in the head or body. Prefer the head when your site makes that easy, and use the body when that is the safe placement your CMS provides.
Should I keep an older VideoObject plugin enabled?
Only if it is not describing the same video. Two competing VideoObject blocks for one player can disagree about the URL, thumbnail, language, or transcript. Keep one canonical packet for that asset and page.
When do I replace installed code?
Replace it when Framesite shows a reviewed update for the installed packet. Do not copy a draft or a version that still needs review.