22.01.2025

Como Incorporar Vídeo do YouTube com Som Desligado: Código

Resposta Rápida

Este código permite que você reproduza automaticamente um vídeo incorporado do YouTube sem som, adicionando o parâmetro &mute=1 à URL.

<iframe src="https://www.youtube.com/embed/VIDEO_ID?autoplay=1&mute=1" allow="autoplay" style="width:100%;height:auto;"></iframe>

Não esqueça de substituir VIDEO_ID pelo ID do vídeo que você deseja.

Conclusão

Incorporar um vídeo do YouTube que reproduz sem som pode melhorar significativamente a experiência do usuário no seu site. É fácil desligar o som adicionando o parâmetro &mute=1 à URL do vídeo. Para um controle de som mais detalhado, você pode utilizar a API IFrame do YouTube.

Desligando o Som Através de Parâmetros de URL

Adicione o parâmetro &mute=1 à URL ao incorporar o código iframe para que o vídeo reproduza sem som. Exemplo de código:

<iframe src="https://www.youtube.com/embed/VIDEO_ID?mute=1" style="width:100%;height:auto;"></iframe>

Controle Dinâmico de Som via API IFrame do YouTube

Para uma gestão de som mais flexível, utilize a API IFrame do YouTube, que permite programaticamente desligar o som utilizando a função mute após o carregamento do vídeo. Exemplo de código JavaScript:

var player;
function onYouTubeIframeAPIReady() {
  player = new YT.Player('player', {
    videoId: 'VIDEO_ID',
    events: {
      'onReady': onPlayerReady
    }
  });
}

function onPlayerReady(event) {
  event.target.mute();
}

Como conectar esse JavaScript ao seu HTML:

<div id="player"></div>

Vídeo Reproduzido Automaticamente com Som Desligado

Para que o vídeo comece a reproduzir imediatamente após o carregamento da página, use os parâmetros autoplay=1&mute=1. Isto também ajuda a cumprir os requisitos de certos navegadores em relação à reprodução automática de vídeos.

<iframe src="https://www.youtube.com/embed/VIDEO_ID?autoplay=1&mute=1" allow="autoplay" style="width:100%;height:auto;"></iframe>

Visualização

Aqui está um exemplo demonstrando o que acontece com o vídeo do YouTube quando você adiciona o parâmetro &mute=1:

Código de incorporação:

<iframe src="https://www.youtube.com/embed/VIDEO_ID?mute=1" allow="autoplay; encrypted-media" allowfullscreen></iframe>

Vídeo sem som: 📺🔊 (com som)
Vídeo com som desligado: 📺🔇 (sem som)

Recursos Úteis

1. Documentação Oficial da API do IFrame do YouTube – Instruções sobre a API do player do YouTube para incorporação via iframe.
2. Incorporando Vídeos do YouTube em HTML – Um guia passo a passo detalhado sobre como adicionar vídeos do YouTube às páginas da web.
3. Atributos autoplay e muted no DOM do HTML – Métodos para controlar a reprodução automática e o som em elementos de mídia.
4. Política do Chrome sobre Vídeos em Reprodução Automática – Informações sobre regras de autoplay no navegador Chrome.
5. Criando Botões de Play e Pause para Vídeos do YouTube e Vimeo via API – Um artigo extenso sobre como controlar vídeos via JavaScript utilizando APIs.
6. Página de Teste do Player do YouTube – Uma página para testar as configurações do player do YouTube.

Video

Navigation