Vorlagen Icon & Iconboxen
Der Iconsatz muss mit aufgeführt werden. Wenn das Icon zum Beispiel „fa-hippo“ heißt und zum Iconsatz „solid“ gehört, schreiben Sie: [icon icon="solid hippo"] . Der „fa-„Prefix wird also ebenfalls weggelassen.
Icons als Zeichen in Überschriften und Fließtext
Ausgabe
Eine Überschrift
Ein Fließtext mit einem -Icon.
Shortcode
Eine [icon icon="solid frog"] Überschrift
Ein Fließtext mit einem [icon icon="solid frog"]-Icon.
Icon-Boxen
Ausgabe
Feature 1
Um was es in diesem Projekt geht. Ein etwas längerer Abschnitt der die Überschrift gut beschreibt.
Feature 2
Um was es in diesem Projekt geht. Ein etwas längerer Abschnitt der die Überschrift gut beschreibt.
Shortcode
[columns number="2"]
[column span="1"]
[alert color="#fff" border_color="#041E42"]
[icon icon="solid frog" style="5x" alt="Ein sitzender Frosch."]
Feature 1
Um was es in diesem Projekt geht. Ein etwas längerer Abschnitt der die Überschrift gut beschreibt.
[divider]
[button style="ghost" link="www.wordpress.rrze.fau.de"]Mehr erfahren[/button]
[/alert]
[/column]
[column span="1"]
[alert color="#fff" border_color="#041E42"]
[icon icon="solid cat" style="5x" alt="Eine sitzende Katze."]
Feature 2
Um was es in diesem Projekt geht. Ein etwas längerer Abschnitt der die Überschrift gut beschreibt.
[divider]
[button style="ghost" link="www.wordpress.rrze.fau.de"]Mehr erfahren[/button]
[/alert]
[/column]
[/columns]
Invertierte Icon-Boxen
Ausgabe
Feature 1
Um was es in diesem Projekt geht. Ein etwas längerer Abschnitt der die Überschrift gut beschreibt.
Feature 2
Um was es in diesem Projekt geht. Ein etwas längerer Abschnitt der die Überschrift gut beschreibt.
Shortcode
[columns number="2"]
[column span="1"]
[alert color="#041E42" border_color="#fff" font="light"]
[icon icon="solid frog" style="5x" alt="Ein sitzender Frosch."]
Feature 1
Um was es in diesem Projekt geht. Ein etwas längerer Abschnitt der die Überschrift gut beschreibt.
[divider]
[button style="ghost" link="www.wordpress.rrze.fau.de"]Mehr erfahren[/button]
[/alert]
[/column]
[column span="1"]
[alert color="#041E42" border_color="#fff" font="light"]
[icon icon="solid cat" style="5x" alt="Ein sitzender Frosch."]
Feature 2
Um was es in diesem Projekt geht. Ein etwas längerer Abschnitt der die Überschrift gut beschreibt.
[divider]
[button style="ghost" link="www.wordpress.rrze.fau.de"]Mehr erfahren[/button]
[/alert]
[/column]
[/columns]
Iconboxen für drei Schritte
Ausgabe
In 3 Schritten zur eigenen Webseite an der FAU
Webangebot auswählen
Webadresse auswählen
Antrag über IdM stellen
Shortcode
In 3 Schritten zur eigenen Webseite an der FAU
[columns number="3"]
[column span="1"]
[alert color="#fff" border_color="#04316A"]
[icon icon="solid 1" style="5x" alt="Schritt 1."]
Webangebot auswählen
[divider]
[button style="ghost" link="https://www.wordpress.rrze.fau.de/tutorials/schnelleinstieg/vorbereitungen/"]Entscheidungshilfe[/button]
[/alert]
[/column]
[column span="1"]
[alert color="#fff" border_color="#04316A"]
[icon icon="solid 2" style="5x" alt="Schritt 2."]
Webadresse auswählen
[divider]
[button style="ghost" link="https://www.wordpress.rrze.fau.de/tutorials/schnelleinstieg/vorbereitungen/#domain"]Mehr erfahren[/button]
[/alert]
[/column]
[column span="1"]
[alert color="#fff" border_color="#04316A"]
[icon icon="solid 3" style="5x" alt="Schritt 3."]
Antrag über IdM stellen
[divider]
[button style="ghost" link="https://www.wordpress.rrze.fau.de/tutorials/schnelleinstieg/vorbereitungen/#antrag-webhosting"]Antrag stellen[/button]
[/alert]
[/column]
[/columns]
Videoanleitung