Sviluppatori

Come incorporare un video YouTube nel tuo sito (responsive)

Incorpora un video YouTube che si adatta a ogni schermo: menu Condividi, codice responsive, tempo di inizio, privacy avanzata, WordPress e consigli di velocità.

Di Il team di Free Thumbnail Downloader 2 min di lettura
Immagine di copertina dell’articolo: Come incorporare un video YouTube nel tuo sito (responsive)
In questo articolo
  1. Il modo veloce: il menu Condividi di YouTube
  2. Il modo migliore: codice responsive
  3. Opzioni utili
  4. Modalità di privacy avanzata
  5. WordPress
  6. Mantieni la pagina veloce
  7. Trovare l’ID del video

Incorporare permette di guardare un video YouTube senza lasciare la tua pagina. Il codice fornito da YouTube funziona, ma ha una dimensione fissa che può rompere il layout su mobile. Ecco come farlo bene.

Il modo veloce: il menu Condividi di YouTube

  1. Sotto il video, clicca su Condividi → Incorpora.
  2. Se vuoi, spunta Inizia da per un tempo di partenza.
  3. Copia il codice <iframe> e incollalo nell’HTML della pagina.

Il codice predefinito usa width="560" height="315", che può uscire dai bordi sugli schermi piccoli.

Il modo migliore: codice responsive

Questa versione occupa sempre la larghezza del contenitore e mantiene il formato 16:9:

<iframe
  style="width:100%;aspect-ratio:16/9;border:0"
  src="https://www.youtube-nocookie.com/embed/ID_VIDEO"
  title="Player video di YouTube"
  loading="lazy"
  allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
  allowfullscreen></iframe>

Il nostro generatore di codice di incorporamento lo crea per qualsiasi video e aggiunge opzioni con le caselle di spunta.

Opzioni utili

ParametroEffetto
start=90Parte da 1:30
end=150Si ferma a 2:30
autoplay=1&mute=1Parte da solo (deve essere muto)
loop=1&playlist=ID_VIDEORipete il video
controls=0Nasconde i controlli
cc_load_policy=1Mostra i sottotitoli di default

Aggiungili dopo l’ID del video, iniziando con ? e separandoli con &, per esempio .../embed/ID_VIDEO?start=90&mute=1.

Modalità di privacy avanzata

Usando youtube-nocookie.com invece di youtube.com, YouTube non salva informazioni sui visitatori finché non avviano il video. È una buona scelta predefinita per blog e siti attenti alla privacy, soprattutto in Europa.

WordPress

Nell’editor a blocchi aggiungi un blocco HTML personalizzato e incolla il codice. Per un incorporamento semplice senza opzioni puoi anche incollare solo il link del video su una riga: WordPress crea il player.

Mantieni la pagina veloce

Ogni player incorporato carica script aggiuntivi. Con più video in una pagina:

  • Mantieni loading="lazy" così i player si caricano solo quando il visitatore si avvicina.
  • Valuta di mostrare una miniatura con link invece del player completo. Gli URL delle miniature sono spiegati nella nostra guida agli URL delle miniature, e puoi scaricare le immagini con il download miniature.

Trovare l’ID del video

L’ID sono gli 11 caratteri dopo v= o youtu.be/. Con molti link, l’estrattore di ID li tira fuori tutti in una volta.

Domande frequenti

Perché il video incorporato non parte da solo con l’audio?

I browser bloccano la riproduzione automatica con audio. Funziona solo se il video è senza audio, quindi aggiungi mute=1 insieme a autoplay=1.

Posso incorporare qualsiasi video YouTube?

Quasi tutti i video pubblici sì, ma chi li carica può disattivare l’incorporamento. In quel caso il player mostra un avviso e un link per guardarlo su YouTube.

Ottieni qualsiasi miniatura di YouTube in pochi secondi

Incolla un link e scarica tutte le dimensioni disponibili, fino a 1280×720.

Apri lo strumento
Il team di Free Thumbnail Downloader

Creiamo strumenti semplici e veloci per chi crea su YouTube e scriviamo guide basate sui nostri test.

Continua a leggere