CODEWITHSUNDEEP
javascriptmicrodataschema.org
user3412884
user3412884

Reputation: 31

Add schema.org video markup to embed using Javascript

So I have javascript that wraps a video markup around an embedded video. For example it takes input of this...

<div class="schema" itemscope><div class="youtube" id="gR3msYYKtko" style="width: 400px; height: 225px;"></div></div>

...

<script type="text/javascript" src="http://www.tytyga.com/v/YOD/yod.js"></script>

...

and changes it to output like this

<div class="schema" itemscope itemprop="video" itemtype="https://schema.org/VideoObject">
<span itemprop="name">Cabernet Sauvignon Wine Grape Vine</span>
<meta itemprop="uploadDate" content="2014-3-04T08:00:00+08:00">
<meta itemprop="duration" content="T1M36S">
<meta itemprop="thumbnailURL" content="https://i.ytimg.com/vi/gR3msYYKtko/hqdefault.jpg">
<meta itemprop="embedurl" content="https://youtube.googleapis.com/v/gR3msYYKtko">
<div class="youtube" id="gR3msYYKtko" style="width: 400px; height: 225px;"><div style="background-image: url(https://i.ytimg.com/vi/gR3msYYKtko/hqdefault.jpg)" class="thumb"></div><div class="play"></div></div>
<span itemprop="description">Cabernet Sauvignon Wine Grape Vine Video</span>
</div>

What can I do to make the Structured Data Testing Tool recognize my markup? The only thing that "Fetch as Google" sees is the input code, before the javascript changes anything and adds the markup.

Upvotes: 1

Views: 945

Answers (1)

unor
unor

Reputation: 96607

  1. Open the page in your browser (with JS enabled).
  2. Select/mark the whole page (e.g., with Ctrl+a).
  3. Show the source text of the selection (e.g., with Right-click→View selection source). This code should show the markup generated by your JavaScript.
  4. Copy and paste it (e.g., into Google’s Structured Data Testing Tool).

Of course {Microdata parsers without JS support} won’t see your Microdata markup.

Upvotes: 1

Related Questions