Event einrichtung

In dieser Anleitung richten wir deine neleto-Installation für die Verwaltung von Events ein. Da Events im Grunde nur Blogbeiträge mit Start- und Enddatum sind, unterscheidet sich dieses Setup nicht großartig von der Einrichtung von Blogbeiträgen. Wenn du das also schon gemacht hast, solltest du das auch ohne diese Anleitung hinkriegen.

Voraussetzungen

Dein Benutzer muss die Rolle developer oder admin haben, um die Einstellungen und Components verwalten zu können.

Du musst die erste Einrichtung deiner neleto-Installation abgeschlossen haben, bevor du mit Events loslegen kannst. Mehr Infos findest du unter Einrichtung.

Du solltest dich auch mit Components und Seiten vertraut machen.

Component für Events erstellen

Als erstes musst du einen Component erstellen, der speziell für die Darstellung von Events gedacht ist. Zum Glück kommt deine neleto-Installation bereits mit einer Vorlage dafür. Um diese Vorlage zu nutzen, geh auf die Components-Seite in der Admin-Oberfläche und klick auf + Neu aus Vorlage. Du siehst dann eine Liste mit verfügbaren Vorlagen, und eine davon heißt Event content. Klick auf die Vorlage namens Event content, um einen Component basierend auf dieser Vorlage zu erstellen. Jetzt kannst du diesen neuen Component anpassen, damit er zum Design deiner Website passt, oder einfach auf Speichern und schließen klicken, um das Fenster zu schließen. Dieser Component wird nun ein Event darstellen, wenn er in der richtigen Seite eingebunden wird.

Erstelle eine Seite zum Anzeigen von Events

Zusätzlich zum Event-Content-Component brauchst du eine Seite, die als Pfad zur Darstellung von Events dient. Um diese Seite zu erstellen, geh zur Seiten-Übersicht in der Admin-Oberfläche und klick auf + Neu. Du landest dann im Pagebuilder, wo wir ein paar Dinge einstellen müssen. Genau wie bei der Seite für Blogbeiträge muss die Route dieser Seite einen Parameter namens slug haben. Das kriegst du mit einem Pfad wie diesem hin: /event/:slug. Achte auf den Teil :slug, das ist der Pfad-Parameter (gekennzeichnet durch das :) und sein Name ist slug. Der erste Teil (/event) kann alles sein, was du willst, auch mehrere Wörter, getrennt durch /. Wir empfehlen, mindestens ein Wort vor dem Parameter zu verwenden, um das Risiko von Überschneidungen mit anderen Seiten zu verringern, da der :slug-Parameter durch den Slug des besuchten Events ersetzt wird. Wenn zum Beispiel jemand ein Event mit dem Slug mein-tolles-event besucht und die Event-Seite eine Route von /event/:slug hat, sieht die resultierende URL so aus: /event/mein-tolles-event.

Als zweites musst du deinen neuen Event content-Component in diese Seite einbauen. Wechsel dafür zum Elemente-Tab im Pagebuilder und klick auf + Element erstellen. Es erscheint ein Popup mit einer Liste aller Components in deiner Installation. Einer davon sollte der Event content sein. Wenn du ihn nicht siehst, kannst du die Suche oben im Popup nutzen, um danach zu suchen. Wenn du ihn gefunden hast, klick drauf, um ein Element mit diesem Component zu erstellen. Wenn du die Vorlage ohne Änderungen verwendest, musst du am Element selbst nichts mehr ändern.

Als drittes musst du den Status auf Veröffentlich setzen, sonst können Besucher deine Events nicht sehen.

Und als letztes musst du den Render-Modus auf Dynamisch stellen, da der Slug-Parameter für jedes Event anders sein wird. Wenn er auf Vorgerendert bleibt, kann es passieren, dass Besucher nicht das Event sehen, auf das sie geklickt haben.

Du kannst jetzt weitere Elemente zu dieser Seite hinzufügen oder deinen Event-Content- Component in andere Elemente verschachteln. Wenn du fertig bist, speicher die Seite und sie ist bereit, Events anzuzeigen.

Verknüpfe die Event-Seite in den Einstellungen

Deine neu erstellte Seite muss jetzt in den Einstellungen registriert werden, damit neleto weiß, wie Event-Links generiert werden sollen. Geh dafür zur Einstellungen-Seite, die findest du in der unteren linken Ecke der Admin-Oberfläche (wenn du nicht gerade in einem Builder bist). Auf der Einstellungen-Seite musst du gar nicht runterscrollen, da der Seiten-Bereich ganz oben ist. In diesem Bereich findest du ein Dropdown namens Event post page. Wenn der Status deiner Event-Seite auf Öffentlich steht, solltest du ihren Titel in diesem Dropdown sehen, wenn du drauf klickst. Klick auf deine Event-Seite im Dropdown, um sie für die Darstellung von Events zu registrieren.

Jetzt kannst du deine Einstellungen speichern. Deine neleto-Installation ist jetzt bereit, Events anzuzeigen. Wir empfehlen allerdings auch eine Seite zu erstellen, die eine Übersicht über alle deine Events zeigt, was wir im nächsten Abschnitt machen werden.

Erstelle eine Seite zur Anzeige einer Event-Liste

Die einzige Voraussetzung für diese Seite ist, dass sie ein Element mit dem Component Event list braucht.

Erstelle einen Event-Listen-Component

neleto bietet auch für diesen Component eine Vorlage an. Um sie zu nutzen, geh zur Components-Seite in der Admin-Oberfläche und klick wieder auf + Neu aus Vorlage. Du solltest eine Vorlage namens Event list sehen, klick drauf, um sie zu erstellen. Das ist standardmäßig ein sehr simpler Component, er hat nur eine Eigenschaft, in der du die Liste der anzuzeigenden Events festlegen kannst. In der Vorlage gehen wir mit dem {{#each ...}}...{{/each}} Block durch alle Events in dieser Eigenschaft durch und erstellen einen einfachen Link für jedes Event. Der Helper event_path macht aus dem Event einen Link zur Event-Seite, die du in den Einstellungen registriert hast. Du könntest den Component so lassen, aber vielleicht willst du ihn erweitern, um zusätzlich den Titel, Start- und Endzeitpunkt und das Hero-Bild jedes Events anzuzeigen. Wenn du mit dem Bearbeiten des Components fertig bist, klick auf Speichern und schließen.

Den Event-Listen-Component verwenden

Um deinen neuen Event-Listen-Component zu verwenden, erstelle entweder eine neue Seite nur für die Event-Liste oder füge ihn in eine bestehende Seite ein. In beiden Fällen musst du nur zum Elemente-Tab im Pagebuilder wechseln und auf + Element erstellen an der Stelle klicken, wo deine Liste erscheinen soll. Dann wählst du den Component Event list aus und bist im Prinzip fertig. Du kannst jetzt auch die Liste der Events mit den Regeln im Element einschränken, denn standardmäßig zeigt sie jedes Event an, das du erstellst und veröffentlichst.