Karussellbanner

Mit Karussellbannern können Marketingexperten die Konversionsrate steigern, indem sie auf einfache Art Drehbanner mit Promo-Inhalten erstellen, die auf beliebigen Bildschirmen bereitgestellt werden können.

Das Erstellen und Ändern von Inhalten auf Werbebannern kann zeitaufwendig sein und Ihre Fähigkeit beeinträchtigen, neue Inhalte schnell zu veröffentlichen oder zielgerichteter zu gestalten. Karussell-Banner ermöglichen Ihnen das schnelle Erstellen oder Ändern rotierender Banner und das Hinzufügen von Interaktivität wie Hotspot-Verknüpfungen zu Produktdetails oder verwandten Ressourcen. Sie können sie für jeden Bildschirm bereitstellen und so neue Werbeinhalte schneller auf den Markt bringen.

Karussellbanner sind Banner, die durch die Bezeichnung CAROUSELSET gekennzeichnet sind:

chlimage_1-438

Auf Ihrer Website kann ein Karussellbanner wie folgt aussehen:

chlimage_1-439

Hier können Sie durch die Bilder navigieren, indem Sie auf die Zahlen klicken. Zusätzlich drehen sich die Folien automatisch basierend auf einem Intervall, das Sie anpassen können. Bilder in Karussell-Bannern unterstützen sowohl Hotspots als auch Imagemaps. Die Benutzer können entweder auf einen Hyperlink tippen, zu einem Hyperlink wechseln oder auf ein Quick Ansicht-Fenster zugreifen.

In diesem Beispiel hat ein Benutzer auf eine Imagemap getippt oder geklickt und für Handschuhe auf das Fenster "Schnelle Ansicht"zugegriffen:

chlimage_1-440

Sehen Sie sich eine exemplarische Vorgehensweise an zu wie Karussellbanner erstellt werden (Dauer: 10 Minuten und 33 Sekunden). Außerdem erfahren Sie, wie Karussell-Banner Vorschau, bearbeitet und bereitgestellt werden.

HINWEIS

Benutzer, die keine Administratoren sind, müssen der Gruppe dam-users hinzugefügt werden, damit sie Karussellbanner erstellen oder bearbeiten können. Wenn Sie Probleme beim Erstellen oder Bearbeiten haben, wenden Sie sich an Ihren Systemadministrator, der Sie zur Gruppe dam-users hinzufügen kann.

So schaffen Sie einen schnellen Einstieg:

  1. Identifizieren Sie Hotspot- und Imagemap-Variablen (nur für Kunden, die Adobe Experience Manager Assets + Dynamic Media verwenden).

    Beginn durch Identifizieren der dynamischen Variablen, die von der vorhandenen Quick Ansicht-Implementierung verwendet werden. Auf diese Weise können Sie Hotspots und Imagemap-Daten während der Erstellung von Karussellbannern in Experience Manager Assets ordnungsgemäß eingeben.

  1. Optional: Erstellen Sie eine Viewer-Vorgabe für Karussellsets bei Bedarf.

    Wenn Sie ein Administrator sind, können Sie das Verhalten und das Erscheinungsbild des Karussells anpassen, indem Sie eine eigene Karussell-Viewer-Vorgabe erstellen. Der Hauptvorteil besteht darin, dass Sie diese benutzerdefinierte Viewer-Vorgabe für mehrere Karussells wiederverwenden können. Benutzer können das Verhalten und Erscheinungsbild des Karussells jedoch optional direkt beim Authoring des Karussells anpassen. Dieser Ansatz wird bevorzugt, wenn Sie ein bestimmtes Design für ein bestimmtes Karussell wünschen.

  2. Laden Sie ein Bildbanner hoch.

    Laden Sie Bildbanner hoch, die interaktiv sein sollen.

  3. Erstellen Sie ein Karussellset.

    In Karussellsets navigieren Benutzer durch Bannerbilder und tippen auf Hotspots oder Imagemaps, um auf relevante Inhalte zuzugreifen.

    Um ein Karussellset in Assets zu erstellen, tippen Sie auf Erstellen und wählen Sie dann Karussellsets. Fügen Sie den Folien dann Assets hinzu und tippen Sie auf Speichern. Sie können das Erscheinungsbild und Verhalten des Karussells auch direkt im Editor bearbeiten.

  4. Fügen Sie Hotspots oder Imagemaps in einem Bildbanner hinzu.

    hinzufügen einem oder mehreren Hotspots oder Imagemaps zu einem Bildbanner. Verknüpfen Sie dann jede der beiden Aktionen mit einem Link, einer Quick-Ansicht oder einem Erlebnisfragment. Nachdem Sie Hotspots oder Imagemaps hinzugefügt haben, schließen Sie diese Aufgabe ab, indem Sie das Karussellset veröffentlichen. Durch das Veröffentlichen wird der Einbettungs-Code erstellt, den Sie kopieren und auf die Landingpage Ihrer Website anwenden können.

    Siehe (Optional) Anzeigen einer Vorschau für Karussellbanner – Optional. Bei Bedarf können Sie eine Darstellung des Karussellsets anzeigen und dessen Interaktivität testen.

  5. Veröffentlichen Sie Karussellbanner.

    Sie veröffentlichen ein Karussellset wie jedes andere Asset. Navigieren Sie in Assets zum Karussellset, wählen Sie es aus und tippen Sie auf Veröffentlichen. Durch Veröffentlichen eines Karussellsets wird die URL und die Einbettungszeichenfolge aktiviert.

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

