spring winter winter winter winter

Cat on sleeping pigs

Cola Beach - Goa

Mit dieser Extension kannst Du Deiner Website einen Headerslider, basierend auf dem jQuery-PlugIn Nivo Slider oder einem eigenen jQuery-PlugIn, hinzufügen.

Nach der Installation im EM, muß das statische Template für die EXT geladen werden.
Danach müssen im Konstanten-Editor die nötigen Einstellung für das JS vorgenommen werden.

Weitere Einstellungen können in der EM-conf vorgenommen werden.

Neu ab Version 5:

  • "Customslider" - kann in der EM-Konfiguration aktiviert werden. Eigenes jQuery PlugIn ist möglich.
  • "LanguageMode" - kann in der EM-Konfiguration aktiviert werden.
    Wenn auf "Alternative Page Language" keine Bilder vorhanden sind, werde die von "Pages" (Standardsprache) angezeigt.
  • "Rekursive Einstellungen" - hiermit können jetzt auch die Einstellungen rekursiv übernommen werden.

Das Einbinden der Extension wird mit TS und einer Variable für das Template vollzogen.

TS - Setup:

 

# Hier wird dem Fluid-Template eine neue Variable mit dem Headerslider zugewiesen 
...
page {
...
10 = FLUIDTEMPLATE
10 {
...
variables {
headerslider < lib.t3sheaderslider
...
}
}
}
Fluid-Template:

Diese Variable, kann dann im Fluid-Template, an gewünschter Stelle, platziert werden:

 

<f:format.raw>{headerslider}</f:format.raw>

Mit EXT:t3sbootstrap sind diese Einstellungen nicht nötig. Hier habe ich bereits eine Variable "jumbotron_variable" mit "lib.t3sheaderslider" vorbelegt und platziert. Das statische Template ist vor der EXT:t3sbootstrap zu laden!

Unter "Seite bearbeiten", befindet sich nach Installation ein neuer Tabulator "Headerslider". Hier können Bilder mit Titel, Bildbeschreibung und Link über den File Abstraction Layer (FAL) geladen oder referenziert werden.
Je nachdem, welche Auswahl für die Slider-Caption ausgewählt wurde, erscheint der Titel und die Bildbeschreibung in der Slider-Caption.
Der angegebene, optionale Link, wird um das entsprechende Bild gelegt.

Es sind vier Themen (default, light, dark und bar) vorgegeben. Diese können in dem Select-Feld "Thema" ausgewählt werden.
Wenn ein eigenes Thema/Layout vorhanden ist, dann kannst Du hier "none" auswählen und Deine eigene CSS-Datei mit TS einbinden.
Wenn auch die, für das Script benötigte CSS-Datei, durch eine eigene ersetzt werden soll, dann kannst Du dieses wie folgt erreichen.

TS Setup:

 

plugin.tx_t3sheaderslider.settings.cssFile = Pfad/zur/eigenen/css.datei

Weitere Informationen zum jQuery PlugIn Nivoslider, kannst Du hier erhalten:

Nivo Slider GitHub

Nivo Slider Dokumentation

Nivo Slider Copyright 2012, Dev7studios