Indice

amp-youtube

You can now use this component outside valid AMP documents using the Bento version of this component. Learn more in the Bento guide.

Description

Mostra un video di YouTube.

Required Scripts

<script async custom-element="amp-youtube" src="https://cdn.ampproject.org/v0/amp-youtube-0.1.js"></script>

Supported Layouts

fill fixed fixed-height flex-item nodisplay responsive

Esempi

Product Page amp-addthis amp-youtube Integrating Videos in AMP an Overview Video Carousels with amp-carousel

Mostra un video di YouTube.

Script obbligatorio	`<script async custom-element="amp-youtube" src="https://cdn.ampproject.org/v0/amp-youtube-0.1.js"></script>`
Layout supportati	fill, fixed, fixed-height, flex-item, nodisplay, responsive
Esempi	Esempio di codice annotato per amp-youtube

Esempio

Grazie al layout adattabile, la larghezza e l'altezza dell'esempio dovrebbero produrre layout corretti per i video con proporzioni 16:9:

<amp-youtube
    data-videoid="mGENRKrdoGY"
    layout="responsive"
    width="480" height="270"></amp-youtube>

  <amp-youtube
      id="myLiveChannel"
      data-live-channelid="UCB8Kb4pxYzsDsHxzBfnid4Q"
      width="358"
      height="204"
      layout="responsive">
    <amp-img
      src="https://i.ytimg.com/vi/Wm1fWz-7nLQ/hqdefault_live.jpg"
      placeholder
      layout="fill"
      />
  </amp-youtube>

Attributi

autoplay	Se questo attributo è presente e il browser supporta la riproduzione automatica: L'audio del video viene automaticamente disattivato prima che la riproduzione automatica abbia inizio Quando l'utente scorre fino a non visualizzare più il video, questo viene messo in pausa Quando l'utente scorre fino a visualizzare il video, la riproduzione di questo riprende Quando l'utente tocca il video, l'audio viene riattivato Se l'utente ha interagito con il video (ad esempio, attivando o disattivando l'audio, mettendo in pausa o riprendendo il video e così via) e l'utente scorre per attivare/disattivare la visualizzazione del video, lo stato del video rimane come l'aveva lasciato l'utente. Ad esempio, se l'utente mette in pausa il video, lo fa scorrere fino a che questo non è più visualizzato e infine torna al video, questo sarà ancora in pausa.
data-videoid	L'ID video di YouTube presente nell'URL della pagina di un qualsiasi video di YouTube. Ad esempio, nell'URL https://www.youtube.com/watch?v=Z1q71gFeRqM, `Z1q71gFeRqM` è l'ID video.
data-live-channelid	L'ID canale YouTube che fornisce un URL di live streaming stabile. Ad esempio, nell'URL https://www.youtube.com/embed/live_stream?channel=UCB8Kb4pxYzsDsHxzBfnid4Q, `UCB8Kb4pxYzsDsHxzBfnid4Q` è l'ID canale. Puoi fornire un attributo `data-live-channelid` anziché `data-videoid` per incorporare un URL stabile per un live streaming anziché un video. I canali non dispongono di segnaposti predefiniti. Puoi fornire un segnaposto per il video come nell'esempio 2 precedente.
data-param-*	Tutti gli attributi `data-param-*` saranno aggiunti come parametri di ricerca all'src iframe di YouTube. Può essere usato per trasferire valori personalizzati ai plugin di YouTube, ad esempio per mostrare o meno i controlli. Le chiavi e i valori utilizzeranno la codifica URI. Le chiavi utilizzeranno la notazione a cammello. `data-param-controls=1` diventa `&controls=1` Consulta l'articolo relativo ai parametri del player di YouTube incorporato per ulteriori opzioni per i parametri di YouTube.
dock	Richiede l'estensione `amp-video-docking`. Se questo attributo è presente e il video viene riprodotto manualmente, il video viene "ridotto a icona" e fissato a un angolo o un elemento quando l'utente scorre all'esterno dell'area di visualizzazione del componente video. Per ulteriori informazioni, consulta la documentazione relativa all'estensione amp-video-docking.
credentials (facoltativo)	Definisce un'opzione `credentials` come specificato dall'API Fetch. Valori supportati: `omit`, `include` Impostazione predefinita: `include` Se vuoi utilizzare il player di YouTube in una modalità di privacy ottimizzata, trasmetti il valore di `omit`. In genere YouTube imposta i cookie quando viene caricato il player. Nella modalità di privacy ottimizzata, i cookie vengono impostati quando l'utente fa clic sul player.
common attributes	Questo elemento include attributi comuni estesi ai componenti AMP.

Convalida

Consulta le regole amp-youtube nella specifica dello strumento di convalida AMP.

Ti servono altre informazioni?

Hai letto questo documento decine di volte ma non risponde a tutte le tue domande? Forse ci sono altre persone col tuo stesso problema: entra in contatto con loro su Stack Overflow.

Vai a Stack Overflow

Hai trovato un bug o una funzione mancante?

Il progetto AMP invita tutti a partecipare e dare il proprio contributo! Ci auguriamo che tu possa partecipare regolarmente alla nostra community open source, ma saremo anche lieti di ricevere eventuali contributi una-tantum sulle questioni che ti interessano.

Vai a GitHub

amp-youtube 1.0 0.1