Kontakt

Volker Burggräf
Internetkoordinator

Quicklinks

Bildergalerien und Slider

TYPO3 bietet verschiedene Möglichkeiten, Bilder zu präsentieren, z.B. als Galerie oder Slideshow. Manchmal soll dies auch in Kombination mit Text und/oder Links geschehen, und schließlich kann auch der Text selbst im Vordergrund stehen. Je nach bezweckter Anwendung bieten sich unterschiedliche Herangehensweisen an.

Sie können sich die gezeigten Elemente in TYPO3 herauskopieren, um sie auf eigenen Seiten zu verwenden:
TYPO3-Link zu Muster-Elementen

Video der Schulung zur Verwendung von Galerien und Slidern

In einer Online-Schulung wurde gezeigt, wie Grafiken und sonstige Inhalte mittles Galerien, Bannern und Slidern präsentiert werden können.

  • Einführung ins Thema (0'00")
  • (vergrößerbare) Bilder mittels „Text & Medien” (2'31")
  • Exkurs: Neue, zentral bereitgestellte Bilder der Uni zur allgemeinen Verwendung (5'35")
  • Exkurs: Copyright-Informationen anzeigen (8'28")
  • Ein großes Bild und Miniaturen/Buttons zum (automatischen) Wechseln: UOL Bildergalerie (15'48")
  • Bildbanner mit Texttafel davor und automatischem Bannerwechsel: der Claim-Slider (31'37")
  • Neu: Durch Inhaltselemente blättern: Inhalt-Slider (42'55")

Hinweis: Das Video ist nur für Angehörige der Universität aufrufbar.

Video: Claimslider - Verbesserte Konfigurationsmöglichkeiten

In einer Online-Schulung wurde gezeigt, wie man mit den Einstellungen für Höhe und Breite im Inhaltselement „Claimslider” richtig arbeitet und damit die Darstellung des Sliders auf unterschiedlichen Bildschirmgrößen justiert.

  • Einführung ins Thema (0'00")

Hinweis: Das Video ist nur für Angehörige der Universität aufrufbar.

Bildergalerie mit [Text & Medien]

Einfach zu bedienen und für viele Fälle ausreichend ist das Inhaltselement [Text & Medien]. Erzeugt man eines dieser Elemente, können dort im Reiter "Medien" anzuzeigende Bilder, die idealerweise bereits vorher in der Medienverwaltung hochgeladen wurden, eingefügt und in Reihen bzw. Spalten angeordnet werden. Die einzelnen Bilder können durch Anklicken vergrößert und dort auch nacheinander durchgeklickt werden.

Detaillierte Hinweise zur Einbindung von Bildern siehe Bilder mit/ohne Text

Beispiele für Galerien auf Basis von [Text & Medien]

Diashow mit [UOL Diashow]

Das Element [UOL Diashow] zeigt ein großes Bild an sowie zur Navigation entweder Miniaturen oder Navigationspunkte. Zudem kann ein automatischer Bildwechsel (Diashow) aktiviert werden.

Verwendung des Elements UOL Diashow

Bannerwechsel mit [Claim-Slider]

Das Element [Claim-Slider] ermöglicht einen automatischen Bannerwechsel inkl. Textbox und ggf. Verlinkung zu weiterführenden Informationen. Es bietet sich vor allem als erstes Element innerhalb von Webseiten an, welches auf plakative Art bestimmte Themen präsentiert.

Inhalt-Slider - mehrere Inhalte blätterbar

Wenn anstelle reiner Bannergrafiken ganze Inhaltselemente „geblättert” werden sollen, hilft der Inhalt-Slider:

  • Erstellen Sie ein Rasterelement vom Typ [1-spaltig]
  • Weisen Sie dem Element im Reiter [Hinweise] die CSS-Klasse owl-slider zu
    • Wenn die oben rechts dargestellten Blättern-Pfeile nicht gewünscht sind, können Sie durch die zusätzliche CSS-Klasse ohne-pfeile (also insgesamt owl-slider ohne-pfeile) ausgeblendet werden.
  • Erzeugen Sie innerhalb des Rasterelements verschiedene Inhaltselemente. Diese können dann mittels der Navigationsbuttons durchgeblättert werden. 

Im nachfolgenden Beispiel wurde zusätzlich im Reiter [Erscheinungsbild] der Rahmen Hintergrund hellgrau zugewiesen.

Inhalt-Slider: Mehrere Elemente blätterbar

Element 1

Am 5. Dezember 2023 – und damit genau 50 Jahre, nachdem der Niedersächsische Landtag die Universität Oldenburg offiziell gründete – fällt mit der „AUFTAKT“-Veranstaltung der offizielle Startschuss für unser Jubiläumsjahr 2024. Wir freuen uns sehr darauf, dieses Jubiläum gemeinsam mit Ihnen allen zu begehen: mit unseren Beschäftigten und Studierenden, den Menschen aus Oldenburg und der Region, mit nationalen und internationalen Gästen, unseren Freundinnen, Freunden, Alumni, Fördernden und allen weiteren Menschen, die sich uns verbunden fühlen. 

Element 2

Am 5. Dezember 2023 – und damit genau 50 Jahre, nachdem der Niedersächsische Landtag die Universität Oldenburg offiziell gründete – fällt mit der „AUFTAKT“-Veranstaltung der offizielle Startschuss für unser Jubiläumsjahr 2024. Wir freuen uns sehr darauf, dieses Jubiläum gemeinsam mit Ihnen allen zu begehen: mit unseren Beschäftigten und Studierenden, den Menschen aus Oldenburg und der Region, mit nationalen und internationalen Gästen, unseren Freundinnen, Freunden, Alumni, Fördernden und allen weiteren Menschen, die sich uns verbunden fühlen. 

Element 3

Am 5. Dezember 2023 – und damit genau 50 Jahre, nachdem der Niedersächsische Landtag die Universität Oldenburg offiziell gründete – fällt mit der „AUFTAKT“-Veranstaltung der offizielle Startschuss für unser Jubiläumsjahr 2024. Wir freuen uns sehr darauf, dieses Jubiläum gemeinsam mit Ihnen allen zu begehen: mit unseren Beschäftigten und Studierenden, den Menschen aus Oldenburg und der Region, mit nationalen und internationalen Gästen, unseren Freundinnen, Freunden, Alumni, Fördernden und allen weiteren Menschen, die sich uns verbunden fühlen. 

Durch Zuweisen einer zusätzlichen CSS-Klasse halb oder drittel oder viertel kann eine halbierte, gedrittelte oder geviertelte Darstellung erreicht werden. Im nachfolgenden Beispiel ist im CSS-Feld owl-slider halb (zwei Begriffe mit Leerzeichen dazwischen) eingetragen, womit eine zweispaltige Darstellung erreicht wird.

Außerdem wurden allen enthaltenen Inhaltselementen Hintergrundfarben zugewiesen, während das umgebende Rasterelement im Gegensatz zum vorigen Beispiel keine Hintergrundfarbe hat.
Wegen des geringeren Platzangebots wurden die Grafiken überdies verkleinert.

Inhalt-Slider: Mehrere Elemente blätterbar (mit Halb-Aufteilung)

Element 1

Am 5. Dezember 2023 – und damit genau 50 Jahre, nachdem der Niedersächsische Landtag die Universität Oldenburg offiziell gründete – fällt mit der „AUFTAKT“-Veranstaltung der offizielle Startschuss für unser Jubiläumsjahr 2024. Wir freuen uns sehr darauf, dieses Jubiläum gemeinsam mit Ihnen allen zu begehen: mit unseren Beschäftigten und Studierenden, den Menschen aus Oldenburg und der Region, mit nationalen und internationalen Gästen, unseren Freundinnen, Freunden, Alumni, Fördernden und allen weiteren Menschen, die sich uns verbunden fühlen. 

Element 2

Am 5. Dezember 2023 – und damit genau 50 Jahre, nachdem der Niedersächsische Landtag die Universität Oldenburg offiziell gründete – fällt mit der „AUFTAKT“-Veranstaltung der offizielle Startschuss für unser Jubiläumsjahr 2024. Wir freuen uns sehr darauf, dieses Jubiläum gemeinsam mit Ihnen allen zu begehen: mit unseren Beschäftigten und Studierenden, den Menschen aus Oldenburg und der Region, mit nationalen und internationalen Gästen, unseren Freundinnen, Freunden, Alumni, Fördernden und allen weiteren Menschen, die sich uns verbunden fühlen. 

Element 3

Am 5. Dezember 2023 – und damit genau 50 Jahre, nachdem der Niedersächsische Landtag die Universität Oldenburg offiziell gründete – fällt mit der „AUFTAKT“-Veranstaltung der offizielle Startschuss für unser Jubiläumsjahr 2024. Wir freuen uns sehr darauf, dieses Jubiläum gemeinsam mit Ihnen allen zu begehen: mit unseren Beschäftigten und Studierenden, den Menschen aus Oldenburg und der Region, mit nationalen und internationalen Gästen, unseren Freundinnen, Freunden, Alumni, Fördernden und allen weiteren Menschen, die sich uns verbunden fühlen. 

Internetkoordinator (Stand: 02.07.2024)  | 
Zum Seitananfang scrollen Scroll to the top of the page