Sie sehen sich Hilfeinhalte der folgenden Version an:

Eine Viewer-Vorgabe ist eine Sammlung aus Einstellungen, die bestimmen, wie Benutzer Rich-Media-Assets auf ihren Computerbildschirmen und Mobilgeräten anzeigen. Administratoren können Viewer-Vorgaben erstellen. Einstellungen sind für eine Vielzahl an Viewer-Konfigurationsoptionen verfügbar. Sie können beispielsweise die Viewer-Anzeigegröße oder das Zoomverhalten ändern.

Anweisungen zum Erstellen und Anpassen eigener HTML5-Viewer-Vorgaben finden Sie im Adobe Scene7 HTML5 Viewer SDK. Dieses kann unter Adobe Developer Connection heruntergeladen werden.

Siehe auch das Adobe Scene7-Viewer-Referenzhandbuch.

In diesem Abschnitt wird beschrieben, wie Viewer-Vorgaben erstellt, bearbeitet und verwaltet werden. Sie können jederzeit bei der Vorschau eines Assets eine Viewer-Vorgabe darauf anwenden. Siehe Anwenden von Viewer-Vorgaben.

Hinweis:

Denken Sie daran, dass die Bearbeitung von vordefinierten, standardmäßig vorhandenen Viewer-Vorgaben als Szenario nicht unterstützt wird. Wenn Sie versuchen, eine standardmäßig vorhandene Viewer-Vorgabe zu bearbeiten, werden Sie aufgefordert, die Viewer-Vorgabe unter einem neuen Namen zu speichern.

Möglichkeit des Zugriffs auf die Tastatur im Viewer

Alle standardmäßigen Viewer unterstützen den Zugriff auf die Tastatur.

Weitere Informationen finden Sie unter Tastaturzugriff und Navigation.

Verwalten von Viewer-Vorgaben

Sie können Viewer-Vorgaben in AEM hinzufügen, bearbeiten, löschen, veröffentlichen sowie Veröffentlichungen rückgängig machen und eine Vorschau anzeigen, indem Sie Tools (Hammersymbol) > Assets > Viewer-Vorgaben auswählen.

Tools-assets

Hinweis:

Standardmäßig zeigt das System 15 Viewer-Vorgaben, wenn Sie in einer Detailansicht eines Assets „Viewer“ auswählen. Sie können diesen Grenzwert erhöhen. Siehe Erhöhen der Anzahl angezeigter Viewer-Vorgaben.

Viewer-Unterstützung für Webseiten mit responsivem Design

Unterschiedliche Webseiten haben unterschiedliche Anforderungen. Mitunter möchten Sie vielleicht, dass eine Webseite über einen Link verfügt, der den HTML5-Viewer in einem separaten Browserfenster öffnet. In anderen Fällen kann es aber auch erforderlich sein, den HTML5-Viewer direkt auf der Hostseite einzubetten. In letzterem Fall kann die Webseite ein statisches Layout aufweisen. Oder sie kann „responsiv“ sein und auf verschiedenen Geräten oder bei verschieden großen Browserfenstern anders angezeigt werden. Um all diese Anforderungen zu berücksichtigen, unterstützen sämtliche vordefinierten, standardmäßig vorhandenen HTML5-Viewer, die mit Dynamic Media bereitgestellt werden, sowohl statische als auch responsive Webseiten.

Weitere Informationen zum Einbetten responsiver Viewer auf Webseiten finden Sie unter Bibliothek responsiver und statischer Bilder in der Scene7 Image Serving-API-Hilfe.

Hinweis:

Sie müssen zunächst alle standardmäßig vorhandenen Viewer veröffentlichen, um sie verwenden zu können.
Siehe Veröffentlichen von Viewer-Vorgaben.

Systemkompatibilität von Viewer-Vorgaben

Alle standardmäßig vorhandenen Viewer-Vorgaben, die mit Dynamic Media bereitgestellt werden, sind mit den folgenden Systemen vollständig kompatibel:

  • Desktops
  • Apple iPhones
  • Apple iPads
  • Android-Smartphones
  • Android-Tablets
  • Videos: zusätzliche Unterstützung zur MP4-Wiedergabe für Blackberry und Windows Phone

Rich-Media-Typen für Viewer-Vorgaben

Administratoren können die folgenden Rich-Media-Typen hinzufügen und anpassen, wenn sie Viewer-Vorgaben erstellen.

Karussell-Set

Hotspots, Imagemaps oder beide werden zu einer Reihe von mindestens zwei Bildern hinzugefügt. Kunden können einen Bildschwenk nach links oder rechts durchführen und dann auf einen Hotspot auf einem Bild klicken, um zusätzliche Details aufzurufen oder direkt über eine Kategorie-, Start- oder Einstiegsseite einer Website zu kaufen.

Flyout-Zoom

