Direkt zum Inhalt

Slides

Home → Website erstellen → Inhaltstypen → Slideshow

Slideshow

Fügen Sie eine Diashow hinzu, bei der jede Folie ein Bild oder Video in voller Breite enthält. Optional können die Folien Beschreibungsfelder und Nachrichten enthalten, die Sie Ihren Besuchern und Kunden mitteilen möchten. Mit Folien können Sie Besucher auf der Landing Page begrüßen oder einen Link zu Kollektionen bereitstellen. Oder nutzen Sie sie als ansprechendes Designelement, um eine längere Seite besser zu strukturieren.

Um mögliche Anwendungen dieses Absatztyps kennenzulernen, besuchen Sie unsere picturemaxx Drupal-Demoseite.

  1. Slideshow erstellen
  2. Slideshow Anzeige Optionen

1. Slideshow erstellen

    1. Navigieren Sie im Administrativen Hauptmenü zu Inhalt.
    2. Wählen Sie in der Übersicht unter Inhalt eine Seite aus, der Sie eine Slideshow hinzufügen möchten, und klicken Sie auf Bearbeiten.
    3. Scrollen Sie zum unteren Ende und wählen Sie im Dropdown-Menü Abschnitt hinzufügen die Option Slideshow hinzufügen.
    4. Geben Sie im Bereich Überschrift einen Namen oder einen Beschreibungstext ein (optional). Im Menü des Editors können Sie dem Text ein Format und/oder einen Stil zuweisen.
    5. Konfigurieren Sie die Display-Options: Unter Einstellungen erklärt wird erläutert, wie Sie die Anzeige Ihrer Slideshow anpassen können.
    6. Wählen Sie eine Hintergrundfarbe, ein Bild oder ein Video für den Abschnitt. Wie Sie neue Hintergrundfarben hinzufügen können, erfahren Sie unter Look & Feel anpassen (2. Hintergrundfarben für Abschnittstypen).
  • Bildschirmfoto der Einstellungen eines Slides.

     

  • Übrerschrift
    Fügen Sie eine Überschrift und einen Text zu Ihrer Slideshow hinzu (optional).

    URL
    Beginnen Sie mit der Eingabe des Titels eines Inhaltselements, um es auszuwählen. Sie können auch einen internen Pfad oder eine externe URL eingeben.

    Link:

    • URL
      Hier können Sie eine externe URL einfügen, einen internen Pfad eingeben oder einfach mit der Eingabe des Inhaltstitels beginnen, woraufhin die Autovervollständigung passende Elemente vorschlägt.
    • Link-Text
      Geben Sie eine beschreibende und spezifische Bezeichnung für die Link-Schaltfläche auf der Folie ein.
    • Wählen Sie einen Stil
      • Primäre Schaltfläche: Wenn Sie das Feld Link-Text leer lassen, verlinkt das System die Folie dennoch, blendet jedoch die Link-Schaltfläche aus.
      • Info-Symbol: in der unteren linken Ecke: Das System zeigt das Symbol auch dann an, wenn Sie das Feld Link-Text leer lassen.
      • Externer Link: Wenn Sie das Feld Link-Text leer lassen, zeigt das System den externen Link als reine URL an.
    • Link in neuem Fenster öffnen
      Aktivieren Sie diese Option, um festzulegen, dass der Link in einem neuen Fenster geöffnet werden soll.


    Display-Options

    Die Einrichtung der Anzeige ist für diesen Abschnittstyp besonders wichtig. Laden Sie Hintergrundbilder oder -Videos für die Desktop-Version und Bilder für die mobile Version hoch. Um sicherzustellen, dass der Text lesbar ist, platzieren Sie ihn über einem freien Bereich des Bildes oder wählen Sie eine individuelle Hintergrundfarbe. Konfigurieren Sie die Abmessungen des Bildes/Videos, und schon können Sie loslegen.

    Wichtig: Achten Sie darauf, dass alle hochgeladenen Bilder und Videos innerhalb einer Slideshow die gleiche Größe haben, um einen sauberen Wechsel von Slide zu Slide zu gewährleisten.

    Hintergrundmedium Abschnitt
    Upload an image or video file for the slide.

    Hintergrundbild Abschnitt Mobil 
    Sie können ein anderes Bild für mobile Geräte hochladen.

    Hintergrundfarbe Abschnitt
    Die Hintergrundfarbe Ihrer Slides wirkt sich auf die Farbe des Textes im Textfeld aus. Die Schriftfarbe erscheint automatisch weiß, wenn Sie einen dunklen Hintergrund für den Abschnitt wählen. Die Bildanzeige wird dadurch nicht beeinträchtigt und wirkt sich umgekehrt auch nicht auf den Text aus. 

    Position Textbox
    Wählen Sie, wo das Textfeld platziert werden soll. Die Standardoption Nicht festgelegt/ausgewählt positioniert das Textfeld in der oberen linken Ecke.

    Hintergrundfarbe Textbox
    Wählen Sie eine Hintergrundfarbe für die Textbox, unabhängig von der Hintergrundfarbe der Slideshow.

    Mindesthöhe des Abschnitts
    Define the slide height in your browser. With a fixed height value, the width of the image will change to match the size of the browser window. You can either set the slide height here or upload images that already have proper dimensions for your slide. In this case, enable Use Image Dimensions

    Definieren Sie die Höhe der Slideshow in Ihrem Browser. Bei einem festen Höhenwert passt sich die Breite des Bildes der Größe des Browserfensters an. Sie können entweder die Höhe hier festlegen oder Bilder hochladen, die bereits die richtigen Abmessungen für Ihre Slideshow haben. In diesem Fall aktivieren Sie Bildabmessungen verwenden.

    Nutze Parallax-Effekt
    Weitere Informationen zu dieser Funktion finden Sie auf der Seite Parallax-Effekt.

    Bildabmessungen verwenden
    Aktivieren Sie die Option, die Größe eines Bildes für die Slideshow vor dem Hochladen festzulegen und sicherzustellen, dass es in verschiedenen Anzeigegrößen in der selben Höhe erscheint. Die Anzeige ist responsiv.

    Wichtig: Die optimale Bildgröße für Slides ist 1920 x 1080 px. Sie können die Höhe der Bilddatei ändern, sollten aber die Breite beibehalten. Laden Sie zum Beispiel 1920 x 700 px große Dateien für die Folien auf Ihrer Seite hoch.

    Add Section
    Add more slides.