Wenn Sie Karussellsätze bearbeiten müssen, lesen Sie Karussellsätze bearbeiten. . Darüber hinaus können Sie Eigenschaften von Karussellsets anzeigen und bearbeiten.

Ermitteln von Hotspot- und Imagemap-Variablen

Beginn durch Identifizieren der dynamischen Variablen, die von der vorhandenen Quick Ansicht-Implementierung verwendet werden. Auf diese Weise können Sie Hotspots oder Imagemap-Daten während der Karussellsatzerstellung in Experience Manager Assets ordnungsgemäß eingeben.

Wenn Sie Hotspots oder Imagemaps zu einem Bannerbild hinzufügen, weisen Sie eine SKU (Stock Keeping Unit) zu. Sie können jedem Hotspot oder jeder Imagemap optional zusätzliche Variablen zuweisen. Diese Variablen werden später verwendet, um Hotspots oder Imagemaps mit Quick Ansicht-Inhalten abzugleichen.

Es ist wichtig, die Anzahl und den Typ der Variablen, denen Hotspot- oder Imagemap-Daten zugewiesen werden sollen, korrekt zu ermitteln. Jeder Hotspot oder jede Imagemap, die einem Bannerbild hinzugefügt wird, muss genügend Informationen enthalten, um das Produkt im bestehenden Back-End-System eindeutig zu identifizieren. Gleichzeitig sollten Sie sicherstellen, dass jeder Hotspot oder jede Imagemap nicht mehr Daten enthält, als erforderlich sind. Dies würde die Dateneingabe unnötig erschweren und bei der Verwaltung von Hotspots und Imagemaps könnten leichter Fehler auftreten.

Es gibt verschiedene Möglichkeiten, den für Hotspot- oder Imagemap-Daten zu verwendenden Variablensatz zu ermitteln,

Manchmal reicht es aus, sich mit IT-Spezialisten zu beraten, die für die Implementierung der Quick Ansicht zuständig sind. Sie wissen wahrscheinlich, was der Mindestsatz an Daten ist, um eine schnelle Ansicht im System zu identifizieren. Es ist jedoch möglich, das bestehende Verhalten des Front-End-Codes einfach zu analysieren.

Bei den meisten Implementierungen der schnellen Ansicht wird das folgende Paradigma verwendet:

  • Benutzer aktiviert ein Benutzeroberflächenelement auf der Website. Beispielsweise durch Klicken auf die Schaltfläche für eine Schnellansicht.
  • Die Website sendet eine Ajax-Anforderung an das Backend, um die Daten oder den Inhalt der Quick-Ansicht zu laden, falls erforderlich.
  • Die Daten zur schnellen Ansicht werden in den Inhalt übersetzt, um die Wiedergabe auf der Webseite vorzubereiten.
  • Schließlich zeigt der Frontend-Code diesen Inhalt visuell auf dem Bildschirm an.

Der Ansatz besteht dann darin, verschiedene Bereiche der bestehenden Website zu besuchen, in denen die Schnellfunktion zur Ansicht implementiert ist. Anschließend können Sie die Quick-Ansicht abrufen und die Ajax-URL abrufen, die von der Webseite zum Laden der Daten oder des Inhalts der Quick-Ansicht gesendet wird.

Normalerweise müssen Sie keine speziellen Debugging-Tools verwenden. Moderne Webbrowser verfügen über Web-Inspektoren, die dafür ausreichend sind. Die folgenden Webbrowser beispielsweise umfassen Web-Inspektoren:

  • Um alle ausgehenden HTTP-Anfragen in Google Chrome anzuzeigen, drücken Sie F12 (Windows®) oder Command-Option-I (Mac), um das Developer Tool-Bedienfeld zu öffnen. Tippen Sie auf die Registerkarte Netzwerk.
  • In Firefox können Sie das Firebug-Plug-in entweder durch Drücken von F12 (Windows®) oder Befehl-Option-I (Mac) aktivieren. Verwenden Sie die Registerkarte "Netzwerk"oder das integrierte Inspektor-Tool und dessen Registerkarte "Netzwerk".

Wenn die Netzwerküberwachung im Browser aktiviert ist, Trigger die Schnellseite der Ansicht.

