How to Embed YouTube Video with sound Muted in your website

It is easy to embed YouTube video in your website or blog. The YouTube video will automatically play when loaded but with sound muted or no sound. You just have to paste the code in the place where you want and can customize the variety of options provided by YouTube, including not only sound muted YouTube video but also skip full-screen option, dimensions and other layout behavior.

Normally when an embedded YouTube video loaded, the video will usually autoplay with sound, although the user can mute and unmute manually but this tutorial will guide you to use the option to automatically load the YouTube video with the sound muted.

embed youtube video with sound muted

Read Also: How to Embed Facebook Message Button on Your Website

&: How to Download any video Online for Free

How to Embed YouTube Video with sound Muted in your website:

The following tutorial will guide you to embed YouTube video that will load automatically.

  1. Go to your desired YouTube video and note down the id of the link from the video in the address bar. For example, if the video address is https://www.youtube.com/watch?v=_mEbbT6vsJ0 then the text after ?v= will be the id link ie. in that case, it is (copy it)
  2. Now replace YOUR_VIDEO_ID in the code given below with the code copied. In the above example, it is _mEbbT6vsJ0
  3. Copy all code and paste it in the place of your website or blog where you want.
  4. That’s all now you can enjoy the embedded YouTube video with no sound.
<div id="muteYouTubeVideoPlayer"></div>

<script async src="https://www.youtube.com/iframe_api"></script>
<script>
function onYouTubeIframeAPIReady() {
var player;
player = new YT.Player('muteYouTubeVideoPlayer', {
videoId: 'YOUR_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) {
e.target.mute();
}
}
});
}

// Written by @labnol
</script>

You can customize the above code by your will, hope so you have learned to embed Youtube video with the sound muted, do comments with your feedback.

2 thoughts on “How to Embed YouTube Video with sound Muted in your website”

Leave a Comment