State visualizzando l'articolo corretto?
L'articolo fa riferimento a Digital Publishing Suite. Per l'articolo AEM Mobile, consultate Creare articoli HTML.
State visualizzando l'articolo corretto? L'articolo fa riferimento a Digital Publishing Suite. Per l'articolo AEM Mobile, consultate Creare articoli HTML. |
Potete importare articoli HTML in un folio in modo che possano essere visualizzati nel visualizzatore come un articolo. Gli articoli HTML hanno una dimensione file molto inferiore e sono quindi particolarmente indicati per pubblicazioni settimanali e per articoli semplici e ricchi di testo. Gli articoli HTML possono contenere funzioni di interattività non disponibili nel pannello Folio Overlays.
Per informazioni sull’uso di Adobe Edge per creare HTML per DPS, consultate l’articolo di Raghu Thricovil Utilizzare Adobe Edge per ottimizzare i folio DPS con animazioni HTML (in inglese).
Create una cartella contenente file HTML.
Accertatevi di includere solo le risorse in uso nella cartella. Tutte le risorse nella cartella vengono caricate, anche se non sono utilizzate.
Se importate l’articolo HTML in una cartella con orientamento singolo, aggiungete il suffisso _v o _h al file .html, ad esempio index_h.html.
Se non aggiungete un suffisso, l’articolo potrebbe essere importato come articolo con doppio orientamento. Se tentate di visualizzare in anteprima o pubblicare il folio con orientamento singolo, compare un messaggio di errore.
Nel pannello Folio Builder, aprite il folio nel quale includere l’articolo HTML.
Nella vista Articoli del pannello Folio Builder, scegliete Importa articolo dal menu del pannello.
Scegliete l'opzione "Importa un singolo articolo", fate clic sull'icona del percorso e specificate la cartella HTML.
Potete inoltre importare articoli HTML utilizzando l'opzione “Importa più articoli” (consultate Strutturare le cartelle per l'importazione di articoli) o utilizzando l'opzione “Importa tramite sidecar.xml” (consultate Importazione di articoli tramite file sidecar.xml basati sul percorso).
Specificate impostazioni aggiuntive, come Scorrimento uniforme, e fate clic su OK.
Se modificate i file HTML, selezionate l’articolo HTML nel pannello Folio Builder e scegliete Aggiorna.
Requisiti per gli articoli HTML
Potete creare un singolo file HTML che funziona sia per l’orientamento verticale che per quello orizzontale, oppure potete creare file HTML separati per i due orientamenti. Per usare file HTML separati per l’orientamento verticale e orizzontale, aggiungete i suffissi _v e _h ai nomi dei file HTML, ad esempio “index_h.html”. Se create un folio con orientamento singolo, è necessario un solo file HTML. Includete il suffisso _h oppure _v per il file HTML di un folio con orientamento singolo.
I file HTML dinamici (DHTML) non sono al momento supportati appieno.
Per la struttura del file, un metodo consiste nell’inserire tutta la grafica e gli script associati al file HTML nelle singole cartelle degli articoli. In alternativa è possibile inserire la grafica e gli script associati per l’intero folio in un file HTMLResources.zip. Potete importare il file HTMLResources.zip nel folio dal pannello Folio Builder o in Folio Producer sul Web. Consultate Importare la cartella HTMLResources.
Esempio di una cartella HTMLResources
Assicuratevi di usare percorsi relativi nel codice HTML. Per il collegamento a un’immagine sullo stesso livello del file HTML, usate il seguente approccio:
<img src="GlobalImage.jpg"/>
Per il collegamento a un’immagine nella cartella HTMLResources, usate il seguente approccio:
<img src="../HTMLResources/GlobalImage.jpg"/>
Per informazioni sulla creazione di collegamenti ipertestuali verso e da articoli HTML, consultate Creare collegamenti ipertestuali navto per articoli HTML.
Creazione di articoli HTML per visualizzatori Android
Per informazioni e requisiti relativi alla creazione di articoli HTML per visualizzatori Android, consultate Create HTML articles for Android Viewers (Creare articoli HTML per visualizzatori Android).
Risorse HTML5
Per informazioni sulla creazione di articoli tramite HTML, consultate l’articolo di Johannes Henseler A single file HTML5 framework (Framework HTML5 per file singolo).
Per informazioni sull’uso di CreateJS per creare HTML5 con Flash Pro, consultate Toolkit per CreateJS.
Per informazioni sui font disponibili negli articoli HTML e nelle sovrapposizioni di visualizzazione Web per l’iPad, consultate www.michaelcritz.com/2010/04/02/fonts-for-ipad-iphone/.
Rufus Deuchler ha creato un’esercitazione video sull’utilizzo di Adobe Muse per creare contenuti HTML per pubblicazioni digitali.
Funzionamento dei video in articoli HTML come sovrapposizioni video a schermo intero
Quando create un articolo HTML con orientamento singolo con collegamenti video, se si ruota il dispositivo potrebbe ruotare anche il video. Inoltre, al termine del video, il browser in-app con cui è stato riprodotto il video può essere chiuso. Per attivare questo comportamento, usate il prefisso “videofile://” nel collegamento video HTML. Questa opzione è disponibile solo per le app iOS.
Per esempi di comportamento video, consultate l’edizione HTML Examples (Esempi HTML) dell'app gratuita DPS Tips (solo in inglese).
Comportamento video standard
Con questo esempio, il video viene riprodotto in un browser in-app e non viene ruotato in un folio con orientamento singolo.<a href="Links/video.mp4">Riproduci video</a>
oppure <a href="../HTMLResources/videos/video.mp4">Riproduci video</a>
Comportamento video avanzato
Con questo esempio, il video viene ruotato correttamente in un folio con orientamento singolo e, al termine della riproduzione, si torna all’articolo.<a href="videfile://Links/video.mp4">Riproduci video</a>
oppure <a href="videofile://../HTMLResources/videos/video.mp4">Riproduci video</a>
JavaScript
Potete inoltre attivare questo comportamento tramite JavaScript utilizzando la funzione playFullscreenVideo sull’oggetto finestra.<a onclick="window.playFullscreenVideo('Links/video.mp4');">Riproduci video</a>
oppure <a onclick="window.playFullscreenVideo('../HTMLResources/videos/video.mp4');">Riproduci video</a>
Streaming video
Questo esempio riproduce un video in streaming.<a href="videohttp://www.mysite.com/video.mp4">Riproduci video</a>