Suchen Sie nun die Ajax-URL der Schnellversion im Netzwerkprotokoll und kopieren Sie die aufgezeichnete URL für die zukünftige Analyse. Normalerweise werden beim Trigger der Quick-Ansicht zahlreiche Anfragen an den Server gesendet. Normalerweise ist die Ajax-URL für die schnelle Ansicht eine der ersten in der Liste. Sie weist einen Teil oder Pfad mit einer komplexen Abfragezeichenfolge auf und ihr MIME-Typ lautet entweder text/xml, text/html oder text/javascript.

Dabei ist es wichtig, verschiedene Bereiche Ihrer Website mit unterschiedlichen Kategorien und Typen zu besuchen. Der Grund dafür ist, dass die URLs der schnellen Ansicht Teile enthalten, die für eine bestimmte Website-Kategorie häufig vorkommen, sich aber nur ändern, wenn Sie einen anderen Bereich der Website besuchen.

Im einfachsten Fall ist die Produkt-SKU der einzige Variablenteil in der Quick Ansicht-URL. In diesem Fall ist der SKU-Wert der einzige Datenteil, den Sie benötigen, um dem Bannerbild Hotspots oder Imagemaps hinzuzufügen.

In komplexen Fällen enthält die URL der Schnellkorrektur jedoch zusätzlich zur SKU verschiedene Variablenelemente. Einige dieser Elemente beinhalten Kategorien-ID, Farbcode, Größencode usw. In diesen Fällen ist jedes Element eine separate Variable in der Hotspot- oder Imagemap-Datendefinition innerhalb der Karussellbanner-Funktion.

Betrachten Sie die folgenden Beispiele für URLs für die schnelle Ansicht und die sich daraus ergebenden Hotspot- oder Imagemap-Variablen:

Einzelne SKU, befindet sich in der Abfragezeichenfolge.

Zu den aufgezeichneten URLs für die schnelle Ansicht gehören:

  • https://server/json?productId=866558&source=100

  • https://server/json?productId=1196184&source=100

  • https://server/json?productId=1081492&source=100

  • https://server/json?productId=1898294&source=100

Der einzige variable Teil der URL ist der Wert des Abfrageparameters productId= und es ist offensichtlich ein SKU-Wert. Daher benötigen Hotspots oder Imagemaps nur SKU-Felder, die mit Werten wie 866558, 1196184, 1081492, 1898294.

Einzelne SKU, befindet sich im URL-Pfad.

Zu den aufgezeichneten URLs für die schnelle Ansicht gehören:

  • https://server/product/6422350843

  • https://server/product/1607745002

  • https://server/product/0086724882

Der variable Teil befindet sich im letzten Abschnitt des Pfads und wird zum SKU-Wert der Hotspots/Imagemaps:6422350843, 1607745002, 0086724882.

SKU und Kategorie-ID in der Abfragezeichenfolge.

Zu den aufgezeichneten URLs für die schnelle Ansicht gehören:

  • https://server/quickView/product/?category=1100004&prodId=305466

  • https://server/quickView/product/?category=1100004&prodId=310181

  • https://server/quickView/product/?category=1740148&prodId=308706

In diesem Fall liegen zwei abweichende Teile in der URL vor. Die SKU wird im Parameter prodId gespeichert, während die Kategorie-ID im Parameter category= gespeichert wird.

Bei den Hotspot- oder Imagemap-Definitionen selbst handelt es sich um Paare. Das heißt, ein SKU-Wert und eine zusätzliche Variable namens categoryId. Die resultierenden Paare lauten wie folgt:

  • Die SKU lautet 305466 und categoryId lautet 1100004.

  • Die SKU lautet 310181 und categoryId lautet 1100004.

  • Die SKU lautet 308706 und categoryId lautet 1740148.

Hochladen von Bildbannern

Wenn Sie bereits die Bilder hochgeladen haben, die Sie verwenden möchten, fahren Sie mit dem nächsten Schritt Erstellen von Karussellsets fort. Die im Karussell verwendeten Bilder müssen nach der Aktivierung von Dynamic Media hochgeladen werden.

Informationen zum Hochladen von Bildbannern finden Sie unter Hochladen von Assets.

HINWEIS

Benutzer, die keine Administratoren sind, müssen der Gruppe dam-users hinzugefügt werden, damit sie Karussellbanner erstellen oder bearbeiten können. Wenn Sie Probleme beim Erstellen oder Bearbeiten haben, wenden Sie sich an Ihren Systemadministrator, der Sie der Gruppe dam-users hinzufügen kann.

