Komponente "Swipe-Galerie"

Diese Komponente wird nicht für AMPHTML-Anzeigen, Videoanzeigen und Bildanzeigen unterstützt.

Mit der Komponente "Swipe-Galerie" lässt sich eine einfache Galerie erstellen, in der Nutzer vor- und zurückwischen können, um sich entweder verschiedene Bilder- oder Gruppensets anzusehen. Swipe-Galerien können in dynamischen Anzeigen verwendet werden.

Die richtige Galerie auswählen

Google Web Designer hat vier Galeriekomponenten:

  • In der 360°-Galerie werden Bilder der verschiedenen Seiten eines Objekts gezeigt. Sie können mit dem Finger vor- und zurückwischen, um das Objekt zu drehen. In der 360°-Galerie werden keine Gruppen oder Navigationselemente dargestellt.
  • Die Swipe-Galerie bietet eine einfache, zweidimensionale Darstellung. Sie können vertikal oder horizontal durch Bilder oder Gruppen wischen.
  • Die Karussell-Galerie ist mit der Swipe-Galerie vergleichbar, allerdings wird der Bildwechsel mit einem dreidimensionalen Effekt durchgeführt, als ob die Bilder sich auf einem rotierenden Display befänden.
  • Die Übergangsgalerie bietet verschiedene Animationseffekte für den Wechsel von einem Bild zum nächsten.

So verwenden Sie die Swipe-Galerie:

  1. Öffnen Sie das Steuerfeld Komponenten und dann den Ordner Galerien.

  2. Ziehen Sie die Komponente Swipe-Galerie  in den Anzeigebereich.

  3. Geben Sie der Komponente im Bereich Eigenschaften unter "Eigenschaften der Swipe-Galerie" einen Namen.

  4. Fügen Sie Bilder- oder Gruppensets hinzu. Mithilfe von Gruppen können Sie andere Elemente als Bilder verwenden oder mehrere Elemente in einem einzelnen Frame anzeigen.

    • Mit einer der folgenden Methoden können Sie Bilder hinzufügen:
      • Gehen Sie im Steuerfeld Eigenschaften zum Eigenschaftenbereich „Swipe-Galerie“ und fügen Sie im Feld Bilder durch Kommas getrennte URLs für Ihre Bilder hinzu.

      • Gehen Sie im Steuerfeld Eigenschaften zum Eigenschaftenbereich „Swipe-Galerie“ und klicken Sie auf Galeriebilder auswählen . Klicken Sie auf Bilder auswählen, um nach Bilddateien zu suchen, oder ziehen Sie Dateien direkt in das Dialogfeld.

    • So können Sie der Galerie Gruppen hinzufügen:

      • Gehen Sie im Steuerfeld Eigenschaften zum Eigenschaftenbereich „Swipe-Galerie“ und fügen Sie im Feld Gruppen eine Liste von Gruppennamen hinzu, die durch Kommas voneinander getrennt sind.
  5. Sie können die Komponenteneigenschaften zudem wie unten beschrieben nach Belieben anpassen.

Gruppen in der Swipe-Galerie verwenden

Die Swipe-Galerie kann entweder eine Auswahl von Bildern oder Gruppen enthalten. Mithilfe von Gruppen können Sie andere Assets als Bilder verwenden (z. B. Videos) oder mehrere Assets in einem einzelnen Frame der Galerie anzeigen lassen (z. B. Bilder mit Untertiteln).

Wenn Sie Videos oder andere interaktive Assets verwenden, müssen Sie im Bereich "Eigenschaften" die Option Wischen deaktivieren auswählen. So können Nutzer die Videosteuerelemente verwenden. Mit der Komponente "Galerienavigation" können Sie einrichten, dass Nutzer zwischen Galerieframes wechseln können.

Wenn Ihre Galerie sowohl Bilder als auch Gruppen enthalten soll, müssen Sie die gewünschten Bilder zuerst in Gruppen umwandeln.

Mithilfe von Gruppen können Sie auch mehrere dynamische Elemente in der Galerie anzeigen.

So ordnen Sie Bilder in der Galerie neu an oder entfernen sie:

  1. Gehen Sie im Steuerfeld Eigenschaften zum Eigenschaftenbereich „Swipe-Galerie“ und klicken Sie auf Galeriebilder auswählen .
  2. Ziehen Sie ein Bild an eine andere Position, um es neu anzuordnen, oder bewegen Sie den Mauszeiger auf ein Bild und klicken Sie auf Löschen , um es aus der Galerie zu entfernen.
  3. Klicken Sie auf OK.

