IMAREAL + MEMO WIKI

Wesentliche Elemente

WPBakery stellt eine große Anzahl unterschiedlicher Elemente zur Verfügung. Für die tägliche Arbeit auf der IMAREAL-Website wird jedoch nur ein Teil davon regelmäßig benötigt. Die folgenden Elemente gehören zu den wichtigsten Bausteinen der Website.

Text Block#

Der Text Block wird für normale Textinhalte verwendet. Er enthält den WordPress-Texteditor und ermöglicht unter anderem:

  • Absätze und Überschriften
  • Fett- und Kursivschrift
  • Listen
  • Links
  • weitere einfache Textformatierungen

Für längere Textinhalte ist der Text Block das wichtigste WPBakery-Element.

Die Verwendung des Texteditors und die wichtigsten Regeln für die Formatierung werden im nächsten Kapitel ausführlicher beschrieben.

Single Image#

Mit Single Image wird ein einzelnes Bild in eine Seite eingefügt. Nach dem Hinzufügen des Elements kann ein bereits vorhandenes Bild aus der Medienbibliothek ausgewählt oder ein neues Bild hochgeladen werden.

Wichtig: Bildgröße kontrollieren

Beim Anlegen eines neuen Single-Image-Elements steht die Bildgröße standardmäßig auf „thumbnail“. Dadurch verwendet WordPress lediglich eine kleine Darstellung des Bildes. Wird diese auf der Website größer dargestellt, kann das Bild entsprechend unscharf erscheinen. Im Regelfall muss die Einstellung daher auf Image size: full geändert werden!

Damit wird das Bild in seiner vollständigen Größe verwendet. Voraussetzung ist natürlich, dass das Originalbild bereits in einer für die Website geeigneten Größe vorbereitet und hochgeladen wurde.

Nach dem Einfügen sollte die Darstellung des Bildes immer in der Vorschau kontrolliert werden.

Buttons#

Mit einem Button kann ein hervorgehobener Link innerhalb einer Seite erstellt werden.

Buttons eignen sich beispielsweise für Links zu:

  • weiterführenden Informationen
  • Anmeldungen
  • Downloads
  • externen Websites
  • anderen wichtigen Seiten

Beim Bearbeiten eines Buttons werden insbesondere die Beschriftung und das Linkziel festgelegt. Die Beschriftung sollte möglichst deutlich machen, was nach einem Klick passiert. Allgemeine Texte wie „Hier klicken“ sind weniger aussagekräftig als beispielsweise „Weitere Informationen“ oder „Projektwebsite öffnen“. Bei bestehenden Seiten sollten Gestaltung und Einstellungen vorhandener Buttons als Vorlage verwendet werden.

Accordion#

Ein Accordion ermöglicht es, längere Inhalte in auf- und zuklappbare Bereiche zu gliedern. Jeder Bereich besteht normalerweise aus einer Überschrift und dem dazugehörigen Inhalt. Besucher sehen dadurch zunächst eine kompakte Übersicht und können gezielt jene Bereiche öffnen, die sie interessieren.

Accordions eignen sich besonders für:

  • häufig gestellte Fragen
  • zusätzliche Detailinformationen
  • längere thematisch gegliederte Inhalte

Ein Accordion sollte nicht unnötig für kurze Inhalte verwendet werden. Informationen, die für alle Besucher unmittelbar wichtig sind, sollten in der Regel direkt sichtbar bleiben.

Pure HTML#

Das Element Pure HTML ermöglicht das Einfügen von HTML bzw. anderem Code, der nicht über den normalen Texteditor bearbeitet werden soll. Auf der IMAREAL-Website ist dieses Element insbesondere für Embed-Codes und Shortcodes relevant.

Embed-Codes

Externe Dienste stellen häufig einen sogenannten Embed-Code zur Verfügung. Damit können externe Inhalte in eine Website eingebettet werden (zum Beispiel: Newsletter-Anmeldung). Ein solcher Code muss unverändert in das dafür vorgesehene Pure-HTML-Element eingefügt werden. Einzelne Bestandteile sollten nur verändert werden, wenn ihre Funktion bekannt ist.

Shortcodes

Ein Shortcode ist eine spezielle WordPress-Anweisung, die beim Aufruf einer Seite durch einen bestimmten Inhalt oder eine Funktion ersetzt wird. Ein Shortcode ist üblicherweise an eckigen Klammern zu erkennen, beispielsweise:

[beispiel]

Er kann zusätzlich Parameter enthalten:

[beispiel id="123"]

Was ein Shortcode tatsächlich ausgibt, hängt vom jeweiligen Plugin bzw. von der Funktion ab, die diesen Shortcode bereitstellt. Vorhandene Shortcodes sollten daher nicht verändert werden, wenn ihre Funktion nicht bekannt ist. Bereits kleine Änderungen an Namen, Parametern oder Schreibweise können dazu führen, dass der Shortcode nicht mehr funktioniert.

PBM Team Box#

Die PBM Team Box ist ein speziell für die IMAREAL-Website verfügbares WPBakery-Element. Damit können Mitarbeiter, die als entsprechender Custom Post Type (CPT) in WordPress angelegt sind, automatisch auf einer Seite ausgegeben werden. In den Einstellungen der Team Box wird eine Kategorie angegeben. Das Element listet anschließend die Mitarbeiter auf, die dieser Kategorie zugeordnet sind. Die einzelnen Personen müssen dadurch nicht manuell auf der Seite eingetragen werden.

Soll sich die Zusammensetzung einer solchen Liste ändern, sollte daher zunächst geprüft werden, ob die Kategorie-Zuordnung der betreffenden Mitarbeiter angepasst werden muss, anstatt die Seite selbst zu verändern. Die Verwaltung der Mitarbeiter und ihrer Zuordnungen wird im Kapitel „Team“ näher beschrieben.

PBM Research Box#

Die PBM Research Box funktioniert nach einem ähnlichen Prinzip wie die Team Box. Sie dient dazu, die in WordPress angelegten wissenschaftlichen Projekte (Research) automatisch auf einer Seite aufzulisten. Auch hier wird im WPBakery-Element eine Kategorie angegeben. Anschließend werden die dieser Kategorie zugeordneten Research-Einträge automatisch ausgegeben.

Die Projekte selbst werden daher nicht innerhalb der WPBakery-Seite gepflegt. Änderungen an Titel, Beschreibung oder anderen Projektdaten erfolgen beim jeweiligen Research-Eintrag. Die Verwaltung dieser Inhalte und ihrer Kategorien wird im Kapitel „Research“ näher beschrieben.

Bestehende Elemente als Vorlage verwenden#

Bei Unsicherheit über die richtigen Einstellungen ist es im Regelfall sinnvoll, ein bereits vorhandenes Element auf einer bestehenden Seite als Orientierung zu verwenden. Soll ein gleichartig gestalteter Bereich erstellt werden, kann das bestehende Element auch dupliziert und anschließend angepasst werden. Damit werden vorhandene Einstellungen übernommen und die Gestaltung der Website bleibt einheitlich.