So erstellen Sie ein Karussellset:

  1. Navigieren Sie in Assets zu dem Ordner, in dem Sie das Karussellset erstellen möchten, und tippen Sie auf Erstellen > Karussellset.

  2. Tippen Sie im Karussellbanner-Editor auf Tippen, um die Asset-Auswahl zu öffnen, um das Bild für die erste Folie auszuwählen.

    Führen Sie im Karussellbanner-Editor eine der folgenden Aktionen aus:

    • Tippen Sie oben links auf Folie hinzufügen.

    • Tippen Sie in der Mitte der Seite auf Tippen, um die Asset-Auswahl zu öffnen.

    Tippen Sie zur Auswahl von Assets, die Sie in das Karussellset aufnehmen möchten. Die ausgewählten Assets sind mit einem Häkchen versehen. Wenn Sie fertig sind, tippen Sie rechts oben auf der Seite auf Auswahl.

    Mit der Asset-Auswahl können Sie nach Assets suchen, indem Sie ein Keyword eingeben und auf Zurück tippen/klicken. Sie können auch Filter anwenden, um Ihre Suchergebnisse genauer abzustimmen. Sie können nach Pfad, Sammlung, Dateityp und Tag filtern. Wählen Sie den Filter aus und tippen Sie dann in der Symbolleiste auf das Symbol Filter. Ändern Sie die Ansicht, indem Sie das Symbol „Ansicht“ tippen und dann Spaltenansicht, Kartenansicht oder Listenansicht wählen.

    Weitere Informationen finden Sie unter Arbeiten mit Selektoren.

  3. Fügen Sie weitere Folien hinzu, bis Sie alle gewünschten Bilder für das Karussellset ausgewählt haben.

  4. (Optional) Führen Sie einen der folgenden Schritte aus:

    • Ziehen Sie bei Bedarf die Folios, um die Anordnung der Bilder in der Liste zu ändern.

    • Um ein Bild zu löschen, wählen Sie das Bild aus und tippen Sie dann in der Symbolleiste auf Folie löschen.

    • Um eine Vorgabe anzuwenden, tippen Sie oben rechts auf die Dropdown-Liste mit den Vorgaben. Wählen Sie anschließend eine Vorgabe aus, um sie auf das ganze Set anzuwenden.

    Um eine Folie zu löschen, tippen oder klicken Sie auf die Folie und tippen und klicken Sie auf Folie löschen in der Symbolleiste. Um eine Folie zu verschieben, tippen Sie auf das Symbol "Neu anordnen", halten Sie die Taste gedrückt und verschieben Sie sie an die gewünschte Position.

  5. Nachdem Sie die Bilder in den Folien hinzugefügt haben, können Sie einen Hotspot, eine Imagemap oder beides in die Bilder einfügen. Siehe Hinzufügen von Hotspots oder Imagemaps.

  6. Sie können das visuelle Design und das Verhalten von Karussellsätzen ändern. Tippen oder klicken Sie auf die Registerkarten Verhalten und Erscheinungsbild und passen Sie an, wie das Karussellbanner angezeigt wird oder wie sich bestimmte Komponenten verhalten. Weitere Informationen zum Verwenden des Viewer-Editors finden Sie unter Verwalten von Viewer-Vorgaben.

    HINWEIS

    Für Karussellbanner können Sie Folgendes anpassen:

    • Dauer der Anzeige eines Bildes Standardmäßig wird jedes Bild für 9 Sekunden angezeigt.
    • Animation. Standardmäßig sind alle Folienübergänge Überblendungen. Sie können einen anderen Übergang auswählen.
    • Stil der Schaltflächen Benutzer können die Banner durchlaufen, indem sie auf die jeweiligen Punkte oder Zahlen tippen. Sie können ändern, wo die Set-Indikatoren angezeigt werden (und ob es sich um einen numerischen oder Punktstil handelt). Sie können auch ihre Größe bestimmen.
    • Ändern des Markierungsstils einer Imagemap oder des Symbols für Hotspots.
    • Bevor Sie eine Viewer-Vorgabe bearbeiten, wählen Sie den Stil, auf dem die Vorgabe basieren soll. Wenn Sie keinen Stil auswählen und die Viewer-Vorgabe bearbeiten möchten, gehen alle Änderungen verloren, wenn Sie zu einer anderen Vorgabe wechseln.

    Sie können auch das Erscheinungsbild des Karussell-Banners Vorschau haben. Siehe (Optional) Anzeigen einer Vorschau für Karussellbanner.

  7. Tippen Sie auf Speichern, wenn Sie fertig sind.

Hinzufügen von Hotspots oder Imagemaps in einem Bildbanner

Sie können einem Banner mithilfe des Karussellset-Editors Hotspots oder Imagemaps hinzufügen.

Wenn Sie Hotspots oder Imagemaps hinzufügen, können Sie diese als Popup-Ansicht, als Hyperlink oder als Erlebnisfragment definieren.

Siehe Experience Fragment.

HINWEIS

Die Social-Media-Freigabe-Werkzeuge im Karussell-Banner werden nicht unterstützt, wenn Sie den Viewer in ein Erlebnisfragment einbetten.

Um dieses Problem zu umgehen, können Sie Viewer-Vorgaben verwenden oder erstellen, für die keine Social Media-Sharing-Werkzeuge zur Verfügung stehen. Mit diesen Viewer-Vorgaben können Sie sie erfolgreich in Experience Fragments einbetten.

Vergessen Sie nicht, Ihre Arbeit zu speichern, wenn Sie einem Bild Hotspots oder Imagemaps hinzufügen. Die Optionen „Rückgängig“ und „Wiederholen“ in der Nähe der oberen rechten Ecke der Seite werden während der aktuellen Erstellungs-/Bearbeitungssitzung unterstützt.

