Vídeos YouTube HTML

A maneira mais simples de incluir um vídeo no HTML é usando o YouTube.

Dúvidas sobre o formato do vídeo?

Converter o vídeo para outro formato pode ser difícil e demorado.

Uma solução mais simples é fazer o YouTube reproduzir o vídeo no seu site.

ID do Vídeo do YouTube

Quando você salvar (ou reproduzir) o vídeo, o YouTube exibirá um ID (por exemplo, ih1l6wb7LhU).

Você pode usar esse ID e referenciar seu vídeo no código HTML.

Incorporar vídeo do YouTube no HTML

Para reproduzir o vídeo no site, siga as seguintes etapas:

  • Para carregar o vídeo no YouTube
  • Anote o ID do vídeo
  • Definir no seu site <iframe> Elemento
  • Deixe src Atributo para apontar para a URL do vídeo
  • Use width e height Atributos para definir o tamanho do player
  • Adicione outros parâmetros ao URL (veja abaixo)

Exemplo

<iframe width="420" height="315"
src="https://www.youtube.com/embed/ih1l6wb7LhU">
</iframe>

Experimente por Si Mesmo

YouTube Autoplay + Mudo

Você pode fazer com que o vídeo comece a reproduzir automaticamente quando o usuário acessar a página, adicionando autoplay=1 ao URL do YouTube. No entanto, reproduzir automaticamente o vídeo pode irritar seus visitantes!

Atenção:Em muitos casos, os navegadores Chromium não permitem a reprodução automática. Mas sempre permitem a reprodução automática muda.

Em autoplay=1 Adicionar após mute=1Permite que seu vídeo comece a reproduzir automaticamente (mas está mudo).

YouTube - Autoplay + Mudo

<iframe width="420" height="315"
src="https://www.youtube.com/embed/ih1l6wb7LhU?autoplay=1&mute=1">
</iframe>

Experimente por Si Mesmo

YouTube Playlist

Lista de vídeos a serem reproduzidos separados por vírgula (URL original exceto).

YouTube Loop

Adicionar loop=1 Isso fará com que seu vídeo seja repetido para sempre.

Valor 0 (padrão): O vídeo será reproduzido uma vez.

Valor 1: O vídeo será repetido (para sempre).

YouTube - Loop

<iframe width="420" height="315"
src="https://www.youtube.com/embed/ih1l6wb7LhU?playlist=ih1l6wb7LhU&loop=1">
</iframe>

Experimente por Si Mesmo

Controles do YouTube

Adicionar controls=0 Isso fará com que o player de vídeo não exiba controles.

Valor 0: Os controles do player não são exibidos.

Valor 1 (padrão): Os controles do player são exibidos.

YouTube - Controles

<iframe width="420" height="315"
src="https://www.youtube.com/embed/ih1l6wb7LhU?controls=0">
</iframe>

Experimente por Si Mesmo