Eigenschaften

Eigenschaft Beschreibung
Name Der Name der Swipe-Galerie
Bilder Hier können Sie die Bilder für die Galerie auswählen. Kann an dynamische Daten gebunden werden.
Gruppen Eine Liste von durch Kommas voneinander getrennten Gruppen, die in der Galerie verwendet werden. Kann an dynamische Daten gebunden werden.
Übergang Die Übergangszeit (in Millisekunden) zwischen den Bildern
Start-Frame Die Nummer des Bildes, das als Erstes zu sehen sein soll
Frames anzeigen Die Anzahl der Frames, die auf einmal in der Galerie angezeigt werden
Frames Die Anzahl der Frames, die bei jeder Wischbewegung erscheinen
Autom. Wiedergabe Wenn diese Option aktiviert ist, werden die Bilder in der Galerie automatisch wiedergegeben.
Navigation verwenden Wenn diese Option aktiviert ist, werden Symbole für die Navigation durch die Galerie angezeigt.
Miniaturansichten verwenden Wenn diese Option mit "Navigation verwenden" genutzt wird, werden Miniaturansichten statt Symbole zur Navigation angezeigt.
Markierungsfarbe Hier legen Sie die Markierungsfarbe für das Navigationsbild fest.
Skalierung Hier legen Sie fest, wie Bilder verschiedener Größe in Frames mit einer festen Größe angezeigt werden:
  • Größe an Frame anpassen: Die Größe des Bildes wird so angepasst, dass es den Frame ohne Zuschneiden ausfüllt. Entspricht das Seitenverhältnis des Bildes nicht dem des Frames, wird ein entsprechender Abstand hinzugefügt.
  • Auf Frame zuschneiden: Die Größe des Bildes wird so angepasst, dass es den Frame vollständig ausfüllt. Wenn die Seitenverhältnisse von Bild und Frame unterschiedlich sind, wird das Bild zugeschnitten.
  • Ohne: Das Bild wird im Frame zentriert und in der Originalgröße dargestellt. Ist das Bild kleiner als der Frame, wird ein zusätzlicher transparenter Abstand hinzugefügt. Ist das Bild größer, so wird es abgeschnitten.
  • Bild strecken, um Frame zu füllen: Die Größe des Bildes wird so angepasst, dass es dem Seitenverhältnis des Frames entspricht. Das Bild wird nicht abgeschnitten.
Richtung Legt fest, ob sich die Bilder der Galerie horizontal oder vertikal bewegen.

Erweiterte Eigenschaften

Maximieren Sie im Bereich "Komponenteneigenschaften" das Symbol  für Erweiterte Eigenschaften, um die erweiterten Eigenschaften einzublenden.

Erweiterte Eigenschaft Beschreibung
Frame-Offset Der Abstand zwischen den Bildern
Frame-Breite Die Breite (in Pixeln) des Bild-Frames in der Galerie
Frame-Höhe Die Höhe (in Pixeln) des Bild-Frames in der Galerie
Dauer der automatischen Wiedergabe Die Dauer (in Millisekunden) der Wiedergabe der Galerie vom ersten bis zum letzten Frame. Diese Zeit wird gleichmäßig zwischen den einzelnen Bildern aufgeteilt, außer es wurde ein separates Intervall für automatische Wiedergabe ausgewählt.
Intervall für automatische Wiedergabe Die Dauer (in Millisekunden) der Anzeige für jedes Bild, wenn die automatische Wiedergabe aktiviert ist. Die Bilder werden mit dieser Dauer wiedergegeben, bis die Gesamtdauer der automatischen Wiedergabe erreicht ist, wobei die Bilder gegebenenfalls mehrmals durchlaufen werden.
Exit-URLs Eine Liste von durch Kommas getrennten URLs, die den einzelnen Frames in der Galerie entsprechen. Kann an dynamische Daten gebunden werden.
Wischen deaktivieren Wenn Sie das Häkchen aus diesem Kästchen entfernen, deaktivieren Sie die Navigation durch Wischen für die Galerie. Der Nutzer kann dann mit Elementen im Frame arbeiten, ohne den Frame versehentlich zu verändern. Ist das Kästchen angeklickt, können Sie entweder die Eigenschaft "Navigation verwenden" oder die Komponente Galerienavigation für den Umgang der Nutzer mit dem Frame verwenden.
Medien beim Verlassen des Frames pausieren Wenn diese Option aktiviert ist, wird bei einem Framewechsel die Audio- oder Videowiedergabe im aktuellen Frame pausiert. So wird verhindert, dass unerwünschter Inhalt im Hintergrund wiedergegeben wird.
Medien beim Start des Frames fortsetzen Wenn diese Option aktiviert ist, wird jede pausierte Audio- oder Videowiedergabe im nächsten Frame fortgesetzt, sobald dieser aktiv wird.

