Collections

Eine Collection stellt die Sammlung mehrerer Einträge dar und ermöglicht so Vorlagen für Unterseiten mit immer gleicher Struktur zu erstellen. Beliebte Beispiele sind der Blog, Stellen- oder Immobilienangebote. Wie du Collections nutzt, zeigen wir dir in diesem Artikel.

Basiswissen

Eine Collection wie z. B. ein Blog besteht aus 4 Teilen:

1. Die Collection, die den Namen und die Struktur (Felder) aller Einträge vorgibt, z. B. Titel, Beitragsname, Datum, etc.
2. Die Einträge, die den jeweiligen Content (Inhalt) enthalten
3. Der Collection Container, der die Vorschau organisiert
4. Die Collection Vorlage, die das einheitliche Design der einzelnen Eintragseiten regelt

Eine Collection hinzufügen

Starte am Besten mit einer Collection, in du sie zu deiner Website hinzufügst:

1. Klicke im Website Builder im oberen Menü rechts auf "Mehr". Es öffnet sich ein Dropdown-Menü.
2. Klicke auf "Collections Manager".





3. Jetzt öffnet sich der neue Collections-Manager in einem neuen Tab im Website Builder. Links im Panel findest du die Listen-Übersicht über alle deine Collections, die du für deine Seite angelegt hast. 
4. Über das "+" (Plus) Icon kannst du eine neue Collection anlegen. Benenne deine neue Collection und speichere sie, um die Collection anlegen zu lassen. Für dieses Beispiel arbeiten wir mit der Vorlage Evergreen und Plesk, die bereits eine vordefinierte Collection hat, um dir den Einstieg zu erleichtern.



5. Wenn du die Collection gespeichert hast, wird diese jetzt links in der Liste angezeigt.





6. Mit einem Klick auf die Collection öffnet sich im rechten Bereich für dich deine Verwaltung für diese Collection. Neben Content, findest du hier außerdem das Layout und die Daten-Felder. 
   Unter Content findest du eine Liste aller Collection-Einträge, die du in dieser Collection hast. Benutzt du eine Vorlage oder eine Website, die schon eine Collection hat, findest du hier, wie im Beispiel, schon eine Liste von Beispiel-Einträgen.
   
   

   

   Unter Layout findest du zum einen eine Übersicht über alle Orte auf deiner Website, auf denen die Collection eingebunden ist. Zum anderen hast du hierüber Zugang zum Einzelseiten-Layout, in dem du festlegen kannst, wie der einzelne Collection-Eintrag auszusehen hat. 

   

   Unter Daten-Felder findest du die einzelnen Felder, die du in deinem Collection-Eintrag benutzen möchtest. Standardmäßig beinhalten deine Einträge "nur" die beiden Felder "Name" und "Slug". Du kannst nun weitere Felder hinzufügen. Im Screenshot siehst du die Collection aus dem Template "Evergreen".



7. Möchtest du vorher gern ein Beispiel mit Einträgen sehen, um dich mit Collections vertraut zu machen, schau dir unsere Templates wie Pesk, Evergreen, Ashop oder Opus an. Dort sind jeweils eine Collection eingefügt. Du kannst hier zum Beispiel eine neue Seite zum Testen anlegen mit diesen Collections.

Eine Collection duplizieren

Sofern du schon eine Collection erstellt hast, ist es außerdem möglich diese im Collection Manager zu duplizieren. Dadurch werden die Daten-Felder, das Einzelseiten-Layout und, sofern vorhanden, auch der Inhalt der Collection dupliziert. Bitte hover über die entsprechende Collection, die du duplizieren möchtest. Es öffnet sich ein Dropdown-Menü. Hier ist es möglich die Collection umzubenennen, zu löschen oder eben zu duplizieren.

Import / Export einer Collection oder Blogbeiträge

Es ist möglich, eine Collection zu importieren. Erstelle dafür bitte eine neue Collection und importiere eine andere Collection (zum Beispiel aus WordPress oder einer anderen Website) mit einer *.csv-Datei in die neue Collection. Hier empfehlen wir, dass sowohl die Collection, als auch die CSV-Datei im Vorfeld die gleichen Werte für die Datenfelder besitzt. Es ist allerdings beim Import nur möglich, Text zu importieren!

Über den Collections Manager hast du die Möglichkeiter über Content, am rechten Rand ein Dropdown zu öffnen. Hier gibt es die Option "Import".

Hier findest du auch die Möglichkeit deine Collection als *.csv und als JSON zu exportieren. 

Collection-Auflistung