Zeigt ein zweites Bild des vergrößerten Bereichs neben dem Originalbild an. Dafür gibt es keine Steuerelemente. Benutzer verschieben die Auswahl auf den gewünschten Bereich.

Bei der Bestimmung der vollständigen Bandbreitenauslastung für diesen Viewer müssen Sie berücksichtigen, dass sowohl das Hauptbild als auch das Flyout-Bild im Viewer verarbeitet werden. Die Größe des Hauptbildes (Anzeigenbreite und -höhe) und der Zoomfaktor bestimmen die Größe des Flyout-Bildes. Sie müssen ein Gleichgewicht zwischen diesen beiden Werten schaffen, um zu verhindern, dass die Flyout-Datei zu groß wird: Wenn das Hauptbild sehr groß ist, reduzieren Sie den Zoomfaktor-Wert. (Die Flyout-Breite und Flyout-Höhe bestimmen die Größe des Flyout-Fensters, aber nicht die Größe des Flyout-Bildes, das im Viewer verarbeitet wird.)

Beispiel: Wenn das Hauptbild eine Größe von 350 x 350 Pixel und einen Zoomfaktor von 3 aufweist, hat das resultierende Flyout-Bild eine Größe von 1050 x 1050 Pixel. Wenn das Hauptbild eine Größe von 300 x 300 Pixel und einen Zoomfaktor von 4 aufweist, hat das Flyout-Bild eine Größe von 1200 x 1200 Pixel. Abhängig von der JPEG-Qualitätseinstellung (empfohlene Einstellungen liegen zwischen 80 und 90) können Sie die Dateigröße erheblich reduzieren. Als Zoomfaktor wird ein Wert zwischen 2,5 und 4 empfohlen, je nach Größe des Hauptbildes.

Inline-Zoom Zeigt ein Bild des hereingezoomten Bereichs im ursprünglichen Viewer an. Es stehen keinerlei Steuerelemente zur Verfügung. Benutzer verschieben vielmehr die Auswahl über den Bereich, der angezeigt werden soll.
Bildset Im Bildset-Viewer können Benutzer unterschiedliche Ansichten oder Farbvariationen eines Elements sehen, indem sie auf eine Miniaturansicht klicken. Dieser Viewer bietet auch Zoomtools, mit denen Bilder genauer untersucht werden können.
Interaktives Bild Hotspots werden zu Teilmengen eines Bildes hinzugefügt, auf das ein Kunde anschließend klicken kann, um zusätzliche Informationen zu erhalten oder den Kauf direkt über die Kategorie einer Website, über die Startseite oder Einstiegsseiten vorzunehmen.
Interaktives Video Miniaturen werden zu Zeitachsensegmenten in einem Video hinzugefügt, auf das ein Kunde anschließend klicken kann, um zusätzliche Informationen zu erhalten oder den Kauf direkt über die Kategorie einer Website, über die Startseite oder Einstiegsseiten vorzunehmen.
Gemischte Medien Zeigt unterschiedliche Medientypen in einem Viewer an. Dort können Sie Rotationssets, Bilder und Videos aufnehmen.
Panoramabild

Die Viewer für Panoramabilder und PanoramicVR geben Kugelpanoramen wieder, um Benutzern ein 360°-Betrachtererlebnis eines Zimmers, einer Immobilie, eines Orts oder einer Landschaft zu bieten.

Damit ein hochgeladenes Bild als Kugelpanorama gilt, muss mindestens eine der beiden folgenden Eigenschaften zutreffen:

  • Ein Seitenverhältnis von 2:1.
  • Mit den Keywords equirectangular oder spherical und panorama oder spherical und panoramic als Tags versehen. Weitere Informationen finden Sie unter Verwenden von Tags.

Die Kriterien für das Seitenverhältnis sowie die Keywords gelten für Panorama-Assets für die Asset-Detailseite und die WCM-Komponente „Panoramamedien“.

Rotationsset Stellt mehrere Ansichten eines Bildes bereit, sodass Benutzer den Gegenstand drehen können, um ihn von allen Seiten zu betrachten.
Video

Hierüber werden Videos durch Streaming mit adaptiver Bitrate wiedergegeben. Dabei wird eine automatische Geräte- und Brandbreitenerkennung durchgeführt, um Videos mit der richtigen Qualität und im richtigen Format bereitzustellen.

Vertikaler Zoom

Mit dem Viewer für vertikalen Zoom können Sie das Betrachtererlebnis für Produktbilder optimieren, um Ihren Benutzern die bestmögliche Darstellung eines Produktes zu bieten. Die vertikale Positionierung von Farbfeldern:

  • Stellt sicher, dass sich Farbfelder „oberhalb der Falte“ befinden.
    Bei einer horizontalen Platzierung von Farbfeldern sind die Farbfelder je nach Bildschirmgröße nicht sichtbar, bis der Benutzer auf der Seite nach unten scrollt. Wenn die Farbfelder vertikal im Viewer platziert werden, sind sie unabhängig von der Bildschirmgröße des Benutzers sichtbar.
  • Maximiert die Größe des Hauptbildes.
    Bei horizontalen Farbfeldern ist es erforderlich, Platz auf der Seite zu lassen, um sicherzustellen, dass sie sichtbar sind. Diese Positionierung verringerte die mögliche Größe des Hauptbildes. Bei einer vertikalen Farbfeld-Platzierung ist es jedoch nicht notwendig, diesen Platz freizulassen. Somit können Sie die Größe des Hauptbildes maximieren.
