Embedded Youtube - but Muted

Hello all,

I am trying to get YouTube videos embedded and auto playing (working) but to have the sound muted (not working).

I am using the YouTube IFrame API with the following code: -

<div id="muteYouTubeVideoPlayer"></div>

<script async src="https://www.youtube.com/iframe_api"></script>
 function onYouTubeIframeAPIReady() {
  var player;
  player = new YT.Player('muteYouTubeVideoPlayer', {
    videoId: 'VIDEO_ID', // YouTube Video ID
    width: 560,               // Player width (in px)
    height: 316,              // Player height (in px)
    playerVars: {
      autoplay: 1,        // Auto-play the video on load
      controls: 1,        // Show pause/play buttons in player
      showinfo: 0,        // Hide the video title
      modestbranding: 1,  // Hide the Youtube Logo
      loop: 1,            // Run the video in a loop
      fs: 0,              // Hide the full screen button
      cc_load_policy: 0, // Hide closed captions
      iv_load_policy: 3,  // Hide the Video Annotations
      autohide: 0         // Hide video controls when playing
    events: {
      onReady: function(e) {

 // Written by @labnol 

This works in the preview window in the layout designer, the video plays and the speaker control has a line through it as if it has been muted (Same in IE and Chrome)

How ever when it opens on the client, the video plays but the speaker is not crossed out and sound plays.

Any one have any idea of why the preview is working and the client is not.

Server and client version are both 1.7.8

Thanks in advance.

You might try controlling the volume rather than muting?


Thanks Alex,

I shall try that, Im sure you had another reply a minute ago, was is onPlayerReady instead of onready?


No. I confused myself. In the Android example we give for this, we have a function called onPlayerReady rather than defining one inline.

I can change the player size etc and that all works, it’s just the sound. Would love to get this working, would make life so much easier.


It’s Youtube’s code so I’m not sure we’re going to be able to help directly.

I presume the registry entries are in place correctly for HTML5 on your Player machine?

In theory the installer should do it for you, but worth checking

Can you add volume: 0 or mute: 1 to the playerVars array?

No idea if that’s supported, but worth a try.

No luck with that either. I just don’t understand why it works in the preview but not in the client. This client is just an IE windows isn’t it?

That registry key wasn’t it but adding it has made no difference.


Yes it’s Internet Explorer 11

What if you put an alert inside the function that does the muting.

That will show if that’s ever being called on the Player.

If not, you could try binding to say the player’s method for onStateChange rather than onReady and see if that’s called instead.

Same results as muting, the alert was called in the preview but not in the client, so the function is not being called on the client but is in the preview.

OK. So can you bind to a different event?

Or failing that, use the EmbedInit() function to call the method you need.

Didn’t work with the onStateChange or putting it in the Embedinit() function, not even the alert which I put in there as well fired. :confused:

I have opened the CMS on the client machine and it gets muted in the preview on there so i has to be something to do with the client and not the machine.

On the client, in the local library there will be a set of HTML files, unfortunately with long random names. One of these will be the local copy of your embedded items rendered content.

Can you try to find that file - and when you find it, open it in IE to see if mute works. I suspect it will - can you then pop the file online somewhere that we can download it (dropbox or similar?)


I found the file and opened it, and it didn’t get muted.

Any here’s where the problem gets worse, if I open it with chrome, it does get muted. I don’t get it. I can open the CMS with either chrome or IE and the preview gets muted?

That is not as unusual as you might think - they are different in that one is a local page and the other is being served by a web server.

I suspect it might be something to do with mixed content (https on the javascript reference). If we have the file we can look to confirm - or you could change it locally to see

if i make a change in IE settings on the client, well these changes be applied with the xibo client opens as well or doesn’t it work like that?

It depends what settings - although I don’t think you need to change any settings.

Can you try changing to http in that file?