Meine Spielwiese

Plugin Akkordeon


Über einen klickbaren Titel-Balken kann ausgeblendeter Inhalt eingeblendet werden.


Dies hält den Seiteninhalt kompakt. Detailinformationen werden nach Klick sichtbar und wirklich nur bei Interesse eingeblendet. Der Seitenbesucher muß aktiv werden.

Ich habe in folgenden Umgebungen getestet:
- PHP 7.4, PHP 8.0 - 8.4
- mozilo Version 2.0 Rev. 55
- mozilo 3.x

Syntax allgemein:
{Akkordeon|optionale Klassen|Inhalt}
- Akkordeon = Pluginname
- optionale Klassen = erster Parameter; kann leer bleiben; gestattet aber die indiv. Gestaltung
- Inhalt = zweiter Parameter; enthält 1 bis n einzelne Elemente der Art Klicktitel / ausgeblendeter Inhalt

Plugin im Editor einfügen - diese Struktur wird automatisch erzeugt:
{Akkordeon | optionale Klassen |
item
    Titel 1 = hier steht Klicktitel; sichtbarer Balken
content
    Inhalt 1 = hier wird der gesamte Inhalt eingepflegt; ist normal ausgeblendet
item
    Titel 2
content
    Inhalt 2

weitere Elemente als Kombination item + content
}

Über einen Klassennamen kann das Aussehen differenziert gesteuert werden.

- Layout (Breite, Abstand)
- Frame (Rand, Schatten, Ecken)
- Color (Farbschema)
- Content (Anordnung Inhaltselemente)
- Icon (Symbol in Titelbalken)

Diese Klassen sind bereits angelegt. Details in der readme.txt
Beispiele können aus der Datei Kopiervorlagen.txt kopiert und in eine Inhaltsseite eingefügt werden.

Diese Gestaltungsklassen sind anpaßbar. Es können neue / eigene Klassen erstellt werden.

Siehe Beispiele 1 - 3 weiter unten.

Hinweis!
Bleibt der 1. Parameter leer, greift ein sauberes Standardformat.

Hier werden für n Elemente die Inhalte immer als Paar definiert:
- Klicktitel (item) + einzublendender Inhalt (content)

item --> definierter Befehl; Titel (WICHTIG! mit -- davor und danach)
content --> definierter Befehl; Inhalt (WICHTIG! mit -- davor und danach)

item
- sollte kurz und prägnant sein
- kann mehrzeilig sein
- Bild als Icon möglich

content
- kann jede Form von Inhalt aufnehmen
  (Text, Bilder, Tabellen, Plugins etc.)
Im Admin sind derzeit 4 Einstellungen möglich:
Bild "Plugins:akko-admin.jpg"
1. Mehrere Inhalte gleichzeitig geöffnet erlauben? Checkbox Ja/Nein
- Haken gesetzt --> bei Klick auf weitere Elemente bleiben bereits geöffnete Elemente offen
- Haken nicht gesetzt --> bei Klick auf weitere Elemente werden bereits geöffnete Elemente geschlossen

2. Erstes Element beim Laden geöffnet anzeigen? Checkbox Ja/Nein
- Haken gesetzt --> erstes Element bei Seoitenaufruf bereits geöffnet
- Haken nicht gesetzt --> alle Elemente geschlossen

3. Animationsdauer in Millisekunden
- darüber läßt sich  steuer, wie schnell Inhalte aufgeklappt / geshlossen werden

4. Standardsymbol vor Titel
- es stehen 4 verschiedene Symbole zur Auswahl (Büroklammer, Dreieck, Pfeil, Pfeil im Kreis)

Wichtiger Hinweis!
Diese Angaben gelten für jeden Plugineinbau auf der Seite!
Das heißt, wenn erstes Element beim Seitenaufruf offen sein soll, dann ist es offen bei allen Akkordeons.

1. Beispiel - Standard-Aussehen; ohne Klassen

Code zu Beispiel 1 mit zwei Elementen
{Akkordeon||
--item--
Erklärung zu Titel 1
--content--
Plugin Lightbox

--item--
Titel 2, Textabsätze
--content--
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed ...
}

Textabschnitte

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.


2. Beispiel - volle Breite, sandfarben,  keine Abrundung

Erklärung

Bildlinks

Bild "Home:mozilo.png"At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

FlexCards

Titel
Text
Fuß

Titel
Text
Fuß

Titel
Text
Fuß



3. Beispiel - Breite schmal, Farbschema dunkel

Erklärung
Beliebiger Inhalt

Inhalt 3

4. Beispiel - Modifikation des Symbols vor Titel

Erklärung

Inhalt 1

Inhalt 1

Inhalt 1

Inhalt 1