Zoom Damit können Benutzer den Bereich durch Klicken ein- und auszoomen. Benutzer können auf Steuerelemente klicken, um ein- und auszuzoomen und das Bild auf seine Standardgröße zurückzusetzen.

Liste standardmäßig vorhandener Viewer-Vorgaben

In der folgenden Tabelle werden alle vordefinierten, standardmäßig vorhandenen Viewer-Vorgaben, die mit Dynamic Media bereitgestellt werden, benannt.

Siehe auch Scene7-Viewer-Referenzbibliothek-Beispiele.

Informationen zu unterstützten Webbrowsern und Betriebssystemversionen für Viewer finden Sie in den Viewer-Versionshinweisen.

Siehe Scene7-Viewer-Versionshinweise.

Hinweis:

Alle standardmäßig vorhandenen Viewer-Vorgaben in Dynamic Media sind bereits aktiviert. Sie müssen sie allerdings noch veröffentlichen.
Siehe Veröffentlichen von Viewer-Vorgaben.

Alle neuen Viewer-Vorgaben, die Sie erstellen und hinzufügen, müssen aktiviert und veröffentlicht werden.
Siehe Aktivieren oder Deaktivieren von Viewer-Vorgaben und Veröffentlichen von Viewer-Vorgaben.

Viewer-Vorgabentitel Typ CSS-Dateiname
Carousel_Dotted_dark Carousel_Set html5_carouselviewer_dotted_dark.css
Carousel_Dotted_light Carousel_Set html5_carouselviewer_dotted_light.css
Carousel_Numeric_dark Carousel_Set html5_carouselviewer_numeric_dark.css
Carousel_Numeric_light Carousel_Set html5_carouselviewer_numeric_light.css
Flyout Flyout_Zoom html5_flyoutviewer.css
ImageSet_dark Image Set html5_zoomviewer_dark.css
ImageSet_light Image Set html5_zoomviewer_light.css
InlineMixedMedia_dark Mixed_Media html5_inlinemixedmediaviewer_dark.css
InlineMixedMedia_light Mixed_Media html5_inlinemixedmediaviewer_light.css
InlineZoom Flyout_Zoom html5_inlinezoomviewer.css
MixedMedia_dark Mixed_Media html5_mixedmediaviewer_dark.css
MixedMedia_light Mixed_Media html5_mixedmediaviewer_light.css
PanoramicImage Panoramic_Image html5_panoramicimage.css
PanoramicImageVR Panoramic_Image html5_panoramicimage.css
Shoppable_Banner Interactive_Image html5_interactiveimage.css
Shoppable_Video_dark Interactive_Video html5_interactivevideoviewer_dark.css
Shoppable_Video_light Interactive_Video html5_interactivevideovewer_light.css
SpinSet_dark Spin_Set html5_zoomviewer_dark.css
SpinSet_light Spin_Set html5_zoomviewer_light.css

Video

(mit Unterstützung für Untertitel)

Video html5_videoviewer.css

Video_social

(mit Unterstützung für Untertitel und soziale Medien)

Video html5_videoviewersocial.css
Zoom_dark
Zoom
html5_basiczoomviewer_dark.css
Zoom_light
Zoom html5_basiczoomviewer_light.css
ZoomVertical_dark
Vertical_Zoom html5_zoomverticalviewer_dark.css
ZoomVertical_light Vertical_Zoom html5_zoomverticalviewer_light.css

Matrix unterstützter Mobile Viewer-Gesten

In der folgenden Tabelle werden die Mobile Viewer-Gesten benannt, die auf iOS-, Android 2.x- und Android 3.x-Geräten unterstützt werden.

Geste Flyout-Zoom Zoom Rotation

Ziehen

Bildschwenk

Bildschwenk

Bildschwenk

Tippen

Anzeigen des Flyout-Fensters

Ein- oder Ausblenden der Benutzeroberfläche

Ein- oder Ausblenden der Benutzeroberfläche

Doppeltippen

Nicht zutreffend

Einzoomen oder Zurücksetzen

Einzoomen oder Zurücksetzen

Auseinanderziehen

Nicht zutreffend

Einzoomen (nur iOS und Android 3x)

Einzoomen (nur iOS und Android 3x)

Zusammenziehen

Nicht zutreffend

Auszoomen (nur iOS und Android 3x)

Auszoomen (nur iOS und Android 3x)

Wischen