Für jede einzelne Collection findest du unter Layout → Collection-Auflistung ein Liste aller Standorte deiner Collection. Hier findest du auch die unterschiedlichen Sprachen, solltest du mit mehrsprachigen Collections arbeiten. 

Du hast hier eine Übersicht und kannst direkt aus dem Collection-Manager heraus zum Container auf deiner Website, um die Collection dort zu bearbeiten. Die Auflistung beinhaltet außerdem weitere Informationen, falls du eine mehrsprachige Website verwaltest. 

Das Einzelseiten-Layout - deine Collection Vorlage

Das Einzelseiten-Layout definiert das einheitliche Design aller Collection-Einträge. Hier kannst du festlegen, wie dein einzelner Beitrag aussehen soll, wenn ein Besucher auf deiner Website auf den Eintrag klickt. Du kannst das Einzelseiten-Layout über Layout -> Einzelseiten Layout aufrufen.

Hier hast du einen Überblick über die Vorlagen nach Sprache sortiert und kannst aus der Übersicht heraus das Layout aufrufen. Hier legst du außerdem den Namen und die URL für das Layout fest. Hast du die Collection Vorlage aufgerufen, öffnet sich ein neuer Tab im Website Builder. 

Du kannst jetzt das Einzelseiten-Layout wie jede andere Seite im Editor bearbeiten. Zusätzlich stehen dir nun alle Collection-Felder zur Verfügung um diese zu verlinken.

Du erkennst an dem Collection-Symbol eines Element, ob dieses Element einem Collection Element zugeordnet ist und somit "dynamisch" ist oder "statisch". 

Beispiel: Wenn du deinen Header (oder nur dein Menü / deine Navigation) und Footer von der Website in jedem Eintrag sehen möchtest, erstelle in der Vorlage einfach eine Referenz dieser Elemente. 

Es ist nun möglich für jeden deiner Einträge die Überschrift und den Inhalt anzupassen. Füge bitte für die Überschrift ein entsprechendes Element hinzu und verknüpfe es mit dem entsprechenden Collection-Feld. Wenn du zum Beispiel Content hinzufügen möchtest, der statisch bleiben soll, weise dem Element kein Collection-Feld zu, stattdessen belasse es auf "Keine Zuordnung. Inhalt bleibt statisch".

Felder

Felder halten in einem standardisierten Format bestimmte Informationen und Daten zum jeweiligen Eintrag bereit. Diese Felder kannst du entweder im Eintrag selbst oder im "Collection Container" ähnlich wie Databindings verwenden. Zu jedem Eintrag wird automatisiert aus der "Collection-Vorlage" und den Feldern eine eigene Seite erstellt.

Verfügbare Felder

Standardmäßig werden in Collections zwei Felder angelegt:

• Der Name ist der Titel des Eintrags
• Slug ist ein menschen und suchmaschinenfreundlicher Teil der URL der genutzt wird, um den jeweiligen Post zu identifizieren und wird automatisch aus dem Namen generiert, kann aber auch angepasst werden

Du kannst weitere Felder hinzufügen indem du auf "+Feld Hinzufügen" klickst. 

Es öffnet sich nun ein Feld, in dem du Typ, Label und deinen Hilfetext eintragen kannst. Um ein neues Feld zu definieren kannst du aus verschiedenen Feldtypen wählen:

• Textfeld oder Richtext kann für alle möglichen Arten von Texten verwendet werden
• CMS bietet dir die Möglichkeit einzelne Sitejet-Elemente, -Presets oder ganze Seiten einzubinden
• Dateien ermöglicht dir die Verbindung zu Dateien im Media Manager
• Checkbox lässt dich zwischen den beiden Status "geprüft" und "nicht geprüft" wählen. Du kannst dies z.B. später für die Checkbocs "veröffentlicht" und "unveröffentlicht" als Filter verwenden.
• Auswahl gibt dir die Möglichkeit ein Dropdown-Auswahlmenü zu erstellen.
• Datum gibt dir die Möglichkeit zum Beispiel ein Datum einzutragen, wann der Artikel geschrieben wurde.
• Nummer gibt dir als Sortierungsmöglichkeit zum Beispiel die Sortierung nach Zahlen

Im Eingabefeld " Label" trägst du den Namen des Felds ein. Sobald du dich für einen Typ entschieden hast, wird dir ein weiteres Eingabefeld "Hilfetext" angezeigt. Gib hier eine kurze Beschreibung des Feldes an, damit deine Kollegen, dein Kunde oder auch du, nachdem du längere Zeit keinen Eintrag mehr erstellt hast, weißt, wofür dieses Feld gedacht war.

