Implementare i video nei siti Web e siti mobili deploying-video-to-your-websites-and-mobile-sites

I siti Web, i siti mobili e le applicazioni desktop accedono ai contenuti del server Adobe Dynamic Media Classic, incluso il video, utilizzando stringhe URL o codice incorporato. Adobe Dynamic Media Classic attiva queste stringhe URL durante il processo di pubblicazione. Per inserire la stringa URL o il codice da incorporare per il video nelle pagine Web, nelle pagine mobili e nelle applicazioni desktop, copialo da Adobe Dynamic Media Classic.

NOTE
L’URL o il codice di incorporamento non è attivo finché non pubblichi la risorsa.

Pubblicare i video publishing-video

La pubblicazione di un video consente ai server Adobe Dynamic Media Classic di distribuire video al sito Web, al sito mobile o all'applicazione.

Esistono due metodi diversi per pubblicare il video:

  • Video Publish automaticamente e immediatamente al caricamento: come parte del processo di caricamento video, Adobe Dynamic Media Classic può pubblicare automaticamente i video al caricamento e alla codifica. Questa capacità di pubblicazione istantanea significa che non c'è bisogno di pubblicare video separatamente dopo il fatto.

  • Video Publish manualmente dopo il caricamento: se non desideri pubblicare subito i video, puoi pubblicarli manualmente in qualsiasi momento.

Dopo la pubblicazione dei video, Adobe Dynamic Media Classic attiva le stringhe URL per la pagina HTML o il codice dell’applicazione.

Per pubblicare il video:

  1. Effettuate una delle seguenti operazioni:

    • Per pubblicare i video automaticamente e immediatamente al caricamento, nella pagina Carica, seleziona Publish dopo il caricamento. È tutto, non sono necessari ulteriori passaggi.
    • Per pubblicare i video manualmente dopo il caricamento, nel pannello Sfoglia seleziona i video e quindi nella barra di navigazione globale seleziona Publish.

Collegare l’URL di un video a un sito mobile o a un sito web linking-a-video-url-to-a-mobile-site-or-a-website

Quando pubblichi un video, puoi ottenere l’URL associato da utilizzare nel sito web, nel sito mobile o nell’applicazione desktop. Utilizzare l'URL del video quando si desidera visualizzare il video in una finestra popup o modale nella parte superiore della pagina Web.

Quando un cliente seleziona il collegamento, il dispositivo, la larghezza di banda e le dimensioni dello schermo vengono rilevati automaticamente. Viene visualizzato il video corretto da riprodurre con un visualizzatore predefinito per desktop o sul lettore nativo del dispositivo smartphone e tablet.

Vedi anche Incorporare il visualizzatore video in una pagina Web.

Per collegare l'URL di un video a un sito Web o a un sito Web per dispositivi mobili:

  1. Nel pannello Sfoglia risorse, nell'elenco a discesa Mostra, seleziona Video o Set di video adattivi.

  2. Nel pannello Libreria risorse a sinistra, individuate la cartella di risorse che contiene il video o set di video adattivi che desiderate collegare.

  3. Sopra il pannello delle risorse, sul lato destro della barra degli strumenti, effettuate una delle seguenti operazioni:

    • Selezionare Visualizzazione griglia o Visualizzazione elenco. Nella finestra delle risorse, fate doppio clic sulla miniatura video di una singola risorsa per aprirla in visualizzazione Dettagli. Nel pannello URL e codice di incorporamento a destra, in Streaming HTTP, seleziona Copia URL a destra del visualizzatore desiderato. È consigliabile copiare l'URL associato al visualizzatore Universal_HTML5_Video.

    • Selezionare Visualizzazione griglia. Nel pannello Sfoglia risorse, seleziona una singola risorsa, quindi vai a Anteprima > Elenco visualizzatori sotto l'immagine di anteprima.

      Nella pagina Elenco visualizzatori selezionare Copia URL nella colonna Azioni della tabella. È consigliabile copiare l'URL associato al visualizzatore Universal_HTML5_Video.

    • Selezionare Vista elenco. Nel pannello Sfoglia risorse, seleziona una singola risorsa, quindi a destra dell'immagine di anteprima passa a Anteprima > Elenco visualizzatori.

      Nella pagina Elenco visualizzatori selezionare Copia URL nella colonna Azioni della tabella. È consigliabile copiare l'URL associato al visualizzatore Universal_HTML5_Video.

    • Selezionare Visualizzazione griglia, Visualizzazione elenco o Visualizzazione dettagli. Sulla stessa barra degli strumenti, vai a Anteprima > Elenco visualizzatori.

      Nella pagina Elenco visualizzatori selezionare Copia URL nella colonna Azioni della tabella. È consigliabile copiare l'URL associato al visualizzatore Universal_HTML5_Video.

  4. Inserite il collegamento URL per il video HTML5 nel sito Web e nel sito mobile.