Wenn Sie mit der Erstellung des Karussellbanners fertig sind, können Sie optional mit der Vorschau eine Darstellung der Darstellung Ihres Karussellbanners für Ihre Kunden anzeigen.

Siehe (Optional) Anzeigen einer Vorschau für Karussellbanner.

HINWEIS

Wenn Sie einem Bild-Banner Hotspots hinzufügen, werden die Hotspot-Informationen relativ zum Speicherort des Bildes am selben Metadatenspeicherort gespeichert. Dieser Punkt trifft zu, unabhängig davon, ob es sich um ein interaktives Bild oder ein Karussell-Banner handelt. Dank dieser Funktion können Sie dasselbe Bild - zusammen mit den definierten Hotspot-Daten - in beiden Viewern problemlos wiederverwenden.
Beachten Sie jedoch, dass Karussellbanner Imagemaps auf Bildern unterstützen, die auch Hotspots enthalten können. Bei interaktiven Bildern wird dies dagegen nicht unterstützt. Beachten Sie diese Hinweise, wenn Sie ein interaktives Bild oder ein Karussell-Banner erstellen möchten, das dasselbe Bild verwendet. Sie sollten stattdessen interaktive Bilder und Karussell-Banner mit separaten Kopien desselben Bildes erstellen.

HINWEIS

Wenn Sie interaktive Bilder mit Hotspots bearbeiten, um das Bild zu beschneiden, werden die Hotspots entfernt.

So fügen Sie Hotspots oder Imagemaps in einem Bildbanner hinzu:

  1. Navigieren Sie in Assets zu dem Karussellset, das interaktiv werden soll.

  2. Wählen Sie das Karussellset aus und tippen Sie auf Bearbeiten. Der Karussell-Viewer-Editor wird geöffnet.

  3. Wählen Sie die Folie aus, die interaktiv sein soll.

  4. Tippen Sie in der Nähe der linken oberen Ecke der Seite auf Hotspot oder Imagemap.

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

    • Hotspots: Tippen Sie auf dem Bild auf eine Stelle, an der der Hotspot angezeigt werden soll.
    • Für Imagemaps: Klicken Sie im Bild auf und ziehen Sie dann von oben links nach unten rechts, um den Imagemap-Bereich zu erstellen. Sie können die Größe der Imagemap anpassen, indem Sie an den Ecken ziehen.

    Ziehen Sie den Hotspot oder die Imagemap ggf. an eine neue Position. Sie können auch die Pfeiltasten verwenden, um die Position eines ausgewählten Hotspots zu steuern. hinzufügen Sie nach Bedarf weitere Hotspots oder Imagemaps.

    Um einen Hotspot oder eine Image Map zu löschen, tippen Sie auf die Registerkarte Aktionen. Wählen Sie unter der Überschrift Karten und Hotspots aus der Dropdown-Liste Ausgewählter Typ den Namen des Hotspots oder der Imagemap, den Sie entfernen möchten. Tippen Sie auf das Papierkorb-Symbol neben dem Menü und dann auf Löschen.

  6. Geben Sie im Textfeld „Name“ den Namen des Hotspots oder der Imagemap ein. Dieser Name wird auch in der Dropdown-Liste Karten und Hotspots angezeigt. Wenn Sie einen Namen angeben, können Sie den Hotspot oder die Imagemap leicht identifizieren, wenn Sie ihn in Zukunft ändern möchten.

  7. Führen Sie einen der folgenden Schritte auf der Registerkarte Aktion aus:

    • Tippen Sie auf Schnellere Ansicht.

      • Wenn Sie Experience Manager-Sites sind, tippen Sie auf das Symbol "Produktauswahl"(Lupe), um die Seite "Produkt auswählen"zu öffnen. Um zum Karussell-Banner-Editor zurückzukehren, tippen Sie auf das gewünschte Produkt und dann auf das Häkchen in der oberen rechten Ecke der Seite.

      • Wenn Sie kein Experience Manager sind Sites Kunde:

        • Variablen definieren. Informationen hierzu finden Sie unter Ermitteln von Hotspot-Variablen.

        • Geben Sie anschließend manuell den SKU-Wert ein. Geben Sie im Textfeld „SKU-Wert“ die Bestandseinheit (Stock Keeping Unit, SKU) des Produkts ein. Hierbei handelt es sich um eine eindeutige Kennung für die jeweiligen von Ihnen angebotenen Produkte oder Services. Der eingegebene SKU-Wert füllt automatisch den Variablenteil der Quick Ansicht-Vorlage aus. Das System weiß nun, den getippten Hotspot mit einer bestimmten SKU-Schnellfunktion zu verbinden.

        • (Optional) Wenn sich in der Quick-Ansicht noch andere Variablen befinden, die Sie zur weiteren Identifizierung eines Produkts verwenden müssen, tippen Sie auf Hinzufügen Generische Variable. Geben Sie im Textfeld eine zusätzliche Variable an. Beispielsweise ist category=Men eine hinzugefügte Variable.

        • Weitere Informationen finden Sie unter Arbeiten mit Selektoren.

    • Tippen Sie auf Hyperlink.

      • Wenn Sie AEM Sites-Kunde sind, tippen Sie auf das Symbol zur Site-Auswahl (Ordner), um zu einer URL zu navigieren.

        HINWEIS

        Die URL-basierte Verknüpfungsmethode ist nicht möglich, wenn Ihr interaktiver Inhalt über Links mit relativen URLs verfügt, insbesondere über Links zu Seiten in AEM Sites.

      • Wenn Sie ein eigenständiger Kunde sind, geben Sie im Textfeld "href"den vollständigen URL-Pfad zu einer verknüpften Webseite an.

    Vergessen Sie nicht anzugeben, ob der Link auf einer neuen Browser-Registerkarte (empfohlener Standard) oder auf derselben Registerkarte geöffnet werden soll.

    Weitere Informationen finden Sie unter Arbeiten mit Selektoren.

    • Tippen Sie auf Experience Fragment.

      • Wenn Sie AEM Sites-Kunde sind, tippen Sie auf das Suchsymbol (Lupe), um die Seite „Experience Fragment“ zu öffnen. Um zur Hotspot-Verwaltungsseite zurückzukehren, tippen Sie auf das Erlebnisfragment, das Sie verwenden möchten, und tippen Sie dann oben rechts auf der Seite auf Auswählen.
        Weitere Informationen finden Sie unter Experience Fragments.

      • Geben Sie die Breite und Höhe des Erlebnisfragments so an, wie es auf dem Banner angezeigt wird.

        HINWEIS

        Die Social-Media-Freigabe-Werkzeuge im Karussell-Banner werden nicht unterstützt, wenn Sie den Viewer in ein Erlebnisfragment einbetten.
        Um diesen Punkt zu umgehen, können Sie Viewer-Vorgaben verwenden oder erstellen, für die keine Social Media-Sharing-Werkzeuge zur Verfügung stehen. Mit diesen Viewer-Vorgaben können Sie sie erfolgreich in Experience Fragments einbetten.

    experience_fragment-carouselbanner

    Sie können auch das Erscheinungsbild des Karussell-Banners Vorschau haben. Siehe (Optional) Anzeigen einer Vorschau für Karussellbanner.

  8. Tippen Sie auf Speichern.

  9. Veröffentlichen Sie das Karussellset. Durch das Veröffentlichen wird der Einbettungs-Code oder die URL erstellt, den/die Sie auf der Web-Seite verwenden können. Wenn Sie Experience Manager-Sites sind, fügen Sie das Karussellset direkt zu Ihrer Webseite hinzu.

    Siehe Veröffentlichen von Assets.

    Siehe Hinzufügen eines Karussellsets zur Landingpage Ihrer Website.

