Está visualizando o artigo correto?
Esse artigo se refere à Digital Publishing Suite. Para o artigo do AEM Mobile, consulte Criar artigos em HTML.
Última atualização em
5 de mai de 2021
|
|
Você pode importar artigos baseados em HTML para um fólio para que esse fólio possa ser exibido no visualizador com um artigo. Uma vantagem de artigos HTML é um tamanho de arquivo muito menor, mais adequado para publicações semanais e artigos simples com muito texto. Os artigos em HTML também podem incluir interatividade não disponível no painel Folio Overlays.
Tutorial de vídeo
Para obter informações sobre como usar o Adobe Edge para criar HTML para a DPS, consulte o artigo de Raghu Thricovil Enhance your DPS Folios with HTML animations using Adobe Edge (Aprimore seus fólios da DPS com animações em HTML usando o Adobe Edge).
-
Crie uma pasta contendo arquivos HTML.
Verifique se você incluiu somente os itens utilizados na pasta. É feito upload de todos os itens na pasta, mesmo que não sejam usados.
-
Se estiver importando o artigo HTML para uma pasta de orientação única, adicione um sufixo _h ou _v ao arquivo .html, como index_h.html.
Se você não adicionar um sufixo, o artigo poderá ser importado como um artigo de orientação dupla. Se tentar visualizar ou publicar o fólio de orientação única, uma mensagem de erro será exibida.
-
No painel do Folio Builder, abra o fólio no qual o artigo HTML será incluído.
-
Na exibição Artigos do painel do Folio Builder, escolha no menu a opção Importar artigo.
-
Escolha a opção “Importar um único artigo”, clique no ícone da pasta Local
e especifique a pasta HTML.Você também pode importar artigos em HTML usando a opção “Importar vários artigos” (consulte Estruturar pastas para importar artigos) ou a opção “Importar usando sidecar.xml” (consulte Importar artigos usando o sidecar.xml baseado no caminho).
-
Especifique configurações adicionais, como Rolagem suave, e clique em OK.
Se você editar os arquivos HTML, selecione o artigo HTML no painel do Folio Builder e escolha Atualizar.
Requisitos para artigos HTML
É possível criar um único arquivo HTML que funciona tanto na orientação retrato quanto paisagem ou arquivos HTML separados para as duas orientações. Para usar arquivos HTML separados para retrato e paisagem, adicione os sufixos _v e _h no final dos nomes de arquivo HTML, como por exemplo “index_h.html.” Se você estiver criando um fólio de orientação única, precisará de apenas um arquivo HTML. Inclui o sufixo _h ou v_ do arquivo HTML em um fólio de orientação única.
No momento, não há suporte total a arquivos em HTML dinâmico (DHTML).
Para uma estrutura de arquivos, um método é colocar todos os gráficos e scripts associados ao arquivo HTML nas pastas de artigo individuais. Outra opção é colocar os gráficos e scripts associados para todo o fólio em um arquivo HTMLResources.zip. Você importa o arquivo HTMLResources.zip no fólio a partir do painel Folio Builder ou do Folio Producer na web. Consulte a Pasta Importar HTMLResources.
Exemplo de uma pasta HTMLResourcesCertifique-se de usar caminhos relativos em seu código HTML. Ao criar um link para uma imagem no mesmo nível do arquivo HTML, use esta abordagem:
<img src="GlobalImage.jpg"/>
Ao criar um link para uma imagem da pasta HTMLResources, use esta abordagem:
<img src="../HTMLResources/GlobalImage.jpg"/>
Para obter informações sobre como criar hiperlinks para artigos em HTML e a partir deles, consulte Criar hiperlinks navto para artigos em HTML.
Criação de artigos HTML para visualizadores Android
Para obter orientação e requisitos para criação de artigos HTML para visualizadores Android, consulte Create HTML articles for Android Viewers (Criação de artigos HTML para visualizadores Android).
Recursos HTML5
Para obter informações sobre como criar artigos usando HTML5, consulte o artigo de Johannes Henseler A single file HTML5 framework.
Para obter informações sobre como usar o CreateJS para criar HTML5 utilizando o Flash Pro, consulte Kit de ferramentas para o CreateJS.
Para obter informações sobre quais fontes estão disponíveis nos artigos em HTML e sobreposições de exibição na Web no iPad, consulte www.michaelcritz.com/2010/04/02/fonts-for-ipad-iphone/.
Rufus Deuchler criou um tutorial em vídeo sobre como usar o Adobe Muse para criar conteúdo HTML para publicações digitais (em inglês).
Permitir que os vídeos de artigos HTML se comportem como sobreposições de vídeo em tela cheia.
Ao criar um artigo em HTML de orientação única com links de vídeo, girar o dispositivo pode fazer com que o vídeo gire também. Além disso, quando o vídeo terminar, o aplicativo interno do navegador reproduzindo o vídeo pode ser fechado. Para ativar este comportamento, use um prefixo “videofile://” no link de vídeo HTML. Essa opção está disponível somente para aplicativos iOS.
Observação:
Para ver exemplos do comportamento do vídeo, consulte a edição de exemplos de HTML do aplicativo gratuito DPS Tips (somente em inglês).
Comportamento padrão de vídeo
Neste exemplo, o vídeo é reproduzido em um aplicativo no navegador e não gira em um fólio de orientação única.<a href="Links/video.mp4">Reproduzir vídeo</a>
ou<a href="../HTMLResources/videos/video.mp4">Reproduzir vídeo</a>
Comportamento aperfeiçoado de vídeo
Neste exemplo, o vídeo gira apropriadamente em um fólio de orientação única e volta ao artigo quando o vídeo terminar.<a href="videfile://Links/video.mp4">Reproduzir vídeo</a>
ou<a href="videofile://../HTMLResources/videos/video.mp4">Reproduzir vídeo</a>
JavaScript
É possível também acionar este comportamento via JavaScript usando a função playFullscreenVideo no objeto de janela.<a onclick="window.playFullscreenVideo('Links/video.mp4');">Reproduzir vídeo</a>
ou<a onclick="window.playFullscreenVideo('../HTMLResources/videos/video.mp4');">Reproduzir vídeo</a>
Vídeo de fluxo contínuo
Este exemplo reproduz um vídeo de fluxo contínuo.<a href="videohttp://www.mysite.com/video.mp4">Reproduzir vídeo</a>