Incorporare il visualizzatore video in una pagina web embedding-the-video-viewer-on-a-web-page

Utilizzare la funzione Incorpora codice per riprodurre il video incorporato nella pagina Web. Il codice da incorporare viene copiato negli Appunti in modo da poterlo incollare nelle pagine Web. La modifica del codice non è consentita nella finestra di dialogo Codice da incorporare.

Vedi anche Collegare un URL video a un sito mobile o a un sito Web.

Per incorporare il visualizzatore video in una pagina Web:

  1. Nel pannello Sfoglia risorse, seleziona Video o Set di video adattivi nell'elenco a discesa Mostra.

  2. nel pannello Libreria risorse, a sinistra, passa alla cartella risorse contenente il video o il set di video adattivi di cui desideri copiare il codice da incorporare.

  3. Sopra il pannello delle risorse, sul lato destro della barra degli strumenti, effettuate una delle seguenti operazioni:

    • Selezionare Visualizzazione griglia o Visualizzazione elenco. Nella finestra delle risorse, fate doppio clic sulla miniatura video di una singola risorsa per aprirla in visualizzazione Dettagli. Nel pannello URL e Codice di incorporamento a destra, in Streaming HTTP, seleziona Codice di incorporamento a destra del visualizzatore desiderato. Come best practice, seleziona Codice da incorporare associato al visualizzatore Universal_HTML5_Video.

    • Selezionare Visualizzazione griglia. Nel pannello Sfoglia risorse, seleziona una singola risorsa, quindi seleziona Anteprima > Elenco visualizzatori sotto l'immagine della miniatura video.

      Nella pagina Elenco visualizzatori, nella colonna Azioni della tabella, selezionare Codice di incorporamento. Come best practice, seleziona Codice da incorporare associato al visualizzatore Universal_HTML5_Video.

    • Selezionare Vista elenco. Nel pannello Sfoglia risorse, seleziona una singola risorsa, quindi a destra dell'immagine di anteprima passa a Anteprima > Elenco visualizzatori.

      Nella pagina Elenco visualizzatori, nella colonna Azioni della tabella, selezionare Codice di incorporamento. Come best practice, seleziona Codice da incorporare associato al visualizzatore Universal_HTML5_Video.

    • Selezionare Visualizzazione griglia, Visualizzazione elenco o Visualizzazione dettagli. Sulla stessa barra degli strumenti, vai a Anteprima > Elenco visualizzatori.

      Nella pagina Elenco visualizzatori, nella colonna Azioni della tabella, selezionare Codice di incorporamento. Come best practice, seleziona Codice da incorporare associato al visualizzatore Universal_HTML5_Video.

  4. Nella finestra di dialogo Incorpora codice, seleziona Copia negli Appunti.

    La modifica del codice non è consentita nella finestra di dialogo Codice da incorporare.

  5. selezionare Chiudi.

  6. Incolla il codice da incorporare nelle pagine Web.

Implementare il codice di incorporamento per utilizzare video HTML5 con risorse video MP4 implementing-embed-code-for-using-html-video-with-mp-video-assets

Potrebbe non essere necessario utilizzare il lettore video Adobe Dynamic Media Classic HTML5. Se invece desideri utilizzare il tag nativo HTML5 <video> con risorse video MP4, puoi utilizzare il seguente codice di esempio:

<video poster="S7 video thumbnail URL" controls>
        <source src="S7 OGG video asset URL (no player)" type='video/ogg; codecs="theora, vorbis"'/>
        <source src="S7 MP4 mobile progressive video asset URL (no player)" type='video/mp4; codecs="avc1.4D401E, mp4a.40.2"'/>
        <p>This is fallback content</p>
</video>

Distribuire video utilizzando un lettore video di terze parti deploying-video-using-a-third-party-video-player

Se utilizzi lettori video di terze parti o un lettore video personalizzato invece di un visualizzatore video Dynamic Media Classic, ottieni l’URL del video diretto che funziona per lo streaming video con bitrate multiplo HLS o il download progressivo.