HINWEIS

Benutzer, die keine Administratoren sind, müssen der Gruppe dam-users hinzugefügt werden, damit sie Karussellbanner erstellen oder bearbeiten können. Wenn Sie Probleme beim Erstellen oder Bearbeiten haben, wenden Sie sich an Ihren Systemadministrator, der Sie der Gruppe dam-users hinzufügen kann.

Sie können verschiedene Aufgaben zum Bearbeiten von Karussellsätzen durchführen, z. B.:

  • einem Karussellset Folien hinzufügen. Siehe auch Arbeiten mit Selektoren.
  • Ordnen Sie die Folien im Karussellsatz neu an.
  • Assets im Karussellset löschen
  • Viewer-Vorgaben anwenden.
  • das Karussellset löschen.
  • Hotspots und Imagemaps hinzufügen oder bearbeiten. Siehe auch Arbeiten mit Selektoren.

So bearbeiten Sie ein Karussellset:

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

    • Bewegen Sie den Mauszeiger über ein Karussell-Set-Asset und tippen Sie dann auf Bearbeiten (Stiftsymbol).

    • Bewegen Sie den Mauszeiger über ein Karussell-Set-Asset, tippen Sie auf Wählen Sie (Häkchensymbol) und dann auf Bearbeiten in der Symbolleiste.

    • Tippen Sie auf ein Karussell-Asset und dann links oben auf der Seite auf Bearbeiten (Bleistiftsymbol).

  2. Um das Karussellset zu bearbeiten, führen Sie einen der folgenden Schritte aus:

    • Um eine Folie hinzuzufügen, tippen Sie auf das Symbol Hinzufügen Folie. Navigieren Sie zu dem Asset, das Sie der Folie hinzufügen möchten, und tippen oder klicken Sie auf das Häkchen.
    • Um die Folios neu anzuordnen, ziehen Sie eine Folie an eine neue Position (klicken Sie auf das Symbol "Neu anordnen", um Elemente zu verschieben).
    • Um einen Hotspot oder eine Imagemap hinzuzufügen, klicken Sie auf die Hotspot- oder Imagemap-Symbole und lesen Sie Hinzufügen von Hotspots und Imagemaps.
    • Um das Erscheinungsbild und das Verhalten des Karussellsets zu bearbeiten, tippen Sie auf die Registerkarte Erscheinungsbild oder Verhalten und legen Sie dann die gewünschten Optionen fest.
    • Um Hotspots oder Imagemaps zu bearbeiten, wählen Sie auf der entsprechenden Folie einen Hotspot oder eine Imagemap aus. Nehmen Sie unter der Registerkarte Aktionen Ihre Änderungen vor.
    • Um eine Folie zu löschen, wählen Sie sie aus und tippen Sie dann in der Symbolleiste auf Folie löschen.
    • Um eine Vorgabe anzuwenden, tippen Sie oben rechts auf der Seite auf die Dropdown-Liste Vorgaben und wählen Sie eine Viewer-Vorgabe aus.
    • Um ein ganzes Karussellset zu löschen, navigieren Sie zum Karussellset, wählen Sie es aus und tippen Sie auf Löschen.
    HINWEIS

    Wenn Sie interaktive Bilder mit Hotspots bearbeiten, um das Bild zu beschneiden, werden die Hotspots entfernt.

