Tworzenie artykułów HTML dla publikacji DPS

Szukaj

Czy czytasz odpowiedni artykuł?

Ten artykuł dotyczy programu Digital Publishing Suite. Artykuł dotyczący rozwiązania AEM Mobile można znaleźć tutaj: Create HTML articles.

Artykuły w formacie HTML można zaimportować do folio, co pozwala wyświetlać tę zawartość w przeglądarce jako artykuł. Zaletą artykułów HTML jest znacznie mniejszy rozmiar pliku, który lepiej nadaje się do cotygodniowych publikacji oraz prostych artykułów zawierających w większości tekst. Artykuły HTML mogą też zawierać interaktywne elementy, które nie będą widoczne w panelu Folio Overlays.

Samouczek wideo

Loading HTML Articles (Wczytywanie artykułów HTML).

Colin Fleming

http://blog.colingrayfive.com/

Informacje na temat wykorzystania aplikacji Adobe Edge do tworzenia zawartości HTML na potrzeby publikacji DPS można znaleźć w artykule Raghu Thricovila (j. ang.): Enhance your DPS Folios with HTML animations using Adobe Edge (Wprowadzanie animacji HTML do folio DPS za pomocą programu Adobe Edge).

  1. Utwórz folder zawierający pliki HTML.

    Upewnij się, że znajdują się w nim tylko zasoby, z których korzystasz. Wysyłane są wszystkie zasoby znajdujące się w folderze, nawet te, które nie są używane.

  2. Jeśli importujesz artykuł w formacie HTML do folio o pojedynczej orientacji, dodaj przyrostek _h lub _v do nazwy pliku .html, np. index_h.html.

    Jeśli tego nie zrobisz, plik może zostać zaimportowany jako artykuł o podwójnej orientacji. W przypadku próby uzyskania podglądu lub opublikowania folio o pojedynczej orientacji zostanie wyświetlony komunikat o błędzie.

  3. W panelu Folio Builder otwórz folio, w którym zostanie umieszczony artykuł HTML.

  4. W widoku Artykuły panelu Folio Builder wybierz polecenie Importuj artykuł z menu panelu.

  5. Wybierz opcję „Importuj pojedynczy artykuł”, kliknij ikonę folderu Lokalizacja , a następnie wskaż folder HTML.

    Artykuły HTML można także importować z użyciem opcji Importuj wiele artykułów (zobacz Tworzenie struktury folderów w celu importowania artykułów) lub opcji Importuj za pomocą pliku sidecar.xml (zobacz Importowanie artykułów za pomocą pliku sidecar.xml opartego na ścieżkach).

  6. Określ dodatkowe ustawienia, takie jak płynne przewijanie, a następnie kliknij przycisk OK.

W przypadku edycji plików HTML zaznacz artykuł w formacie HTML w panelu narzędzia Folio Builder i wybierz opcję Aktualizuj.

Wymagania dotyczące artykułów HTML

  • Możesz utworzyć pojedynczy plik HTML, który działa zarówno dla orientacji pionowej, jak i poziomej lub oddzielne pliki HTML dla każdej z orientacji. Aby użyć oddzielnych plików HTML dla orientacji pionowej i poziomej, do końca nazw plików HTML dodaj przyrostek _v i _h, np. index_h.html. Jeśli tworzysz folio o pojedynczej orientacji, potrzebny jest tylko jeden plik HTML. Dołącz przyrostek _h lub _v do pliku HTML w folio o pojedynczej orientacji.

  • Dynamiczne pliki HTML (DHTML) nie są obecnie w pełni obsługiwane.

  • W przypadku struktury plików jedną z metod jest umieszczenie wszystkich powiązanych grafik i skryptów dla danego pliku HTML w folderach pojedynczych artykułów. Inną metodą jest umieszczenie wszystkich powiązanych grafik i skryptów całego folio w pliku HTMLResources.zip. Plik HTMLResources.zip można zaimportować do folio z poziomu panelu Folio Builder lub narzędzia Folio Producer. Zobacz Importowanie folderu HTMLResources.


    Przykład folderu HTMLResources

  • Upewnij się, że w kodzie HTML użyto ścieżek względnych. Jeśli tworzysz łącze do obrazu na tym samym poziomie, co plik HTML, skorzystaj z następującej metody:

    <img src="GlobalImage.jpg"/>

    Jeśli tworzysz łącze do obrazu w folderze HTMLResources, skorzystaj z następującej metody:

    <img src="../HTMLResources/GlobalImage.jpg"/>

Aby uzyskać więcej informacji na temat tworzenia hiperłączy do i z artykułów HTML, zobacz Tworzenie hiperłączy navto dla artykułów HTML.

Tworzenie artykułów HTML dla aplikacji Android Viewer

Informacje i wymagania dotyczące tworzenia artykułów HTML dla aplikacji Android Viewer zawiera artykuł Create HTML articles for Android Viewers (Tworzenie artykułów HTML dla przeglądarek Android Viewer).

Zasoby HTML5

Konfigurowanie filmów w artykułach HTML w taki sposób, aby zachowywały się jak pełnoekranowe nakładki wideo

Po utworzeniu artykułu HTML o pojedynczej orientacji z osadzonym wideo, obrócenie urządzenia może sprawić, że wideo również się obróci. Ponadto po zakończeniu odtwarzania wideo przeglądarka aplikacji odtwarzająca wideo może zostać zamknięta. Aby włączyć takie zachowanie, w łączu wideo HTML użyj przedrostka „videofile://”. Opcja ta jest dostępna tylko w przypadku aplikacji do systemu iOS.

Uwaga:

Przykłady zachowań dotyczące materiałów wideo można znaleźć w wydaniu „HTML Examples” bezpłatnej aplikacji DPS Tips (tylko w języku angielskim).

Standardowe zachowanie wideo

W tym przykładzie wideo odtwarzane jest w przeglądarce aplikacji i nie obraca się w folio o pojedynczej orientacji.<a href="Links/video.mp4">Odtwórz wideo</a>

lub <a href="../HTMLResources/videos/video.mp4">Odtwórz wideo</a>

Ulepszone zachowanie wideo

W tym przykładzie wideo obraca się w prawidłowy sposób w folio o pojedynczej orientacji i po zakończeniu odtwarzania powraca do artykułu.<a href="videfile://Links/video.mp4">Odtwórz wideo</a>

lub <a href="videofile://../HTMLResources/videos/video.mp4">Odtwórz wideo</a>

JavaScript

Zachowanie to można również uruchomić za pośrednictwem funkcji playFullscreenVideo języka JavaScript zastosowanej na obiekcie okna.<a onclick="window.playFullscreenVideo('Links/video.mp4');">Odtwórz wideo</a>

lub <a onclick="window.playFullscreenVideo('../HTMLResources/videos/video.mp4');">Odtwórz wideo</a>

Strumieniowa transmisja wideo

W tym przykładzie mamy do czynienia ze strumieniową transmisją wideo.<a href="videohttp://www.mysite.com/video.mp4">Odtwórz wideo</a>

Więcej zasobów tego rodzaju

Pomoc dostępna szybciej i łatwiej

Nowy użytkownik?

Podręczne łącza

Wyświetl swoje plany Zarządzaj planami
Wyświetl podręczne łącza
Ukryj podręczne łącza

Informacje prawne    |    Zasady prywatności online