Direkt zum Inhalt

Slides

Home → Website erstellen → Inhaltstypen → Slideshow

Slideshow

Eine Slideshow eignet sich perfekt als Teaser für die Gestaltung Ihrer Landing Page. Sie können eine Slideshow hinzufügen, bei der jeder Slide ein Bild in voller Breite zeigt. Optional können die Slides Textfelder mit Beschreibungen und zentralen Botschaften enthalten, die Sie Ihren Nutzern und Kunden mitteilen möchten. Sie können zudem auf andere Seiten oder Sammlungen verlinken.

Fügen Sie eine Diashow hinzu, bei der jedes Dia ein Bild oder Video in voller Breite zeigt. Optional können die Folien Felder für Beschreibungen enthalten. Mit Slides können Sie Besucher auf der Landing Page begrüßen oder einen Link zu Sammlungen oder anderen Inhalten integrieren. Oder Sie verwenden sie als ansprechendes Designelement, um eine Seite schöner zu gestalten.

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

    • Navigieren Sie im Administrativen Hauptmenü zu Inhalt.
    • Wählen Sie in der Übersicht unter Inhalt eine Seite aus, der Sie eine Slideshow hinzufügen möchten, und klicken Sie auf Bearbeiten.
    • Scrollen Sie zum unteren Ende und wählen Sie im Dropdown-Menü Abschnitt hinzufügen die Option Slideshow hinzufügen.
    • 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.
    • Konfigurieren Sie die Display-Options: Unter Einstellungen erklärt wird erläutert, wie Sie die Anzeige Ihrer Slideshow anpassen können.
    • 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-Text
    Geben Sie einen Titel für die Schaltfläche auf dem Slide ein (erscheint unterhalb der Beschreibung).


    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. Configure slideshow display

 

Fine-tune your slideshow with effects and controls available in Display Options (Slideshow).

  • Use fade effect

    Apply this transition effect to make a slide fade out.

    Show Play/Pause button

    Let users control auto-rotation of the slides. A paused carousel improves accessibility for users with visual impairments and people who are distracted or confused by auto-rotation.
    NOTE: If the user has chosen reduced motion in system settings, auto-rotation is always paused.

    Show slide indicators

    Display a set of dots that indicate the number of slides and the current position of the slide in the carousel.

    Shuffle mode

    Play a specified number of slides in a random order. This option helps to ensure page performance if you choose to display a large number of slides. 

    Shuffle interval

    Set a time interval for cache cleanup to reshuffle the slides.

    NOTE: Use this setting carefully, as it affects the entire page. The smaller the interval, the more frequently the page is rerendered.

    Maximum number of slides in shuffle mode

    Limit the number of slides displayed in a sequence. 

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.