Neue Funktionen des LB-Themes

3

In den letzten Tagen habe ich mein WordPress-Theme, das hier heruntergeladen werden kann, um einige Funktionen erweitert. Diese betreffen hauptsächlich neue Gestaltungselemente für Artikel.
Zum Einsatz kommen hierbei sogenannte Shortcuts, mit deren Hilfe man sehr einfach benutzerdefinierte Elemente in einem Artikel erstellen kann.

Im Folgenden möchte ich Ihnen die neuen Features anhand einiger Beispiele zeigen und erklären, wie sie innherhalb eines Artikels erstellt werden.

1) zweispaltiges Layout

Die erste Neuerung ist ein zweispaltiges Layout für Artikelinhalte. Mithilfe der Shortcodes [one_half] und [one_half_last] werden zwei nebeneinaderliegende Spalten generiert. Dies könnte beispielsweise so aussehen.

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.

Der Shortcode umschließt dabei den Text, der sich innerhalb der Spalte befindet. Um diese Funktion innheralb eines Artikels zu verwenden, werden die nachfolgenden Shortcodes benötigt.
[one_half]Text in der linken Spalte[/one_half]
[one_half_last]Text in der rechten Spalte[/one_half_last]

2) farbige Info-Boxen

Die nächste neue Funktion, die auch mithilfe von Shortcodes genutzt werden kann, sind farbige Infoboxen. In ihnen können wichtige Informationen oder Hinweise zum Artikel stehen.

Verwenden Sie [colorbox color=”red”]Text[/colorbox] zum Erstellen einer roten Textbox.

Zum Erstellend dieser gelben Textbox verwenden Sie [colorbox color=”yellow”]Text[/colorbox]

Eine grüne Box kann mit [colorbox color=”green”]Text[/colorbox] erstellt werden.

Für diese blaue Textbox wird der Shortcut [colorbox color=”blue”]Text[/colorbox] benötigt.

Zum Anzeigen dieser grauen Box verwenden Sie [colorbox color=”grey”]Text[/colorbox]

3) Randnotiz

Dies ist eine Randnotiz. Um eine Randnotiz zu erstellen, verwenden Sie den Shortcode [notice]
Es ist für den Leser immer hilfreich, wenn zu einem Text Zusatzinformationen in Form einer Randnotiz gegeben werden (beispielsweise wichtige Daten zu einer Person, einem historischen Ereignis, etc.). Um eine solche Funktion zu ermöglichen, habe ich den Shortcode [notice] zum Theme hinzugefügt.

4) Zitate

Ein Zitat kann direkt mittels der HTML-Tags <blockquote> gekennzeichnet werden. Grafisch ergibt sich nachstehendes Bild. Den Autor kennzeichnet man mit dem <citee>-Tag. Der HTML-Quellcode für das nachfolgende Zitat sieht wie folgt aus. <blockquote>Man soll die Dinge so einfach wie möglich machen, aber nicht noch einfacher. <cite>- Albert Einstein</cite></blockquote> Schließlich ergibt sich dann dieses Zitat.

Man soll die Dinge so einfach wie möglich machen, aber nicht noch einfacher. Albert Einstein

5) Tabellen

Eine weitere interessante Möglichkeit zur Visualisierung von bestimmten Inhalten ist eine Tabelle. Diese kann auch direkt mittels der entsprechenden HTML-Tags erstellt werden. Im Quellcode ergibt sich dann folgendes.
<table>
<tr>
<th>Header1</th>
<th>Header2</th>
<th>Header3</th>
</tr>
<tr>
<td>Zelle1_1h</td>
<td>Zelle1_2z</td>
<td>Zelle1_3</td>
</tr>
<tr>
<td>Zelle2_1</td>
<td>Zelle2_2</td>
<td>Zelle2_3</td>
</tr>
</table>

Das Ergebnis sieht dann so aus. Natürlich kann die Tabelle um beliebig viele Zellen erweitert werden. Je nach Layout muss dann allerdings der Code angepasst werden.

Header1 Header2 Header3
Zelle1_1 Zelle1_2 Zelle1_3
Zelle2_1 Zelle2_2 Zelle2_3

6) Quellcode

Zu guter Letzt wurde auch der <code>-Tag mit einem einfachen Design versehen. Dieser wird immer dann verwendet, wenn man einen Quelltext darstellen möchte. Das Ergbnis sehen Sie bereits bei den Beispielen weiter oben im Einsatz. In der HTML-Ansicht des Editors geben sie hierzu nachfolgenden Code ein.
<code>printf("Hallo Welt");</code>

Hinterlasse eine Antwort

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

*

Kommentare umschalten

3 Kommentare zu "Neue Funktionen des LB-Themes"

  • [...] Anzahl an benutzerdefinierten Shortcuts zur Strukturierung von [...]

  • [...] Natürlich gibt es noch weitere Shortcodes und auch die Colorbox unterstützt noch andere Farben. Weitere Beispiele für die in meinem Theme zur Verfügung stehenden Shortcodes finden Sie in diesem Artikel. [...]

  • [...] einiger Zeit habe ich bereits einen Artikel veröffentlicht, in dem alle Shortcode-Funktionen des LB-Projets Theme erklärt wurden. Nun sind zu [...]