Sie können Vorschau verwenden, um zu sehen, wie das Karussellbanner den Kunden angezeigt wird. Mithilfe der Vorschau können Sie außerdem die Hotspots und Imagemaps des Karussell-Banners testen, um sicherzustellen, dass sie sich wie erwartet verhalten.

Wenn das Karussellbanner Ihren Vorstellungen entspricht, können Sie es veröffentlichen.
Siehe Einbetten des Video- oder Bild-Viewers auf einer Web-Seite.
Siehe Verknüpfen von URLs mit einer Web-Anwendung. Die URL-basierte Verknüpfungsmethode ist nicht möglich, wenn Ihr interaktiver Inhalt über Links mit relativen URLs verfügt, insbesondere über Links zu Seiten in AEM Sites.
Siehe Hinzufügen von Dynamic Media-Assets zu Seiten.

Um eine Vorschau für ein Karussellbanner anzuzeigen, verwenden Sie entweder den Karusselleditor (bevorzugte Methode) oder die Viewer-Liste.

So erstellen Sie eine Vorschau von Karussellbannern:

  1. In Assets navigieren Sie zu einem vorhandenen Karussellbanner, das Sie erstellt haben, und tippen Sie darauf, um das Banner zu öffnen.

  2. Tippen Sie auf Bearbeiten.

  3. Wählen Sie in der Liste "Viewer-Vorgaben"rechts in der Symbolleiste einen Viewer aus, um das Karussell-Banner Vorschau.

    experience_fragment-carouselbanner-viewerdropdown

  4. Tippen Sie auf Vorschau.

  5. Um die zugehörigen Aktionen zu testen, tippen Sie auf die Hotspots oder Imagemaps im Bild.

So zeigen Sie eine Vorschau für Karussellbanner über die Viewer-Liste an:

  1. In Assets navigieren Sie zu einem vorhandenen Karussellbanner, das Sie erstellt haben, und tippen Sie darauf, um das Banner zu öffnen.
  2. Klicken Sie in der linken oberen Ecke der Seite „Vorschau“ auf das Symbol „Inhalt“.
  3. Tippen Sie in der Liste Viewer im Bedienfeld auf der linken Seite auf den Namen der Karussell-Banner-Viewer-Vorgabe, die Sie verwenden möchten.
  4. Um die zugehörigen Aktionen zu testen, tippen Sie auf die Hotspots oder Imagemaps im Bild.

Um das Karussell verwenden zu können, müssen Sie es veröffentlichen. Durch Veröffentlichen eines Karussellsets werden die URL und der Einbettungs-Code aktiviert. Außerdem wird das Karussell in der Dynamic Media-Cloud veröffentlicht, die für skalierbare und leistungsfähige Bereitstellung in ein CDN integriert ist.

HINWEIS

Wenn Sie ein vorhandenes interaktives Bild mit Hotspots für Ihr Karussellbanner verwenden, müssen Sie das interaktive Bild separat veröffentlichen, nachdem Sie das Karussellbanner veröffentlicht haben.
Wenn Sie ein bereits vorhandenes, veröffentlichtes interaktives Bild ändern, das Sie in einem Karussell-Banner verwenden, veröffentlichen Sie das interaktive Bild, damit diese Änderungen im Karussell-Banner dargestellt werden.

Unter Veröffentlichen von Dynamic Media-Assets finden sie Informationen zum Veröffentlichen von Karussellbannern.

Nachdem Sie Bannerbilder hochgeladen haben, um ein Karussell zu erstellen, Hotspots oder Imagemaps oder beides zum Banner hinzugefügt haben. Karussellsatz veröffentlicht. Sie können sie jetzt Ihrer vorhandenen Website-Seite hinzufügen.

HINWEIS

