Neue Shortcodes für das LB-Theme

0

Vor einiger Zeit habe ich bereits einen Artikel veröffentlicht, in dem alle Shortcode-Funktionen des LB-Projets Theme erklärt wurden.
Nun sind zu den vorhandenen Funktionen noch zwei Shortcodes für einen Text-Spoiler und ein Accordion-Menu hinzugekommen, die das Ein- und Ausblenden von Text innerhalb einer Box ermöglichen.

1) Text-Spoiler

Der erste neue Shortcode generiert einen Spoiler, mit dessen Hilfe man den enthaltenen Text ein- und ausblenden kann, indem man auf die Überschrift des Spoilers klickt. Probieren Sie es am besten einfach aus.

Spoiler - Test
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.

Die Verwendung ist sehr einfach. Schließen Sie den Text, der sich innerhalb der Box befinden soll mit den Shortcodes [spoiler] folgendermaßen ein.

[spoiler]Text, der im Spoiler enthalten ist...[/spoiler]

Falls Sie den Titel des Spoilers ändern möchten, müssen Sie das Attribut “title” an den Shortcode übergeben. Soll beispielsweise der Text “Ich bin der Titel” im Titel der Box angezeigt werden, nutzen Sie folgenden Code.

[spoiler title="Ich bin der Titel"]Text, der im Spoiler enthalten ist...[/spoiler]

1) Accordion-Box

Das Accordion ähnelt dem Spoiler, jedoch gibt es hier anstatt einer Box gleich mehrere, die allerdings funktionell zusamenhängen. Denn es kann immer nur eine einzige Box geöffnet sein. Sobald Sie auf eine Box klicken, schließt sich die zuvor geöffnete Box und die neue öffnet sich. Auch ein Toggeln der aktiven Box ist – anders als beim Spoiler – nicht möglich. Anhand des folgenden Beispiels dürfte das deutlich werden.

accordion1 - Test
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.
accordion2 - Test
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.
accordion3 - Test
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.

Die Verwendung ist ähnlich einfach wie beim Spoiler. Jede einzelne Box wird dabei in die Shortcodes [accordion] eingefasst. Sollen also drei Boxen innerhalb des Accordion-Menüs angezeigt werden, nutzen Sie folgende Syntax.

[accordion]Inhalt der ersten Box[/accordion]
[accordion]Inhalt der zweiten Box[/accordion]
[accordion]Inhalt der dritten Box[/accordion]

Es können dabei beliebig viele Boxen aneinandergereiht werden. Um die sinngemäße Funktion des Accordions zu erzielen, sollten jedoch mindestens zwei Boxen verwendet werden.

Ähnlich wie beim Spoiler haben Sie nun noch die Möglichkeit, den einzelnen Boxen mithilfe des Title-Attributs unterschiedliche Titel zu geben.

[accordion title="Ich bin der Titel"]Inhalt der Accordion-Box...[/accordion]

Das Accordion verfügt darüber hinaus über das Attribut “state”, mit dem festgelegt werden kann, welche Box beim Laden der Seite geöffnet ist. Wenn Sie dieses Attribut nicht verwenden, ist die entsprechende Box geschlossen. Setzten Sie den Wert auf “active”, ist die Box standardmäßig geöffnet.

[accordion title="Titel123" state="active"]Inhalt der Accordion-Box, die standardmäßig geöffnet ist...[/accordion]

Beim obigen Beispiel ist die erste Box standardmäßig geöffnet, weil dem Attribut “state” der Wert “active” zugewiesen wurde.

3) Fazit

Die neuen Shortcodes ermöglichen es, lange und unübersichtliche Inhalte besser zu strukturieren und dem Leser zugänglicher zu machen.
Die neuen Codes werden ab Version 3.0 im LB-Projects Themes implementiert sein. Sie können diese Version in Kürze hier herunterladen.

Hinterlasse eine Antwort

Ihre Email-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert.

*

Zu diesem Artikel sind bisher keine freigegebenen Kommentare vorhanden.