Bildlauf für Musterleiste

Bildlauf für Bilder

Rotation

Streichen

Bildlauf für Musterleiste

Bildlauf für Bilder

Rotation

Erhöhen der Anzahl angezeigter Viewer-Vorgaben

Standardmäßig zeigt AEM 15 Viewer-Vorgaben an, wenn Assets über Detailansicht > Viewer aufgerufen werden. Sie können die maximale Anzahl angezeigter Viewer-Vorgaben erhöhen.

So erhöhen Sie die Anzahl angezeigter Viewer-Vorgaben:

  1. Navigieren Sie zu CRXDE Lite (http://localhost:4502/crx/de).

  2. Navigieren Sie zum Listenknoten für Viewer-Vorgaben unter /libs/dam/gui/coral/content/commons/sidepanels/viewerpresets/viewerpresetslist

    chlimage_1
  3. Ändern Sie in der Eigenschaft limit den standardmäßig auf 15 eingestellten Wert auf die gewünschte Zahl.

  4. Navigieren Sie zur Datenquelle für Viewer-Vorgaben unter /libs/dam/gui/coral/content/commons/sidepanels/viewerpresets/viewerpresetslist/datasource

    chlimage_1
  5. Ändern Sie in der Eigenschaft „limit“ den Wert auf die gewünschte Zahl, z. B. {empty requestPathInfo.selectors[1] ? "20" : requestPathInfo.selectors[1]}

  6. Tippen oder klicken Sie auf Alle speichern.

Erstellen neuer Viewer-Vorgaben

Durch Erstellen von Viewer-Vorgaben können Sie verschiedene Einstellungen anwenden, um Assets anzuzeigen und mit diesen zu interagieren. Sie müssen jedoch keine neuen Viewer-Vorgaben erstellen. Wenn Sie dies bevorzugen, können Sie auch die bereits standardmäßig in AEM Assets verfügbaren Viewer-Vorgaben verwenden.

Wenn Sie eine neue Viewer-Vorgabe erstellen möchten, wird nach deren Speicherung der Viewer-Status automatisch auf der Seite „Viewer-Vorgaben“ aktiviert (auf Ein gesetzt). Dieser Status bedeutet, dass die Vorgabe in der Komponente für dynamische Medien und in der Komponente für interaktive Medien sowie bei jeder Bild- oder Videovorschau sichtbar ist.

Bestimmte Viewer-Vorgaben weisen exklusive Einstellungen auf, die die Nutzung und das Gesamtverhalten des Viewers beeinflussen können. Je nach der von Ihnen erstellten Viewer-Vorgabe sollten Sie diese besonderen Hinweise berücksichtigen.    

Siehe Besondere Hinweise zum Erstellen von Viewer-Vorgaben für interaktive Videos.

Siehe Besondere Hinweise zum Erstellen von Viewer-Vorgaben für Karussellbanner.

So erstellen Sie eine neue Viewer-Vorgabe:

  1. Tippen Sie in der linken oberen Ecke von AEM auf das AEM-Logo und tippen Sie dann links in der Leiste auf Tools (Hammersymbol) > Assets > Viewer-Vorgaben.

    viewerpresets
  2. Tippen Sie auf der Seite „Viewer-Vorgaben“ auf der Symbolleiste auf Erstellen.

  3. Geben Sie im Dialogfeld Neue Viewer-Vorgabe in das Feld Vorgabename den Namen der neuen Vorgabe ein. Achten Sie darauf, einen geeigneten Namen festzulegen, da dieser nach dem Tippen auf Erstellen nicht mehr geändert werden kann.

    Wenn Sie die Vorgabe an späterer Stelle in diesen Schritten speichern, wird der Name auf der Seite „Viewer-Vorgaben“ unter der Spaltenüberschrift „Vorgabentitel“ angezeigt.

  4. Wählen Sie aus dem Dropdown-Menü „Rich-Media-Typ“ den Typ der zu erstellenden Viewer-Vorgabe aus und tippen Sie dann oben rechts auf der Seite auf Erstellen

    Siehe Rich-Media-Typen für Viewer-Vorgaben.

  5. Tippen Sie auf der Seite „Viewer-Vorgabe bearbeiten“ auf die Registerkarte Erscheinungsbild.

  6. Führen Sie einen der folgenden Schritte aus:

    • Wählen Sie aus dem Pulldown-Menü Ausgewählter Typ eine Komponente aus, deren visuelles Design angepasst werden soll. Sie können auch auf ein beliebiges visuelles Element im Viewer tippen oder klicken, um es zum Konfigurieren auszuwählen.

      Der Visual Editor zeigt Ihnen, wie sich eine bestimmte Eigenschaft auf einen Stil auswirkt. Legen Sie eine beliebige Eigenschaft fest bzw. passen Sie diese an, um sofort anhand des Beispiels auf der linken Seite des Editors zu sehen, wie sich dies auf den Viewer auswirkt.  

      Die CSS-Stileigenschaften für alle Viewer-Vorgabetypen werden im Abschnitt zum Anpassen von HTML5 des Viewer-Referenzhandbuchs für jeden HTML5-Viewer beschrieben. Wenn Sie z. B. eine Viewer-Vorgabe vom Typ Gemischte Medien erstellen, finden Sie im Thema zum Anpassen von HTML5-Viewern für gemischte Medien eine Aufstellung und Beschreibung jeder Eigenschaft.
    • Wenn Stileinstellungen in einer separaten CSS-Datei definiert sind, können Sie die CSS-Datei in AEM Assets hochladen. Tippen Sie unterhalb des Pulldown-Menüs „Ausgewählter Typ“ auf CSS importieren (ggf. müssen Sie hierzu einen Bildlauf im Visual Editor durchführen), um nach der hochgeladenen CSS-Datei zu suchen und diese mit der Viewer-Vorgabe zu verknüpfen.

      Beim Importieren einer CSS-Datei überprüft der Visual Editor, ob CSS die korrekten Viewer-Markierungen verwendet. Wenn Sie etwa einen Zoom-Viewer erstellen, müssen alle CSS-Regeln, die Sie importieren, mit dem zugehörigen Viewer-Klassennamen .s7mixedmediaviewer (definiert in einem übergeordneten Viewer-Element) festgelegt werden.

      Sie können beliebige, manuell erstellte CSS-Dateien importieren, solange diese die im Viewer-Referenzhandbuch beschriebenen Viewer-Markierungen ordnungsgemäß definieren. Es ist jedoch möglich, dass der Visual Editor nicht alle CSS-Werte versteht. In einem solchen Fall versucht der Visual Editor, die Fehler zu überschreiben, damit CSS nach wie vor verwendet werden kann. 

    Hinweis:

    Wenn Sie es vorziehen, CSS direkt in seiner Rohform zu bearbeiten, tippen Sie unterhalb des Pulldown-Menüs „Ausgewählter Typ“ auf CSS ein-/ausbl. (ggf. müssen Sie hierzu einen Bildlauf im Visual Editor durchführen).

    Wenn Sie eine Eigenschaft direkt in CSS ändern, können Sie wie im Visual Editor sofort sehen, wie sich dies auf das Viewer-Beispiel auswirkt. Außerdem wird zur gleichen Zeit genau diese Eigenschaft automatisch im Visual Editor aktualisiert. Daher können Sie entweder den CSS-Editor, den Visual Editor oder beide abwechselnd verwenden.

    Hinweis:

    Für Schaltflächengrafiken wählen Sie das 2x-Bild aus und laden Sie Grafiken mit hoher Auflösung hoch. Beim Arbeiten mit interaktiven Bildern und Bannern mit Einkaufsfunktion können Sie auch aus verschiedenen standardmäßig vorhandenen Hotspot-Schaltflächen wählen.  

  7. (Optional) Tippen Sie in der Nähe des oberen Bereichs der Seite „Viewer-Vorgabe bearbeiten“ auf Desktop, Tablet oder Telefon, um visuelle Stile für verschiedene Geräte- und Bildschirmtypen individuell zu definieren.

  8. Tippen Sie auf der Seite „Viewer-Vorgabe bearbeiten“ auf die Registerkarte Verhalten. Sie können auch auf ein beliebiges visuelles Element im Viewer tippen oder klicken, um es zum Konfigurieren auszuwählen.

  9. Wählen Sie aus dem Pulldown-Menü Ausgewählter Typ eine Komponente aus, deren Verhalten geändert werden soll.

    Viele Komponenten im Visual Editor sind mit einer detaillierten Beschreibung verknüpft. Diese Beschreibungen werden in blauen Feldern angezeigt, wenn Sie eine Komponente zum Anzeigen der mit ihr verknüpften Parameter einblenden.

    Einige Viewer-Typen besitzen Komponenten, mit denen Sie Image Serving-Befehle im Textfeld IS-Befehl festlegen können. Eine Liste der verfügbaren Befehle finden Sie in der Image Serving-API-Referenz.

    Hinweis:

    Bei Nutzung eines Touchgeräts, etwa eines Telefons oder Tablets:

    Nachdem Sie einen Wert in das Textfeld eingegeben haben, tippen Sie auf eine andere Stelle in der Benutzeroberfläche, um die Änderung weiterzuleiten und die virtuelle Tastatur zu schließen. Wenn Sie auf die Eingabetaste tippen, wird keine Aktion ausgeführt.

  10. Tippen Sie in der Nähe der oberen rechten Ecke auf Speichern.

  11. Veröffentlichen Sie die neue Viewer-Vorgabe. Sie müssen die Vorgabe veröffentlichen, um sie auf Ihrer Website verwenden zu können.

    Siehe Veröffentlichen von Viewer-Vorgaben.

Besondere Hinweise zum Erstellen von Viewer-Vorgaben für interaktive Videos

Wissenswertes über Anzeigemodi für Bildminiaturansichten im Anzeigefeld

Beim Erstellen oder Bearbeiten einer Viewer-Vorgabe für interaktive Videos können Sie die zu verwendende Anzeigemodus-Einstellung festlegen, wenn Sie auf der Registerkarte Verhalten aus dem Pulldown-Menü „Ausgewählte Komponente“ die Option für interaktive Muster auswählen. Der von Ihnen gewählte Anzeigemodus beeinflusst, wie und wann Miniaturansichten während der Videowiedergabe angezeigt werden. Sie können entweder den Anzeigemodus Segment (Standard) oder den Anzeigemodus Fortlaufend auswählen.

Anzeigemodus Beschreibung
Segment

Segment ist der standardmäßige Anzeigemodus für die vorab integrierten Viewer-Vorgaben für interaktive Videos Shoppable_Video_light und Shoppable_Video_dark sowie für alle von Ihnen erstellte Viewer-Vorgaben für interaktive Videos.

Wenn einem Videosegment weniger Miniaturansichten als sichtbare Spots im Anzeigefeld zugewiesen sind, werden in diesem Modus Miniaturansichten von den nächsten oder vorhergehenden Untersegmenten nicht herangezogen, um leere Spots im Feld aufzufüllen. So bleibt die Anzeige von einem bestimmten Videosegment zugewiesenen Mustern erhalten.

Fortlaufend

Wenn im Anzeigemodus Fortlaufend die Anzahl der Miniaturansichten in einem Segment kleiner ist als die Anzahl der sichtbaren Miniaturansichten im Anzeigefeld, schließt der Viewer automatisch die Anzeige der Miniaturansichten aus dem nächsten oder vorherigen Segment in den Fällen ein, in denen die letzte Miniaturansicht angezeigt wird.

Das Video in diesem Thema ist ein Beispiel für den Anzeigemodus Fortlaufend.

Wissenswertes über den automatischen Bildlauf im Viewer für interaktive Videos

Das automatische Bildlaufverhalten von Miniaturansichten der Viewer-Funktionen für interaktive Videos erfolgt unabhängig vom gewählten Anzeigemodus.

Um beim Erstellen oder Bearbeiten einer Viewer-Vorgabe für interaktive Videos auf die Option „Automatischer Bildlauf“ zuzugreifen, rufen Sie die Registerkarte „Verhalten“ auf. Tippen Sie auf der Registerkarte „Verhalten“ im Dropdown-Menü Ausgewählte Komponenten auf die Option für interaktive Muster. Das Kontrollkästchen „Automatischer Bildlauf“ befindet sich unter dem Textfeld „IS-Befehl“.

Wenn Sie in der Viewer-Vorgabe bei der Videowiedergabe durch den Benutzer die Option „Automatischer Bildlauf“ deaktivieren (das Kontrollkästchen abwählen), wird im Feld während der gesamten Videodauer nur das erste Miniaturbild angezeigt. Allerdings kann der Benutzer ggf. mithilfe der Pfeilsymbole nach oben und nach unten einen manuellen Bildlauf durch die Miniaturansichten durchführen.

Wenn Sie während der Videowiedergabe die Option „Automatischer Bildlauf“ in der Viewer-Vorgabe aktivieren (auswählen), werden die Miniaturbilder, die einem Videosegment zugewiesen sind, zu Beginn eines Segments in die Ansicht verschoben. Es gibt jedoch Instanzen, in denen bestimmte Miniaturansichten in einem Segment doppelt so lang angezeigt werden wie die Miniaturansichten vor und hinter ihnen. Zu diesem Verhalten kommt es, weil die Anzahl von Miniaturansichten in einem Segment größer ist als die Anzahl sichtbarer Miniaturansichten im Feld und diese nicht gleichmäßig verteilt sind.

Gehen wir zu Illustrationszwecken von einem 30 Sekunden langen Videosegment aus. Insgesamt gibt es neun Miniaturansichten, die im Laufe dieser 30 Sekunden angezeigt werden. Die Größe Ihres Browsers wird dergestalt geändert, dass vier verfügbare Miniaturpositionen im Anzeigefeld vorliegen. Das 30-sekündige Videozeitsegment ist in drei Untersegmente unterteilt. In der folgenden Tabelle wird aufgeschlüsselt, welche Miniaturansichten für ein bestimmtes Zeituntersegment angezeigt werden:

Videountersegment Untersegmentzeit in Sekunden Im Feld sichtbare Miniaturansichten
1 0-10 1, 2, 3, 4
2 10-20 4, 5, 6, 7
3 20-30 6, 7, 8, 9

Das Videountersegment 3 wird nicht über die Miniaturansichten hinweg erweitert, die ihm zugewiesen sind. Beachten Sie, dass die Miniaturansichten 4, 6 und 7 im Anzeigefeld doppelt so lang sichtbar sind wie die anderen.

Die durch den Viewer zum Bestimmen der Anzahl der im seitlichen Bedienfeld angezeigten Miniaturansichten verwendete Logik basiert wie folgt auf der Anzahl der verfügbaren Positionen:

  • Anzahl der Untersegmente = Aufrundung auf das nächste Untersegment (Anzahl der Miniaturansichten : Anzahl der sichtbaren Spots im Miniaturansichtsfeld, auf Grundlage der Browserfenstergröße)
    Unter Verwendung des Beispiels in der obigen Tabelle ergibt 9 Miniaturansichten : 4 Slots = 2,25, was die Viewer-Logik auf 3 Untersegmente aufrundet.

  • Anzahl der Miniaturen = Aufrundung auf die nächste Miniaturansicht (Anzahl der Miniaturansichten : Anzahl der Videountersegmente)
    Unter Verwendung des Beispiels in der obigen Tabelle ergibt 9 Miniaturansichten : 3 Videountersegmente = 3 Miniaturansichten.

  • Dauer des Untersegments = gesamte Videodauer : Anzahl der Videountersegmente
    Unter Verwendung des Beispiels in der obigen Tabelle ergibt 30 Sekunden : 3 Segmente = 10 Sekunden anhaltende Anzeige jedes Segments.

Besondere Hinweise zum Erstellen von Viewer-Vorgaben für Karussellbanner

Beim Erstellen von Viewer-Vorgaben für Karussellbanner kann der Stil von Hotspots wie folgt geändert werden:

  Beschreibung Aktionen
Hotspot-Symbol  Symbol für Hotspot ändern  Um das Symbolbild für Hotspots zu ändern, klicken oder tippen Sie auf der Registerkarte Erscheinungsbild unter Ausgewählte Komponente auf Imagemap-Effekt. Wählen Sie unter Symbol die Option Hintergrund und navigieren Sie im Feld Bild zum gewünschten Hintergrundbild.

Aktivieren oder Deaktivieren von Viewer-Vorgaben

Welche Viewer-Vorgaben in der Benutzeroberfläche verfügbar sind, hängt davon ab, welche Vorgaben aktiv sind. Nach dem Erstellen ist eine Viewer-Vorgabe standardmäßig auf „Ein“ eingestellt. Ggf. müssen Sie Viewer-Vorgaben deaktivieren, wenn die Liste zu umfangreich wird oder wenn eine Viewer-Vorgabe nicht zur Verfügung gestellt werden soll.

So aktivieren oder deaktivieren Sie Viewer-Vorgaben:

  1. Tippen Sie in der linken oberen Ecke von AEM auf das AEM-Logo und tippen Sie dann links in der Leiste auf Tools (Hammersymbol) > Assets > Viewer-Vorgaben.

  2. Tippen Sie auf der Seite „Viewer-Vorgabe“ unter der Spaltenüberschrift Status auf die Umschaltfläche zum Aktivieren bzw. Deaktivieren einer Viewer-Vorgabe.

    Bei aktivierten Viewer-Vorgaben wird die Umschaltfläche rechts in einem blauen Feld angezeigt; bei deaktivierten Viewer-Vorgaben wird die Umschaltfläche links in einem hellgrauen Feld angezeigt.

Veröffentlichen von Viewer-Vorgaben

Wird der Status einer Viewer-Vorgabe aktiviert (auf „Ein“ gestellt), bedeutet dies, dass sie in der Komponente für dynamische Medien, in der Komponente für interaktive Medien und bei jeder Anzeige eines Assets sichtbar ist.

Um jedoch ein Asset mit einer Viewer-Vorgabe bereitzustellen, muss die Viewer-Vorgabe auch veröffentlicht werden. Alle Viewer-Vorgaben müssen aktiviert und veröffentlicht werden, um die URL oder den Einbettungscode für ein Asset zu beziehen. Alle standardmäßigen Viewer-Vorgaben werden automatisch aktiviert und veröffentlicht. Von Ihnen erstellte benutzerdefinierte Viewer-Vorgaben werden automatisch aktiviert, müssen jedoch separat veröffentlicht werden.

Siehe Aktivieren oder Deaktivieren von Viewer-Vorgaben.

Siehe auch Anzeigen von Assets in einer Vorschau.

So veröffentlichen Sie Viewer-Vorgaben:

  1. Tippen Sie in der linken oberen Ecke von AEM auf das AEM-Logo und tippen Sie dann links in der Leiste auf Tools (Hammersymbol) > Assets > Viewer-Vorgaben.

  2. Wählen Sie eine oder mehrere Viewer-Vorgaben zum Veröffentlichen aus.

  3. Tippen Sie auf der Symbolleiste auf das Symbol Veröffentlichen.

Anzeigen von Viewer-Vorgaben in einer Vorschau

So zeigen Sie Viewer-Vorgaben in einer Vorschau an:

  1. Tippen Sie in der linken oberen Ecke von AEM auf das AEM-Logo und tippen Sie dann links in der Leiste auf Tools (Hammersymbol) > Assets > Viewer-Vorgaben.

  2. Wählen Sie einen einzelnen Vorgabentitel aus, zu dem Sie eine Vorschau anzeigen möchten.

  3. Tippen Sie auf der Symbolleiste auf das Symbol Vorschau.

  4. (Optional) Tippen Sie auf der Seite „Viewer-Vorgabenansicht“ oben rechts auf Durchsuchen, um ein anderes Asset für die Vorschau auszuwählen.

Sortieren von Viewer-Vorgaben

  1. Tippen Sie in der linken oberen Ecke von AEM auf das AEM-Logo und tippen Sie dann links in der Leiste auf Tools (Hammersymbol) > Assets > Viewer-Vorgaben.

  2. Klicken Sie auf Vorgabentitel, Typ, Veröffentlicht oder Status, um nach dieser Spaltenüberschrift zu sortieren. Klicken Sie beispielsweise auf Typ, um die Viewer-Vorgabentypen in alphabetischer oder in umgekehrt alphabetischer Reihenfolge zu sortieren.

Bearbeiten von Viewer-Vorgaben

Denken Sie daran, dass die Bearbeitung von vordefinierten, standardmäßig vorhandenen Viewer-Vorgaben als Szenario nicht unterstützt wird. Wenn Sie eine standardmäßig vorhandene Viewer-Vorgabe bearbeiten, werden Sie aufgefordert, die Viewer-Vorgabe unter einem neuen Namen zu speichern.

So bearbeiten Sie Viewer-Vorgaben:

  1. Tippen Sie in der linken oberen Ecke von AEM auf das AEM-Logo und tippen Sie dann links in der Leiste auf Tools (Hammersymbol) > Assets > Viewer-Vorgaben.

  2. Wählen Sie eine Vorgabe aus, indem Sie das Kontrollkästchen links neben dem Viewer-Vorgabentitel aktivieren.

  3. Tippen oder klicken Sie auf der Symbolleiste auf Bearbeiten.

  4. Nehmen Sie auf der Seite Viewer-Vorgabe bearbeiten die gewünschten Änderungen an der Viewer-Vorgabe vor.

  5. Führen Sie einen der folgenden Schritte aus:

    • Tippen Sie auf Speichern, um Ihre Änderungen zu speichern und zur Seite „Viewer-Vorgabe“ zurückzukehren.
    • Tippen Sie auf Abbrechen, um alle von Ihnen vorgenommenen Änderungen rückgängig zu machen und zur Seite „Viewer-Vorgaben“ zurückzukehren.

Löschen von Viewer-Vorgaben

So löschen Sie Viewer-Vorgaben:

  1. Tippen Sie in der linken oberen Ecke von AEM auf das AEM-Logo und tippen Sie dann links in der Leiste auf Tools (Hammersymbol) > Assets > Viewer-Vorgaben.

  2. Wählen Sie auf der Seite „Viewer-Vorgaben“ einen Vorgabentitel aus und tippen Sie dann auf das Symbol Papierkorb.

  3. Tippen Sie auf Löschen.

Anwenden von Viewer-Vorgaben auf Assets

Wenn Sie bereits das Asset und den ausgewählten Viewer veröffentlicht haben, werden die Schaltflächen URL und Einbetten nach Auswahl einer Viewer-Vorgabe angezeigt.

So wenden Sie eine Viewer-Vorgabe auf ein Asset an:

  1. Öffnen Sie das Asset, tippen Sie in der Nähe des oberen linken Bereichs der Seite auf das Dropdown-Menü und wählen Sie Viewer aus.

    Hinweis:

    Wenn Sie bereits das Asset und den ausgewählten Viewer veröffentlicht haben, werden die Schaltflächen URL und Einbetten nach Auswahl einer Viewer-Vorgabe angezeigt.

  2. Wählen Sie eine Viewer-Vorgabe im linken Bereich aus, um sie auf das Asset anzuwenden.

    Sie können die URL kopieren, um sie für andere Benutzer freizugeben.

Bereitstellen von Assets mit Viewer-Vorgaben

Informationen zum Abrufen der URLs für Viewer-Vorgaben finden Sie unter Verknüpfen von URLs für Ihre Webanwendung. Siehe auch Einbetten des Video-Viewers auf einer Webseite.

Wenn Sie AEM als WCM verwenden, können Sie Assets mithilfe der Viewer-Vorgaben direkt auf der Seite hinzufügen. Siehe Hinzufügen von Assets mit dynamischen Medien zu Seiten.

Dieses Werk unterliegt den Bedingungen der Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License.  Twitter™- und Facebook-Beiträge fallen nicht unter die Bedingungen der Creative Commons-Lizenz.

Rechtliche Hinweise   |   Online-Datenschutzrichtlinie