Gestione dei predefiniti visualizzatore Dynamic Media

Un predefinito per visualizzatori Dynamic Media è una raccolta di impostazioni che determinano il modo in cui gli utenti visualizzano le risorse multimediali sullo schermo del computer e sui dispositivi mobili. Gli amministratori possono creare i predefiniti visualizzatore. Le impostazioni sono disponibili per una serie di opzioni di configurazione del visualizzatore. Ad esempio, puoi modificare le dimensioni di visualizzazione o il comportamento di zoom del visualizzatore.

Per istruzioni su come creare e personalizzare i predefiniti visualizzatore HTML5, consulta l’Adobe Documentazione API per visualizzatori Dynamic Media HTML5 SDK . L'SDK è disponibile sul server di pubblicazione IS incorporato nell'SDK stesso. Ogni versione della libreria include la propria documentazione SDK.

Percorso: <scene7_domain>/s7sdk/<library_version>/docs/jsdocs/index.html.
Ad esempio, 3.10 SDK: https://s7d1.scene7.com/s7sdk/3.10/docs/jsdoc/index.html

Consulta anche la Guida di riferimento visualizzatori Dynamic Media di Adobe.

Questa sezione descrive come creare, modificare e gestire i predefiniti per visualizzatori. Puoi applicare un predefinito visualizzatore a una risorsa ogni volta che la visualizzi in anteprima. Consulta Applicazione dei predefiniti per visualizzatori.

Accessibilità da tastiera per visualizzatori

Tutti i visualizzatori predefiniti supportano l’accessibilità da tastiera.

Vedere anche Accessibilità alla tastiera e navigazione.

Gestione dei predefiniti visualizzatore Dynamic Media

Per aggiungere, modificare, eliminare, pubblicare, annullare la pubblicazione e visualizzare in anteprima i predefiniti visualizzatore in AEM, tocca Strumenti > Risorse > Predefiniti visualizzatore.

Supporto visualizzatore per pagine web reattive

Pagine web diverse hanno esigenze diverse. Ad esempio, a volte si desidera una pagina web che fornisca un collegamento che apre il visualizzatore HTML5 in una finestra separata del browser. In altri casi, potrebbe essere necessario incorporare il visualizzatore HTML5 direttamente nella pagina di hosting. In quest'ultimo caso, la pagina web può avere un layout statico. Oppure può essere reattivo e può essere visualizzato in modo diverso su diversi dispositivi o per diverse dimensioni della finestra del browser. Per soddisfare queste esigenze, tutti i visualizzatori HTML5 predefiniti forniti con Dynamic Media supportano sia pagine web statiche che pagine web reattive.

Per ulteriori informazioni su come incorporare i visualizzatori reattivi nelle pagine web, consulta Libreria di immagini reattive nella Guida Guida API di Image Serving .

Compatibilità del sistema predefinito del visualizzatore

Tutti i predefiniti visualizzatore forniti con Dynamic Media sono completamente compatibili con i seguenti sistemi:

• Desktop
• Apple iPhone
• Apple iPad
• Smartphone Android
• Tablet Android
• Per i video, è disponibile un supporto aggiuntivo per la riproduzione MP4 per Blackberry e Windows Phone 8.

Tipi di contenuti multimediali avanzati per predefiniti visualizzatore

Gli amministratori possono aggiungere e personalizzare i seguenti tipi di contenuti multimediali durante la creazione di nuovi predefiniti per visualizzatori.

Elenco dei predefiniti visualizzatore

La tabella seguente identifica tutti i predefiniti visualizzatore predefiniti forniti con Dynamic Media.

Vedere anche Demo live.

Per informazioni sulle versioni supportate del browser web e del sistema operativo per i visualizzatori, consulta le Note sulla versione dei visualizzatori.

Consulta Note sulla versione visualizzatori nel sommario della Guida di riferimento visualizzatori.

Matrice di gesti dei visualizzatori mobili supportati

La tabella seguente identifica i gesti del visualizzatore mobile supportati sui dispositivi iOS, Android 2.x e Android 3.x.

Aumento del numero di predefiniti visualizzatore Dynamic Media visualizzati

AEM mostra un’ampia varietà di predefiniti visualizzatore quando visualizzi una risorsa da Vista dettagli > Visualizzatori. È possibile aumentare o diminuire il numero di visualizzatori visualizzati.

Per aumentare il numero di predefiniti visualizzatore Dynamic Media da visualizzare:

1. Passa a CRXDE Lite (http://localhost:4502/crx/de).

2. Passa al nodo di elenco predefinito del visualizzatore in /libs/dam/gui/coral/content/commons/sidepanels/viewerpresets/viewerpresetslist

   

3. Nella proprietà limit, modifica Valore, che corrisponde a 15 per impostazione predefinita, inserendo un numero a piacere.

4. Passa all’origine dati predefinita visualizzatore in /libs/dam/gui/coral/content/commons/sidepanels/viewerpresets/viewerpresetslist/datasource

   

5. Nella proprietà limit , modifica il numero nel numero desiderato, ad esempio {empty requestPathInfo.selectors[1] ? "20" : requestPathInfo.selectors[1]}

6. Tocca Salva tutto.

Creazione di un nuovo predefinito visualizzatore Dynamic Media

La creazione di predefiniti per visualizzatori consente di applicare diverse impostazioni per visualizzare e interagire con le risorse. Tuttavia, non è necessario creare nuovi predefiniti visualizzatore. Se lo desideri, puoi utilizzare i predefiniti predefiniti per visualizzatori già forniti con AEM Assets.

Se scegli di creare un nuovo predefinito visualizzatore, dopo averlo salvato lo stato del visualizzatore viene attivato automaticamente (impostato su On) nella pagina Predefiniti visualizzatore. Questo stato significa che è visibile nel componente Dynamic Media e nel componente File multimediali interattivi e ogni volta che si visualizza l'anteprima di un'immagine o di un video.

Alcuni predefiniti per visualizzatori hanno impostazioni esclusive che possono influenzare l’uso e il comportamento generale del visualizzatore. A seconda del predefinito per visualizzatori che stai creando, potresti voler essere a conoscenza di queste considerazioni speciali.

Consulta Considerazioni speciali per la creazione di un predefinito visualizzatore interattivo.

Consulta Considerazioni speciali per la creazione di un predefinito visualizzatore per banner carosello.

Per creare un nuovo predefinito visualizzatore Dynamic Media:

1. Nell’angolo in alto a sinistra di AEM, tocca il logo AEM, quindi nella barra a sinistra tocca Strumenti > Risorse > Predefiniti visualizzatore.

   

2. Nella pagina Predefiniti visualizzatore, sulla barra degli strumenti, tocca Crea.

3. Nella finestra di dialogo Nuovo predefinito visualizzatore, immetti il nome del nuovo predefinito nel campo Nome predefinito . Scegli con attenzione un nome che non potrà essere modificato dopo aver toccato Crea.

   Quando salvi il predefinito più avanti in questi passaggi, il nome viene visualizzato nella pagina Predefiniti visualizzatore sotto l'intestazione di colonna Titolo predefinito .

4. Nel menu a discesa Tipo di contenuti multimediali avanzati , seleziona il tipo di predefinito visualizzatore da creare, quindi tocca Crea nell’angolo in alto a destra della pagina.

   Consulta Tipi di contenuti multimediali avanzati per predefiniti visualizzatore.

5. Nella pagina Modifica predefinito visualizzatore, tocca la scheda Aspetto .

6. Effettua una delle operazioni seguenti:

   • Nel menu a discesa Tipo selezionato , seleziona un componente di cui vuoi personalizzare la progettazione visiva. In alternativa, puoi toccare qualsiasi elemento visivo del visualizzatore per selezionarlo per la configurazione.

     L’editor visivo consente di vedere l’effetto di una determinata proprietà su uno stile. È sufficiente impostare o regolare una proprietà per vedere immediatamente quale effetto ha sul visualizzatore utilizzando il campione a sinistra dell’editor.

     Le proprietà di stile CSS per ciascun tipo di predefinito visualizzatore sono descritte nell'argomento della guida "Personalizzazione <viewer_name> Viewer" nella Guida di riferimento visualizzatori.

     Ad esempio, se stai creando un predefinito visualizzatore di tipo Mixed_Media, consulta Personalizzazione di visualizzatori di file multimediali diversi per un elenco e una descrizione di ciascuna proprietà.

   • Se hai definito le impostazioni stile in un file CSS separato, puoi caricarlo in AEM Assets. Tocca Importa CSS sotto il menu a discesa Tipo selezionato (potrebbe essere necessario scorrere l'editor visivo per visualizzarlo) per trovare il file CSS caricato e associarlo al predefinito visualizzatore.

     Quando importi un file CSS, l’editor visivo controlla se il CSS utilizza gli indicatori di visualizzatore corretti. Ad esempio, se crei un visualizzatore zoom, tutte le regole CSS importate devono essere definite utilizzando il nome della classe di visualizzatore .s7mixedmediaviewer definito su un elemento visualizzatore principale.

     È possibile importare CSS arbitrari creati a mano, purché definiscano correttamente i marcatori CSS per un determinato visualizzatore. (I marcatori CSS sono descritti in qualsiasi argomento della Guida alla personalizzazione <nome visualizzatore> nel Guida di riferimento visualizzatori. Ad esempio, per informazioni sui marcatori CSS per il visualizzatore zoom, consulta Personalizzazione del visualizzatore zoom.) È tuttavia possibile che l’editor visivo non comprenda alcuni valori CSS. In questi casi, l’editor visivo tenta di ignorare gli errori in modo che il CSS possa ancora funzionare.

   NOTA

   Se preferisci modificare il CSS direttamente nel relativo modulo non elaborato, tocca Mostra/Nascondi CSS nel menu a discesa Tipo selezionato (potrebbe essere necessario scorrere l’editor visivo per visualizzare l’opzione).​

   Come l’editor visivo, quando apporti una modifica a una proprietà direttamente nel CSS, puoi vedere istantaneamente quale effetto ha sull’esempio del visualizzatore. Inoltre, la stessa proprietà viene aggiornata automaticamente nello stesso momento nell’editor visivo. Puoi quindi utilizzare l’editor CSS non elaborato o l’editor visivo oppure entrambi in modo intercambiabile.

   NOTA

   Per l'immagine del pulsante, scegli l'immagine 2x e carica opere d'arte ad alta risoluzione. Quando si lavora con immagini interattive e banner acquistabili, è anche possibile scegliere tra diversi pulsanti pronti all’uso.

7. (Facoltativo) Nella parte superiore della pagina Modifica predefinito visualizzatore, tocca Desktop, Tablet o Telefono per definire in modo univoco gli stili visivi per dispositivi e tipi di schermo diversi.

8. Nella pagina Modifica predefinito visualizzatore, tocca la scheda Comportamento . In alternativa, puoi toccare o fare clic su qualsiasi elemento visivo del visualizzatore per configurarlo.

9. Dal menu a discesa Tipo selezionato, scegli un componente di cui vuoi modificare i comportamenti.

   A molti componenti nell’editor visivo è associata una descrizione dettagliata. Queste descrizioni vengono visualizzate in caselle blu quando espandi un componente per visualizzarne i parametri associati.

   Alcuni tipi di Visualizzatore dispongono di componenti che consentono di specificare i comandi Image Server in un campo di testo Comando IS. Per un elenco dei comandi utilizzabili, consulta la sezione Riferimento API di Server immagini.

   NOTA

   Se utilizzi un dispositivo touch, ad esempio un telefono o un tablet…

   Dopo aver digitato un valore nel campo di testo, toccare un’altra posizione nell’interfaccia utente per inviare la modifica e chiudere la tastiera virtuale. Se tocchi Invio, non si verifica alcuna azione.

10. Vicino all’angolo superiore destro della pagina, tocca Salva.

11. Pubblica il nuovo predefinito per visualizzatori. Devi pubblicare il predefinito prima di poterlo utilizzare sul tuo sito web.

    Consulta Pubblicazione dei predefiniti visualizzatore.

Considerazioni speciali per la creazione di un predefinito visualizzatore interattivo

Modalità di visualizzazione per le miniature delle immagini nel pannello

Quando crei o modifichi un predefinito visualizzatore video interattivo, puoi scegliere l’impostazione Modalità di visualizzazione da utilizzare quando selezioni InteractiveSwatches dal menu a discesa Componente selezionato nella scheda Comportamento . La modalità di visualizzazione selezionata influisce su come e quando vengono visualizzate le miniature durante la riproduzione del video. È possibile scegliere la modalità di visualizzazione segmentpredefinita o continuouspredefinita.

Comportamento dello scorrimento automatico nel visualizzatore video interattivo

Il comportamento di scorrimento automatico delle miniature nel visualizzatore video interattivo funziona indipendentemente dalla modalità di visualizzazione scelta.

Quando crei o modifichi un predefinito visualizzatore video interattivo, puoi accedere a Scorrimento automatico dalla scheda Comportamento . Nella scheda Comportamento, seleziona il menu a discesa Componenti selezionati e tocca InteractiveSwatches. La casella di controllo Scorrimento automatico è elencata sotto il campo di testo Comando IS.

Se nel predefinito visualizzatore disattivi Scorrimento automatico deselezionando la casella di controllo, durante la riproduzione del video da parte dell’utente il pannello visualizza solo la prima miniatura per l’intera durata del video. Tuttavia, un utente può scorrere manualmente le miniature utilizzando le icone di freccia su e giù, se necessario.

Durante la riproduzione del video, se hai abilitato tramite selezione l’opzione Scorrimento automatico nel predefinito visualizzatore, le immagini in miniatura assegnate a un segmento video scorrono all’inizio di un segmento. Tuttavia, in alcuni casi, determinate miniature all’interno di un segmento vengono visualizzate con una durata raddoppiata rispetto alle altre miniature precedenti o successive. Questo comportamento si verifica perché il numero di miniature in un segmento è maggiore rispetto al numero visibile nel pannello e non è divisibile in modo uniforme.

Ad esempio, supponiamo di avere un segmento video di 30 secondi. E ci sono in totale nove miniature da visualizzare in 30 secondi. Il browser viene ridimensionato in modo tale che nel pannello di visualizzazione siano presenti quattro miniature visibili. Il segmento a 30 secondi di tempo video è diviso in tre sottosegmenti. La tabella seguente mostra il raggruppamento di cui vengono visualizzate le miniature per un determinato sottosegmento di tempo:

Il sottosegmento video 3 non si estende oltre le miniature ad esso assegnate. Inoltre, le miniature 4, 6 e 7 sono visibili nel pannello con una durata doppia rispetto alle altre miniature.

La logica utilizzata dal visualizzatore per il numero di miniature visualizzate nel pannello in base al numero di posizioni disponibili è la seguente:

• Numero di sottosegmenti = arrotondato al sottosegmento successivo (numero di miniature/numero di slot visibili nel pannello miniature, in base alle dimensioni della finestra del browser).

  Utilizzando l'esempio nella tabella precedente, 9 miniature / 4 slot = 2,25; la logica del visualizzatore la arrotonda a 3 segmenti secondari.

• Numero di miniature = da arrotondare alla miniatura successiva (numero di miniature/numero di sottosegmenti di video).

  Utilizzando l’esempio nella tabella precedente, 9 miniature / 3 sottosegmenti video = 3 miniature.

• Durata del sottosegmento = durata video totale/numero di sottosegmenti video.

  Utilizzando l’esempio nella tabella precedente, 30 secondi/3 segmenti video secondari = 10 secondi di visualizzazione di ciascun sottosegmento video.

Considerazioni speciali per la creazione di un predefinito visualizzatore per banner carosello

Quando si creano i predefiniti visualizzatore per banner carosello, è possibile accedere alle seguenti modifiche dello stile degli hotspot:

Attivazione o disattivazione dei predefiniti visualizzatore Dynamic Media

I predefiniti per visualizzatori disponibili nell’interfaccia utente dipendono da quelli attivi nella modalità Creazione. Per impostazione predefinita, un predefinito visualizzatore è On dopo averlo creato. Se disattiva il predefinito, questo non verrà visualizzato in modalità Autore. Se il predefinito viene pubblicato. verrà sempre pubblicato indipendentemente dal fatto che sia attivato o disattivato. Puoi disattivare i predefiniti per visualizzatori se l’elenco diventa troppo ingombrante o se non desideri che un predefinito per visualizzatori sia disponibile per l’uso.

Per attivare o disattivare i predefiniti visualizzatore Dynamic Media:

1. Nell’angolo in alto a sinistra di AEM, tocca il logo AEM, quindi nella barra a sinistra tocca Strumenti > Risorse > Predefiniti visualizzatore.

2. Nella pagina Predefinito visualizzatore, sotto l’intestazione di colonna Stato , tocca l’interruttore per attivare o disattivare un predefinito visualizzatore.

   I predefiniti visualizzatore attivati presentano l’interruttore a destra, all’interno di una casella blu; i predefiniti visualizzatore disattivati presentano l’interruttore a sinistra, all’interno di una casella di colore grigio chiaro.

Pubblicazione dei predefiniti visualizzatore Dynamic Media

Attivando (o ruotando Attivato) lo stato di un predefinito visualizzatore significa che è visibile nel componente Dynamic Media, nel componente File multimediali interattivi e ogni volta che visualizzi una risorsa.

Tuttavia, per fornire una risorsa con un predefinito visualizzatore, è necessario pubblicare anche il predefinito visualizzatore . Per ottenere l’URL o il codice di incorporamento di una risorsa, tutti i predefiniti visualizzatore devono essere attivati e pubblicati. Devi attivare e pubblicare tutti i predefiniti visualizzatore che sono forniti con i Dynamic Media. I predefiniti visualizzatore personalizzati che crei e aggiungi vengono attivati automaticamente, ma devono anche essere pubblicati.

Consulta Attivazione o disattivazione dei predefiniti per visualizzatori.

Consulta anche Anteprima delle risorse.

Per pubblicare i predefiniti visualizzatore Dynamic Media:

1. Nell’angolo in alto a sinistra di AEM, tocca il logo AEM, quindi nella barra a sinistra tocca Strumenti > Risorse > Predefiniti visualizzatore.
2. Seleziona uno o più predefiniti visualizzatore da pubblicare.
3. Sulla barra degli strumenti, tocca l’icona Pubblica .

Ordinamento dei predefiniti visualizzatore Dynamic Media

Per ordinare i predefiniti visualizzatore Dynamic Media:

1. Nell’angolo in alto a sinistra di AEM, tocca il logo AEM, quindi, nella barra a sinistra, seleziona Strumenti (icona a forma di martello) > Risorse > Predefiniti visualizzatore.
2. Per ordinare in base all’intestazione della colonna, fai clic su Titolo del predefinito, Tipo, Pubblicato o Stato. Ad esempio, fai clic su Tipo per ordinare i tipi di predefiniti visualizzatore in ordine alfabetico o inverso.

Modifica dei predefiniti visualizzatore Dynamic Media

Tenere presente che la modifica di qualsiasi predefinito predefinito visualizzatore predefinito non è uno scenario supportato. Se modifichi un predefinito per visualizzatori preconfigurato, viene richiesto di salvarlo con un nuovo nome.

Per modificare i predefiniti visualizzatore Dynamic Media:

1. Nell’angolo in alto a sinistra di AEM, tocca il logo AEM, quindi nella barra a sinistra tocca Strumenti > Risorse > Predefiniti visualizzatore.

2. Seleziona un predefinito selezionando la casella a sinistra del titolo del predefinito visualizzatore.

3. Sulla barra degli strumenti, tocca Modifica.

4. Nella pagina Modifica predefinito visualizzatore , apporta le modifiche desiderate al predefinito visualizzatore.

5. Effettua una delle operazioni seguenti:

   • Tocca Salva per salvare le modifiche e tornare alla pagina Predefinito visualizzatore.
   • Tocca Annulla per annullare le modifiche apportate e tornare alla pagina Predefinito visualizzatore.

Eliminazione dei predefiniti visualizzatore Dynamic Media personalizzati

È possibile eliminare i predefiniti per visualizzatori creati e aggiunti a Dynamic Media.

Per eliminare i predefiniti visualizzatore Dynamic Media personalizzati:

1. Nell’angolo in alto a sinistra di AEM, tocca il logo AEM, quindi nella barra a sinistra tocca Strumenti > Risorse > Predefiniti visualizzatore.
2. Nella pagina Predefiniti visualizzatore, seleziona un Titolo predefinito, quindi tocca l’icona Cestino.
3. Tocca Elimina.

Applicazione di un predefinito visualizzatore Dynamic Media a una risorsa

Se hai già pubblicato sia la risorsa che il visualizzatore selezionato, dopo aver selezionato un predefinito visualizzatore vengono visualizzati i pulsanti URL e Incorpora.

Per applicare un predefinito visualizzatore Dynamic Media a una risorsa:

1. Apri la risorsa e, vicino all’angolo in alto a sinistra della pagina, tocca il menu a discesa, quindi seleziona Visualizzatori.

   NOTA

   Se hai già pubblicato sia la risorsa che il visualizzatore selezionato, dopo aver selezionato un predefinito visualizzatore vengono visualizzati i pulsanti URL e Incorpora.

2. Seleziona un predefinito visualizzatore dal riquadro a sinistra per applicarlo alla risorsa.

   Puoi copiare l'URL da condividere con altri utenti.

Distribuzione delle risorse con i predefiniti visualizzatore Dynamic Media

Per ottenere gli URL per i predefiniti per visualizzatori, consulta Collegamento degli URL all’applicazione Web. Vedere anche Incorporamento del visualizzatore video in una pagina Web.

Se utilizzi AEM come WCM, puoi aggiungere risorse utilizzando i predefiniti visualizzatore direttamente sulla pagina. Consulta Aggiunta di risorse Dynamic Media alle pagine.