Wenn Sie AEM Sites-Kunde sind, können Sie das Karussellbanner direkt Ihrer Seite hinzufügen, indem Sie die interaktive Medienkomponente auf die Seite ziehen. Siehe Hinzufügen von Dynamic Media-Assets zu Seiten.

Als eigenständiger Experience Manager-Asset-Kunde können Sie das Karussellbanner jedoch manuell zu Ihrer Website-Landingpage hinzufügen.

  1. Kopieren Sie den Einbettungs-Code des veröffentlichten Karussellsets.
    Siehe Einbetten des Video- oder Bild-Viewers auf einer Web-Seite.

  2. hinzufügen Sie den Einbettungscode, den Sie von Experience Manager Assets auf Ihre Webseite kopiert haben.
    Der kopierte Einbettungscode reagiert schnell und passt automatisch in den Einbettungsbereich der Seite.

Hinweis: Dieser Schritt gilt nur, wenn Sie ein eigenständiger AEM Assets-Kunde sind.

Der letzte Schritt in diesem Prozess ist die Integration des Karussell-Banners in eine vorhandene Quick Ansicht-Implementierung auf Ihrer Website. Jede Implementierung der Schnellfunktion ist einzigartig und es ist ein spezifischer Ansatz erforderlich, der in der Regel die Unterstützung eines IT-Mitarbeiters im Front-End umfasst.

Die vorhandene Quick-Ansicht-Implementierung stellt normalerweise eine Kette miteinander verknüpfter Aktionen dar, die auf der Webseite in der folgenden Reihenfolge ausgeführt werden:

  1. Ein Benutzer löst ein Element auf der Benutzeroberfläche Ihrer Website aus.
  2. Der Front-End-Code ruft eine URL für die schnelle Ansicht basierend auf dem Element der Benutzeroberfläche ab, das in Schritt 1 ausgelöst wurde.
  3. Der Frontend-Code sendet mithilfe der in Schritt 2 abgerufenen URL eine Ajax-Anfrage.
  4. Die Backend-Logik gibt die entsprechenden Quick-Ansicht-Daten oder -Inhalte zurück zum Front-End-Code.
  5. Der Front-End-Code lädt die Daten oder den Inhalt der Quick-Ansicht.
  6. Optional konvertiert der Front-End-Code die geladenen Quick-Ansicht-Daten in eine HTML-Darstellung.
  7. Der Frontend-Code zeigt ein modales Dialogfeld an und rendert den HTML-Inhalt auf dem Bildschirm für den Endbenutzer.

Diese Aufrufe stellen keine unabhängigen öffentlichen API-Aufrufe dar, die von der Webseitenlogik aus einem beliebigen Schritt aufgerufen werden können. Vielmehr handelt es sich um einen verketteten Aufruf, in dem der jeweils nächste Schritte in der letzten Phase (Callback) des vorherigen Schritts ausgeblendet ist.

Während das Karussell-Banner Schritt 1 und Schritt 2 ersetzt, wird eine solche Interaktion vom Viewer verarbeitet, wenn ein Benutzer auf einen Hotspot oder eine Imagemap klickt. Der Viewer gibt ein Ereignis an die Web-Seite zurück, das die gesamten Hotspot- oder Imagemap-Daten enthält, die zuvor hinzugefügt wurden.

In einem solchen Ereignis-Handler nimmt der Frontend-Code Folgendes vor:

  • Er lauscht am Ereignis, das durch das Karussellbanner ausgegeben wird.
  • Erstellt eine URL für die schnelle Ansicht basierend auf den Hotspot- oder Imagemap-Daten.
  • Trigger des Ladevorgangs der Quick-Ansicht vom Back-End und der Wiedergabe auf dem Bildschirm zur Anzeige.

Der von AEM Assets zurückgegebene Einbettungs-Code verfügt über einen einsatzbereiten Ereignis-Handler, der auskommentiert ist.

Daher ist es nur erforderlich, die Auskommentierung des Codes aufzuheben und den Platzhalter-Handlertext durch den Code zu ersetzen, der für die bestimmte Web-Seite spezifisch ist.

Die Erstellung der URL für die schnelle Ansicht erfolgt anders als bei der Identifizierung von Hotspot- und Imagemap-Variablen, die zuvor behandelt wurden.

Siehe Ermitteln von Hotspot- und Imagemap-Variablen.

Der letzte Schritt zum Trigger der URL für die schnelle Ansicht und zur Aktivierung des Bedienfelds für die schnelle Ansicht erfordert höchstwahrscheinlich die Unterstützung eines IT-Mitarbeiters von Ihrer IT-Abteilung. Sie verfügen über die nötigen Kenntnisse, um die Implementierung der Quick-Ansicht mit einer benutzerfreundlichen URL für die schnelle Ansicht vom richtigen Schritt aus genau Trigger.

Verwenden von Quick-Ansichten zum Erstellen eines benutzerdefinierten Popup-Windows®

Siehe Verwenden von Quick-Ansichten zum Erstellen eines benutzerdefinierten Popup-Fensters unter Windows®.

Auf dieser Seite