¿Cómo alternar silenciar/activar el sonido al cargar o en un botón personalizado, haga clic en un video de YouTube agregado a través de iframe?

Necesito reproducir automáticamente un video de YouTube con sonido al cargar la página.

Aquí está el iframe:

 <div class="video-container"> <iframe id="player" class="video" src="https://www.youtube.com/embed/'.$vid_id.'?autoplay=1&controls=0&loop=1&mute=1&playlist='.$vid_id.'" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> </div>

Encontré el fragmento a continuación en este enlace https://yootheme.com/support/question/113708

Agregué iframe_api a la página <script src="https://www.youtube.com/iframe_api"></script>

Luego usé la siguiente función para la configuración del reproductor:

 jQuery(function(){jQuery('.video-container iframe').attr('id', 'player');}); var player; function onYouTubeIframeAPIReady() { player = new YT.Player('player', { events: { 'onStateChange': onPlayerStateChange } }); } function onPlayerStateChange() { player.unMute(); player.setVolume(80); }

 <div class="video-play-btn"></div>

Guión del botón de reproducción

 $('.video-play-btn').on('click', function() { var mute_toggle = $(this); if(player.isMuted()){ player.unMute(); mute_toggle.text('volume_up'); } else{ player.mute(); mute_toggle.text('volume_off'); } });

Y no se muestran errores de consola. ¿Quizás también debería eliminar el silencio = 1?