Video: Hinzufügen einer Slideshow zu einer bestehenden Seite. In diesem Beispiel wählen wir eine dunkle Hintergrundfarbe für die Slideshow. Der Text erscheint deshalb Weiß. Weitere Informationen zu Hintergrundfarben finden Sie unter Look & Feel ändern.

2. Slideshow Anzeige Optionen

Optimieren Sie Ihre Slideshow mit Effekten und Steuerelementen unter Anzeigeoptionen.

  • Fade-Effekt verwenden
    Wenden Sie diesen Übergangseffekt an, um einen weichen Übergang zu nutzen.

    Play/Pause Button anzeigen
    Lassen Sie Benutzer das Abspielen der Slideshow steuern. Das verbessert die Barrierefreiheit für Benutzer mit Sehbehinderungen und Personen, die durch die automatisches Abspielen leicht abgelenkt werden.
    HINWEIS: Wenn Benutzer mit der Einstellung Reduzierte Bewegung Ihre Seite besuchen, werden Slides nie automatisch abgespielt. 

    Slide Indikatoren anzeigen
    Zeigt eine Reihe von Punkten an, die die Anzahl der Slides und die aktuelle Position in der Slideshow anzeigen.

    Zufallswiedergabe 
    Spielt eine festgelegte Anzahl an Slides in zufälliger Reihenfolge ab. Falls Sie in einer Slideshow sehr viele Slides darstellen möchten, hilft diese Option dabei die Seitenleistung (Geschwindigkeit und Reaktionsfähigkeit) zu gewährleisten.

    Mischintervall
    Legen Sie ein Zeitintervall für die Cache-Bereinigung fest. Nach Ablauf dieser Zeit werden die Folien neu geordnet.
    HINWEIS: Verwenden Sie diese Einstellung mit Bedacht, da sie sich auf die gesamte Seite auswirkt. Je kleiner das Intervall, desto häufiger muss die Seite neu gerendert werden.

    Maximale Anzahl von Slides im Zufallswiedergabe-Modus
    Begrenzen Sie die Anzahl der in einer Sequenz angezeigten Folien. 

Vor der Veröffentlichung der Webseite:

  • Klicken Sie auf Vorschau, um sicherzustellen, dass alles wie gewünscht aussieht. Jede Änderung kann vor der Veröffentlichung als Vorschau angesehen werden.
  • Gehen Sie zurück zur Bearbeitung des Inhalts.
  • Wenn der neue Inhalt auf Ihrer Webseite sichtbar sein soll, setzen Sie ein Häkchen bei Inhalt ist live (veröffentlicht).
  • Klicken Sie auf Speichern. Der Inhalt wird gespeichert und ist auf der Inhaltsseite zu finden.