Collection Container

Ein "Collection Container" ist das Element, indem eine Vorschau der Collection Einträge angezeigt wird. Quasi der Ort, wo dein Blog auf der Website sein soll, oder die Immobilien-Einträge oder die Jobangebote. In den Einstellungen hast du die Möglichkeit, Vorgaben zu Sortier- und Filterfunktionen zu machen. Einem "Collection Container" kann immer nur eine Collection zugewiesen werden. Sogenannte Querverweise zwischen zwei Collections ist aktuell nicht möglich. 

Möchtest du den Inhalt der Collection an mehreren Stellen auf deiner Website anzeigen, kannst du mehrere Collection Container mit der gleichen Collection verknüpfen oder den bereits hinzugefügten Collection Container duplizieren. 

Den Collection Container fügst du folgendermaßen auf deiner Seite ein:

1. Im linken Content Panel klickst du bitte auf Collections. 
2. Hier findest du alle Elemente und Presets zur Collection. Klicke bitte auf den Collection-Container. 
3. Ziehe den Collection Container bitte jetzt an die Stelle in deiner Website, wo du die Vorschau angezeigt haben möchtest. 

   

4. Nachdem du einen Collection-Container zur Website hinzugefügt hast, ist es jetzt möglich eine Collection dort zuzuweisen, die Styles anzupassen und weitere Filter und Einstellungen vorzunehmen. 
   

   

5. Nachdem du einen den Container zur Website hinzugefügt haben, musst du jetzt festlegen, welche Inhalte angezeigt werden sollen und wie sie angezeigt werden sollen. Diese Einstellungen sind jederzeit möglich und passen sich sofort an. 

   

6. Wähle zum Beispiel ein Bildelement, eine Überschrift 2 und 4 und Textfelder aus. Nun kannst du festlegen, welche Inhalte aus deiner Collection dort angezeigt werden sollen

   

Neue Einträge erstellen

Um neue Einträge zu erstellen, gehe im Collection Manager in die Collection, für die neue Inhalte erstellen möchtest. Klicke nun auf "Eintrag hinzufügen". Es öffnet sich ein Overlay, der die eine Übersicht aller zugewiesenen Felder zeigt. Diese kannst du nun entsprechend deiner Wünsche mit Inhalt füllen. 

Klicke auf "Speichern", sobald du mit deinen Änderungen fertig bist. 

Über "Felder" kannst du direkt aus dem Collection-Eintrag auf deine Felder zugreifen und diese ggf. anpassen oder neue erstellen. Diese werden dann allerdings für alle Einträge in dieser Collection erstellt. 

Unter " Vorschau" gelangst zu zu einer Ansicht auf vorhandene Einträge und deren Inhalt. Dabei kannst du festlegen, welche Informationen angezeigt werde sollen und welche erst auf der jeweiligen Eintragsseite angezeigt werden. Die Vorschauansicht wird wie bereits angesprochen mit einem Collection Container ermöglicht. Wie dieser eingefügt wird, haben wir im Abschnitt "Collection Container" bereits angesprochen

Mit "Speichern" speicherst du offensichtlich deinen Fortschritt in dem Collection-Eintrag. Diese Funktion ersetzt aber nicht die globale Speicherfunktion!

Klickst du auf "Einstellungen", wirst du im Overlay zu den SEO-Einstellungen, sowie weiterer wichtiger Einstellungen geführt.

Vorschau

Die Vorschauansicht zeigt eine Vorschau der vorhandenen Artikel und deren Inhalte. Hier kannst du festlegen, welche Informationen in der Vorschau und welche nur auf der jeweiligen Artikelseite angezeigt werden sollen. 

Wenn du zum Beispiel eine Collection mit Stellenangeboten hast, kannst du hier festlegen, dass im Collection-Container eine Liste der Stellenbezeichnungen (ohne Stellenbeschreibungen) angezeigt wird, auf der Artikelseite jedoch alle Felddaten (einschließlich Stellenbezeichnung und -beschreibung) erscheinen sollen.

Wie bereits erwähnt, wird die Vorschauansicht durch einen Collection-Container ermöglicht. Wie dieser eingefügt wird, wurde bereits oben im Abschnitt "Collection Container" erwähnt.

Werde ein Teil unserer Community!

Tausche dich mit anderen Webdesignern über aktuelle Entwicklungen, Tipps und Tricks aus und präsentiere deine Lieblingsseiten. Hole dir Feedback und sprich mit uns über Funktionen, die du dir für Sitejet wünschst. Hier gelangst du direkt zur Sitejetters Community.

Zurück zum Anfang