Ereignisse und Aktionen

Ereignisse, die mit der Komponente "Swipe-Galerie" gesendet werden

Sie können basierend auf den folgenden Ereignissen der Komponente "Swipe-Galerie" andere Aktionen auslösen:

Ereignis Beschreibung
Erste Interaktion Wird ausgelöst, wenn der Nutzer zum ersten Mal mit der Galerie interagiert
Alle Frames angezeigt Wird ausgelöst, wenn alle Frames der Galerie mindestens einmal angezeigt wurden
Bilder geladen Wird ausgelöst, wenn alle Frames der Galerie geladen wurden
Die automatische Wiedergabe wurde beendet. Wird ausgelöst, wenn die automatische Wiedergabe aus irgendeinem Grund beendet wurde
Angezeigter Frame Wird ausgelöst, wenn jeder neue Frame vollständig angezeigt wird
Frame aktiviert Wird ausgelöst, wenn ein Frame-Wechsel gestartet wird
Automatische Framewiedergabe Wird ausgelöst, wenn ein Frame bei der automatischen Wiedergabe angezeigt wird
Frame-Berührung Wird ausgelöst, wenn auf einen Frame geklickt wird
Linkes Ende Wird ausgelöst, wenn die Galerie ihr linkes Ende erreicht
Rechtes Ende Wird ausgelöst, wenn die Galerie ihr rechtes Ende erreicht
Maus über einen Frame bewegt Wird ausgelöst, wenn der Mauszeiger über den Frame bewegt wird
Maus außerhalb eines Frames bewegt Wird ausgelöst, wenn der Mauszeiger aus dem Frame bewegt wird
Track-Start Wird ausgelöst, wenn das Ziehen der Maus oder die Ziehbewegung beginnt
Track Die Komponente registriert die X- und Y-Positionsdaten der Maus oder Ziehbewegung
Track-Ende Wird ausgelöst, wenn das Ziehen der Maus oder die Ziehbewegung endet

Wenn Sie eines dieser Ereignisse im Dialogfeld Ereignis auswählen möchten, legen Sie die Komponente „Swipe-Galerie“ als Ziel fest.

Aktionen, die von der Komponente "Swipe-Galerie" ausgeführt werden

Folgende Aktionen der Komponente "Swipe-Galerie" können als Reaktion auf andere Ereignisse ausgelöst werden:

Aktion Konfigurationsoptionen
Zu Frame springen
  • Frame-Nummer
  • Animation: "none" oder "slide"
Einmal drehen
  • Rotationszeit: Zeit in Millisekunden
  • Richtung: "forwards" oder "backwards"
Rotation anhalten Keine
Vor Keine
Zurück Keine

Wenn Sie eine dieser Aktionen im Dialogfeld Ereignis auswählen, legen Sie die Komponente „Swipe-Galerie“ als Empfänger fest.

Informationen zum Konfigurieren von Ereignissen

Vorschau

Im Anzeigebereich wird nur der Start-Frame der Swipe-Galerie angezeigt, damit Sie einen Eindruck davon erhalten, wie die Komponente aussehen wird. Wenn Sie die vollständig gerenderte Komponente in Aktion sehen möchten, erstellen Sie eine Vorschau des Dokuments in Ihrem bevorzugten Browser. Klicken Sie dazu rechts oben auf die Schaltfläche Vorschau.

War das hilfreich?

Wie können wir die Seite verbessern?
Suche
Suche löschen
Suche schließen
Hauptmenü
13759136257619063569
true
Suchen in der Hilfe
true
true
true
true
true
5050422
false
false