Per distribuire video tramite un lettore video di terze parti:

  1. In Adobe Dynamic Media Classic, sulla barra di navigazione globale, vai a Configurazione > Configurazione applicazione > Impostazioni generali.
  2. A seconda del tipo di URL che desiderate usare, effettuate una delle seguenti operazioni:
  • Per generare un URL video streaming HLS diretto (multibitrate)

    Nella pagina Impostazioni generali applicazione, nel gruppo Server, nel campo di testo Nome server pubblicato, creare l'URL diretto. Utilizza la sintassi seguente: server/is/content/company/folder/filename.m3u8

    Ad esempio, supponiamo che il nome del server pubblicato sia https://s7d9.scene7.com/. Utilizzando la sintassi del passaggio 2, l'URL diretto potrebbe avere l'aspetto seguente:
    https://s7d9.scene7.com/is/content/GeoRetail/AdobeRIA-AVS.m3u8

  • Per generare un URL video streaming HLS diretto (velocità bit singola)

    Nella pagina Impostazioni generali applicazione, nel gruppo Server, nel campo di testo Nome server di streaming HLS, creare l'URL diretto utilizzando la sintassi seguente:

    server/company/folder/filename.ext.m3u8

    Si supponga ad esempio che il nome del server di streaming HLS sia https://s7mbrstream.scene7.com/hls-vod/. Utilizzando la sintassi del passaggio 2, l’URL diretto potrebbe avere un aspetto simile al seguente:
    https://s7mbrstream.scene7.com/hls-vod/GeoRetail/MBR/ToyStory3\_Teaser1\_High\_iPad\_768x432\_1296K.mp4.m3u8

  • Per generare un URL diretto per video progressivo

    Nella pagina Impostazioni generali applicazione, nel campo di testo Nome server video progressivo che si trova nel gruppo Server, create l’URL diretto con la sintassi seguente:

    server/company/folder/filename

    Si supponga ad esempio che il nome del server video progressivo sia https://s7d9.scene7.com/is/content/. Utilizzando la sintassi del passaggio 2, l’URL diretto potrebbe avere un aspetto simile al seguente:
    https://s7d9.scene7.com/e2/GeoRetail/SourceVideo/outdoors.mp4

Operazioni con le miniature video working-with-video-thumbnails

Adobe Dynamic Media Classic genera miniature per video codificati e video precodificati. Potete usare le miniature video come qualsiasi altra risorsa di immagini. Inoltre, puoi ottenere gli URL per le miniature dei video generate da Adobe Dynamic Media Classic. Puoi quindi distribuire questi URL al di fuori di Adobe Dynamic Media Classic. Ad esempio, potete implementare le miniature nei risultati di ricerca, negli elenchi dei relativi video e negli elenchi di riproduzione video pubblicati in un sito Web.

Le miniature vengono generate in base al primo fotogramma eterogeneo (fotogramma che non sia tutto nero, tutto bianco e così via) del video.

Ottenere gli URL delle miniature video obtaining-video-thumbnail-urls

Adobe Dynamic Media Classic genera automaticamente le miniature video durante il processo di caricamento. Le miniature vengono visualizzate nel pannello Sfoglia in Vista a elenco e Vista griglia.

Per generare gli URL delle miniature video, effettuate un’operazione di pubblicazione.

Vedi Video su Publish.

Una volta effettuata la pubblicazione, potete reperire gli URL delle miniature video nella visualizzazione Dettagli del pannello URL e codice da incorporare. Seleziona Copia URL a destra della miniatura video per copiarne l'URL associato.

Modificare i fotogrammi poster nei visualizzatori video modifying-poster-frames-in-video-viewers

Il fotogramma poster è il fotogramma iniziale che viene visualizzato nei visualizzatori per video prima che venga riprodotto il video. Adobe Dynamic Media Classic utilizza le miniature video come fotogrammi poster.

Potete applicare al fotogramma poster i modificatori di immagini. Ad esempio, potete ritagliare il fotogramma poster o renderlo trasparente. Per modificare il fotogramma poster, aprite la schermata di configurazione del visualizzatore per video e inserite i modificatori nella sezione Modificatori immagini poster.

Consulta Aggiungere o modificare un predefinito per visualizzatori video.

Consulta la Guida di Image Server.

Potete inoltre modificare le miniature video aggiungendo dei modificatori ai relativi URL.

recommendation-more-help
ba789e76-bace-4e0e-bd26-52691fb2cb26