toujou
+49 911 23980-870

Logo-Slider Element

Ein Slider mit mehreren Logos, zentriert auf der Seite.

Item-ID: 05-004

Beispielansicht   Anleitung   Verhalten


Beispielansicht


Anleitung

Bilder anlegen

  • Klicken Sie auf den Button + Inhalt und wählen unter dem Reiter Media das Element Logo-Slider Element aus.
  • Klicken Sie nun im Reiter Content  Bild hinzufügen/Add media file.
  • Wählen Sie mehrere Bilddateien aus Ihrer Fileliste aus oder laden Sie die gewünschten Dateien in den entsprechenden Ordner hoch. Damit das Sliden möglich ist, müssen mehr Bilder im Backend hinterlegt sein als im Frontend angezeigt werden. 

Bilder bearbeiten

  • Unter jedem nun hochgeladenen Bild öffnet sich ein Menü zur Bearbeitung der Bild-Metadaten.
  • Fügen Sie je Bild/Logo ggf. im Bereich Link eine Verknüpfung zu Website-URLs hinzu.
  • Überprüfen Sie den in der Vorschau für vier Displaygrößen angezeigten Bildausschnitt.

Bilder formatieren

  • Unter dem Button Editor öffnen können Sie das Seitenverhältnis für Mobile, Tablet-, Desktop- und Widescreen-Ansicht anpassen. 
  • Setzen Sie ggf. den Bildfokus für das Responsive-Verhalten jeweils auf die gewünschte Bildfläche. 

Automatische Wiedergabe von Medien

Wenn Sie mehr als ein Medium innerhalb desselben Elements einsetzen, haben Sie die Möglichkeit, die Wiedergabe zu automatisieren. Um ein einheitliches Bild zu gewährleisten, werden alle eingesetzten Medien auf dasselbe Format (16:9) zugeschnitten.

Settings-Optionen für Medienelemente mit zwei und mehr Medien

  • Slide automatically: Aktivieren Sie den Regler mittels Klick, um die automatische Wiedergabe einzurichten.
  • Interval of auto slidings (in seconds): Standardmäßig wird nach 6 Sekunden das nachfolgende Medium eingeblendet. Wenn Sie diese Frequenz ändern möchten, betätigen Sie den Regler entsprechend auf einer Skala von 1 bis 15 Sekunden (nur wenn Slide automatically aktiviert ist).

Element Design für das Element

In diesem Element können Sie das Erscheinungsbild ganz leicht mit dem Element Design via einem Klick individualisieren. Mit der Auswahl von Standard, Primary, Secondary sowie Schriftfarbe wechseln Sie die Farbe der Pfeile am rechten und linken Rand des Slides sowie der Bullets in der Progress Bar entsprechend der in den Theme-Settings definierten Farbe.

  

  • Mit Klick auf das Dropdown-Menü unter Farbe im Reiter Allgemein erhalten Sie die Auswahl für eine individuelle Designfarbe.
  • Wählen Sie aus Standard, Primary, Secondary sowie Schriftfarbe die gewünschte Option aus.
  • Speichern Sie die Änderungen im Element, damit sie sichtbar werden.

Verhalten

Das Logo-Slider Element bietet Ihnen die Möglichkeit, mehrere Bilder in Form einer Galerieschleife darzustellen. Achten Sie auf ein ähnliches Seitenverhältnis der Bilder und meiden die Mischung von Hoch- und Querformaten. 

Der Slider aktiviert sich immer dann, wenn mehr Bilder hinterlegt sind, als im Frontend dargestellt werden. Für unterschiedliche Endgeräte gilt hier verschiedene Anzahl, z.B. für Desktop sind es 5 Bilder, für Smartphones nur 3 Bilder.

Responsive: Das Logo-Slider-Element wird bei jeder verfügbaren Bildschirmgröße in einem festen Verhältnis vollständig angezeigt. 


Verknüpfte Themen

Erläuterungen aus dem toujou- & TYPO3-Setup, die mit dieser Elementanleitung in Verbindung stehen.

Bildbearbeitung  Dateiliste