Zum Hauptinhalt springen

Anpassen des Feed-Layouts

WP Engage ist unglaublich vielseitig, was das Layout und die Darstellung der Empfehlungen betrifft. Theoretisch lässt sich jedes Layout realisieren, und das auf den Pixel exakt. Je nach Methode sind unterschiedliche Programmierkenntnisse nötig, um das gewünschte Layout umzusetzen.

Nachfolgend werden die einzelnen Optionen beschrieben, aufsteigend sortiert nach Impact und Aufwand:

Anpassung per CSS

Anpassung per CSS

Alle Widgets, und damit auch der Feed, können komplett per CSS gestaltet werden. Damit können Schriftarten und -größen, Duotone, Rahmen etc. zur Gestaltung des Feeds genutzt werden.

Jedes Widget hat eine eindeutige ID, auf die man die CSS-Klassen beziehen kann. Beim Feed ist das ‚wp-engage-feed‘.

Damit dir deine CSS-Settings nicht mit den standardmäßig aktivierten Settings in die Quere kommen, kannst du die Standards in den Einstellungen auch deaktivieren.

Einsetzen von eigenen Elementen

Einsetzen von eigenen Elementen

Wenn dir reine Empfehlungen zu langweilig sind, kannst du auch eigene Elemente in den Feed einbauen. Ein Newsletter-Formular, Anzeigen, eine „über mich“ Box? Alles kein Problem. Um diese Elemente einzubauen, benötigst du etwas PHP Kenntnisse, das Vorgehen wird hier beschrieben.

Anpassen des Feed-Grids

Anpassen des Feed-Grids

WP Engage kommt mit einem vorgeingestellten Layout für den Feed. Dieses Layout kann man anpassen, und seine eigene Struktur definieren. Mit dieser Methode lässt sich ein individuelles Grid sowohl für Desktop als auch für Mobile aufbauen.

Wie das geht, wird hier beschrieben. Auch gut zu wissen – kombiniert man diese Vorgehensweise mit den selbst definierten Elementen aus dem vorherigen Absatz, kann man einen komplett individuellen Feed erzeugen.

Eigenes Feed-Grid

Eigenes Feed-Grid

Diese Anpassung geht noch einen Schritt weiter, denn damit wird das bestehende Grid nicht mehr angepasst, sondern komplett deaktiviert, und in eine ungeordnete HTML-Liste (UL) umgebaut.

Das schafft auf der einen Seite natürlich komplette Freiheit, bedeutet aber auch, dass man (per CSS) sich sein Layout selbst erzeugen muss.

Um das Layout zu deaktivieren, definiert man zwei Konstanten in PHP:

define('WP_ENGAGE_FEED_UNORDERED_LIST', true);
define('WP_ENGAGE_FEED_UNORDERED_LIST_LENGTH', 30);

Mit der Konstante WP_ENGAGE_FEED_UNORDERED_LIST wird das Layout deaktiviert. Die Konstante WP_ENGAGE_FEED_UNORDERED_LIST_LENGTH legt die Anzahl der Empfehlungen fest, die die neue Liste umfassen soll. Wird diese Konstante nicht definiert, zeigt die Liste 100 Empfehlungen.

Auch hier lassen sich die selbst definierten Elemente nutzen.