1 Reply Latest reply on Aug 18, 2016 7:04 AM by Robb Barrett

    YouTube iFrame API

    Robb Barrett

      Hi there -


      I'm trying to use the YouTube iFrame API and I'm not having any luck.  I've tried it on a Marketo page and on a JSFiddle and neither seem to work, although it looks like it works on the following CodePen.



      YouTube Player API Reference for iframe Embeds  |  YouTube IFrame Player API  |  Google Developers


      My Unsuccessful Fiddle:

      YouTube iFrame API - JSFiddle


      Working Codepen



      Abomination Created when I put the CodePen on my page

      GE Healthcare | Centricity Clinical Archive | Demo

        • Re: YouTube iFrame API
          Robb Barrett

          I found alternative code that works. This needs to be placed above the HTML


          // 2. This code loads the IFrame Player API code asynchronously.
          var tag = document.createElement('script');
          tag.src = "https://www.youtube.com/iframe_api";
          var firstScriptTag = document.getElementsByTagName('script')[0];
          firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
          // 3. This function creates an <iframe> (and YouTube player)
          // after the API code downloads.
          var player, playing = false;
          function onYouTubeIframeAPIReady() {
            player = new YT.Player('player', {
            height: '315',
            width: '560',
            videoId: '2gsFrMMkfMg',
            events: {
            'onReady': onPlayerReady,
            'onStateChange': onPlayerStateChange
          // 4. The API will call this function when the video player is ready.
          function onPlayerReady(event) {
            /** YouTube API
            -1 (unstarted)
            0 (ended)
            1 (playing)
            2 (paused)
            3 (buffering)
            5 (video cued)
          function onPlayerStateChange(event) { 
            if(event.data === 0) {