Vai al contenuto

Codice embed YouTube responsive

Copia un codice di incorporamento YouTube che si adatta a ogni schermo.

Proporzioni

Carica prima una miniatura e il player di YouTube solo al clic: pagine molto più veloci.

Opzioni
px
Stile del codice
Avanzate

Solo per browser molto vecchi o CMS che rimuovono lo stile aspect-ratio.

Anteprima
Incolla un link di YouTube per vedere l'anteprima

L'anteprima viene caricata da YouTube. Se l'anteprima mostra «Video unavailable», il proprietario potrebbe aver disattivato l'incorporamento.

Codice

    

Funziona nel browser: i tuoi dati non vengono caricati.

Come si usa

  1. Incolla un link YouTube, un ID video o un codice iframe nel campo di input.
  2. Scegli le Proporzioni del video: 16:9, 9:16, 4:3, 1:1 o 21:9. Con un link Shorts viene selezionato 9:16, se non hai già cambiato il valore.
  3. Se vuoi limitare la dimensione del video, imposta Larghezza massima tra 100 e 4000 pixel.
  4. Fai clic su Copia codice e incolla il codice nell’HTML della tua pagina, oppure usa Scarica per salvare un file HTML.

Esempi

Video in un articolo, con inizio a 42 secondi

Input
https://www.youtube.com/watch?v=QN1odfjtMoo&t=42
Output
<iframe src="https://www.youtube-nocookie.com/embed/QN1odfjtMoo?start=42&amp;rel=0&amp;playsinline=1" srcdoc="&lt;style&gt;*{padding:0;margin:0;overflow:hidden}html,body{height:100%}img,span{position:absolute;width:100%;top:0;bottom:0;margin:auto}img{height:100%;object-fit:cover}span{height:1.5em;text-align:center;font:48px/1.5 sans-serif;color:#fff;text-shadow:0 0 .5em #000}&lt;/style&gt;&lt;a href='https://www.youtube-nocookie.com/embed/QN1odfjtMoo?start=42&amp;amp;autoplay=1&amp;amp;rel=0&amp;amp;playsinline=1' aria-label='Play: YouTube video player'&gt;&lt;img src='https://i.ytimg.com/vi/QN1odfjtMoo/hqdefault.jpg' alt='YouTube video player' loading='lazy'&gt;&lt;span&gt;▶&lt;/span&gt;&lt;/a&gt;" title="YouTube video player" loading="lazy" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen style="display:block;width:100%;height:auto;aspect-ratio:16/9;border:0;max-width:800px;margin:0 auto;"></iframe>

Short verticale per una pagina mobile

Input
https://www.youtube.com/shorts/QN1odfjtMoo
Output
<style>.yt-embed{display:block;width:100%;height:auto;aspect-ratio:9/16;border:0}</style>
<iframe class="yt-embed" src="https://www.youtube-nocookie.com/embed/QN1odfjtMoo?rel=0&amp;playsinline=1" title="YouTube video player" loading="lazy" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>

Video in formato 4:3 per un vecchio CMS

Input
https://youtu.be/6v2L2UGZJAM
Output
<div style="max-width:640px;margin:0 auto;"><div style="position:relative;width:100%;padding-bottom:75%;height:0;overflow:hidden;"><iframe src="https://www.youtube-nocookie.com/embed/6v2L2UGZJAM?rel=0&amp;playsinline=1" title="YouTube video player" loading="lazy" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen style="position:absolute;top:0;left:0;width:100%;height:100%;border:0;"></iframe></div></div>

Domande frequenti

Cosa cambia con la modalità di privacy avanzata?

Modalità di privacy avanzata (youtube-nocookie.com) usa il dominio youtube-nocookie.com al posto di youtube.com nell’URL di incorporamento. Con Caricamento al clic (leggero) la miniatura viene comunque caricata subito da i.ytimg.com e il player di YouTube solo al clic, quindi il browser del visitatore contatta comunque server esterni.

Come faccio a riprodurre automaticamente il video sul sito?

Disattiva Caricamento al clic (leggero), poi attiva Riproduzione automatica al caricamento della pagina. Lo strumento attiva anche Disattiva audio per consentire l’avvio automatico senza audio.

Posso incorporare una playlist YouTube?

Incolla un link YouTube con il parametro list=. Per i link che contengono solo una playlist, Caricamento al clic (leggero) non è disponibile: viene generato direttamente il player della playlist.

Il link del video viene inviato al server?

Il codice viene generato nel browser e il link non viene inviato al server del sito. L’anteprima, però, carica la miniatura o il player direttamente da YouTube. Le opzioni sono salvate in localStorage, mentre link, titolo e tempi non vengono salvati.