Custom Post Archive in Elementor Pro erstellen: Pods-Plugin

By Tim ChristophersenElementor, Anleitungen

Custom Post Archive in Elementor Pro erstellen: Pods-Plugin

Elementor hat kürzlich das Loop Grid Menu hinzugefügt, das uns die Möglichkeit bietet, individuelle Archive zu gestalten. In diesem Tutorial zeige ich dir, wie du ein Bewertungsarchiv erstellst und viele Anpassungsmöglichkeiten hast. Das Endergebnis wird ein Archiv sein, das durch Bewertungen scrollt.

1. Custom Post erstellen

WordPress bietet die Möglichkeit, Custom Posts hinzuzufügen. Dies bedeutet, dass in dem WordPress-Panel neue Reiter möglich sind und WordPress auch unter den verschiedenen Posts unterscheiden kann. Dies wird auch von vielen Plugins genutzt. Wir können diese per PHP erstellen. Allerdings kann dies sehr zeitaufwendig sein und kleine Änderungen benötigen viel Zeit. Deshalb schlage ich eine Plugin alternative vor, die auch viele Anpassungsmöglichkeiten bietet: das Pods-Plugin.

2. Custom Post mit dem Pods-Plugin erstellen

Nachdem du das Pods-Plugin installiert hast, wähle den Pods-Admin-Link unten aus. Klicke auf „Add new“ und erstelle einen neuen Post-Typ. Das Plugin bietet viele Einstellmöglichkeiten, auf die ich hier nicht weiter eingehen werde.

Belasse den Content Type bei Custom Post und benenne den Post (dieser Name wird auch im Dashboard erscheinen). Nachdem der Pod erstellt wurde, kannst du alle Felder, die du benötigst, hinzufügen. Hier gibt es auch eine riesige Auswahlmöglichkeit, die sehr einfach zu verstehen sind. Beim Erstellen von Sternebewertungen habe ich mich für die Version mit „Plain Numbers“ entschieden. Diese habe ich auf einen Slider gestellt und standardmäßig auf 5 Sterne eingestellt.

3. Erstelle eine neue Seite mit Elementor

Erstelle eine neue Seite und ziehe das Loop Grid Widget in den Elementor-Editor. Stelle die Query auf deinen neu erstellten Custom Post ein. Auf „Create Template“ klicken, um ein neues Template für das Loop Grid zu erstellen. Die Bearbeitung gestaltet sich wie im normalen Editor. Der Clou sind die dynamischen Inhalte.

Bitte beachte, dass das Loop Grid-Widget von Elementor sich zurzeit noch in der Beta-Phase befindet. Wenn du im Editor das Loop Grid-Widget nicht finden kannst, gehe zu den Elementor Einstellungen und aktiviere unter „Experiments“ das Loop Grid-Widget. Sobald es aktiviert ist, solltest du es im Editor finden können. Es ist wichtig zu wissen, dass das Loop Grid-Widget von Elementor noch in der Entwicklung ist und es daher möglicherweise noch einige Bugs oder Einschränkungen geben kann. Wenn du jedoch die Anleitung befolgst, solltest du in der Lage sein, ein benutzerdefiniertes Post-Archiv in Elementor zu erstellen.

4. Dynamische Inhalte hinzufügen

Wähle ein Textfeld in dem Template aus und klicke rechts oben auf „Dynamische Inhalte“. Nun sollten die neu erstellten Post-Typen auftauchen. Wichtig zu wissen ist, dass diese Technik durch Elementor Pro bereitgestellt wird und nicht durch das Plugin. Das Plugin registriert die neuen Custom Posts auf Elementor. Werden die dynamischen Inhalte reingeladen, gibt es eine Ausnahme, die man wissen muss: Wenn du in den Custom Post auswählst, dass eine „Plain Number“ eingegeben wird (wie bei unserem Beispiel mit den Sternebewertungen), können diese nur bei numerischen Inhalten verwendet werden. In diesem Beispiel gibt es die Möglichkeit, das Star Review Widget hinzuzuziehen.

5. Sterne dynamisch anzeigen lassen (plain numbers)

Zum aktuellen Zeitpunkt gibt es noch einen Bug, der in Zukunft eventuell behoben wird. Unter Pods Numeric Field können wir unser Custom Field nicht finden. Das liegt am Plugin (https://github.com/elementor/elementor/issues/20810). Die Lösung besteht darin, anstelle von Pods Numeric Site „Shortcode“ auszuwählen. Hier fügen wir den Namen unseres Custom Fields ein. Diesen finden wir im Menü von Pods, wo wir das Feld erstellt haben. Verwende den folgenden Shortcode: [pods field=“name_des_feldes“].

Nun können wir auch die Sterne dynamisch anzeigen lassen.

6. Gestalte das Archiv

Das Elementor Loop Grid bietet viele Möglichkeiten, ein Archiv zu gestalten. Verwende die verschiedenen Einstellungen, um das Archiv anzupassen. Wenn du fertig bist, speichere das Template und füge es auf der gewünschten Seite ein.

Fazit

Das Erstellen eines Custom Post Archive in Elementor mit dem Pods-Plugin ist eine großartige Möglichkeit, individuelle Archive zu gestalten und sie an deine Bedürfnisse anzupassen. Mit dem Elementor Loop Grid kannst du dynamische Inhalte hinzufügen und das Archiv nach deinen Wünschen gestalten. Wenn du Schwierigkeiten hast, folge einfach dieser Anleitung und du wirst dein eigenes Custom Post Archive in Elementor erstellen können.