Inhaltscontainer im Frontend anzeigen lassen

Zuerst aber meldest du dich als Admin in der cloud software an und navigierst dich zu der Seite, auf der du deinen Container verlinken willst. In unserem Beitrag “Inhalte oder Container erstellen und bearbeiten” haben wir einen Shop-Kategorien Container erstellt und den wollen wir jetzt auf unserer Shop-Seite einbauen. Dorthin navigieren wir uns jetzt und gehen in den Designmodus der Seite.

In der Sidebar auf der rechten Seite siehst du dann die verschiedenen Snippets und kannst jetzt nach “Galerien und Container” filtern. Je nachdem, welches Template du hast, kann es sein, dass dir hier andere oder weniger Snippets angezeigt werden. Die Art und Weise, wie du einen Container hinterlegst, ist aber bei allen Snippets gleich.

Zieh dir eines der Snippets auf die Seite und klicke beim Snippet auf den “Bearbeiten”-Button. Hier kannst du jetzt unzählige Einstellungen vornehmen. Fangen wir aber erstmal mit den Wichtigsten an:

Natürlich wählst du zuerst deinen Container aus. Dafür klickst du bei “Container” auf wählen und suchst dir den Container raus, den du verknüpfen willst. Hake das kleine Kästchen vor dem Eintrag an und klicke auf den “Hinzufügen”-Button.

Darüber kannst du nun einstellen, wie viele Inhalte aus dem Container je Seite und Zeile angezeigt werden sollen. Das kannst du später jederzeit ändern, wenn du dich doch nochmal anders entscheiden solltest.

Unter “Erweitert” kannst du dann noch weitere Einstellungen vornehmen. Hier kannst du den Anzeigemodus ändern, für unser Beispiel lassen wir ihn aber erstmal auf “Kacheln”. Du kannst den Modus jederzeit später noch ändern und dich mal ausprobieren, welche verschiedenen Anzeigen es gibt.

Alle Einstellungen, die wir jetzt machen, kannst du später jederzeit über den “Bearbeiten”-Button wieder ändern und Anpassungen vornehmen!

Wir erklären dir jetzt einmal, wofür die wichtigsten Einstellungen da sind:

Maximalanzahl:
Oben hast du ja die Einträge je Seite und Zeile festgelegt. Hier kannst du jetzt aber festlegen, wie viele Einträge generell maximal auf der Seite angezeigt werden sollen. Dieses Feld musst du nicht füllen, wenn du die Gesamtzahl nicht limitieren willst.

Textlänge:
Wenn deine Inhalte im Inhaltscontainer eine Beschreibung haben, wäre das der Text, der hier ausgespielt wird. Du kannst hier angeben, wie lang der Text in der Vorschau sein soll, der angezeigt wird. Wenn du Texte verwendest, solltest du diese möglichst kurz halten und die Anzeige hier möglichst groß, damit der Text auch komplett ausgespielt wird.

Empty Message:
Hier kannst du festlegen, was angezeigt werden soll, wenn kein Inhalt im Container verfügbar ist. Das kann z.B. passieren, wenn du einen Container mit Top-Artikeln hast, du aber eingestellt hast, dass nur verfügbare Artikel angezeigt werden sollen und aktuell alle ausverkauft sind. Dann erscheint diese Nachricht und du kannst sie hier anpassen.

Bildgröße und Bildmodus
Hier kannst du einstellen, wie groß die angezeigten Bilder der Inhalte sein sollen und in welchem Modus sie angezeigt werden sollen. Die Bildgrößte stellst du in Pixel ein, den Bildmodus kannst du, damit alle Bilder die gleiche Größe haben, auf “Proportional (schmalste Kante)” stellen, oder einfach frei lassen.

Paging: Wenn du z.B. einen Container mit mehreren Artikeln hast, aber nicht möchtest, dass diese direkt auf einmal angezeigt werden, kannst du mit dem Paging einstellen, wie die Artikel nachladen sollen. Hier kannst du einen Button einstellen, auf den die Kunden dann zum mehr laden klicken müssen, “endlos” einstellen, dann laden die Artikel so lange nach, bis keine neuen Artikel mehr verfügbar sind oder du machst kein Paging, dann wird nur die Anzahl an Artikeln oder Einträgen angezeigt, die du oben je Seite und je Zeile definiert hast.

Du könntest jetzt noch weitere Einstellungen vornehmen und weitere Container, Jahresplanungen oder auch Kategorien verlinken, aber wir wollen ja für unser Beispiel nur die Shop-Kategorien ausspielen lassen. Klicke also nach allen Einstellungen auf den “Speichern”-Button und schon wird dein Container angezeigt. Anders als bei einer Galerie, kannst du den Container auch schon im Designmodus der Seite sehen. Auch das Speichern der Seite selbst nicht vergessen und die Änderungen veröffentlichen, wenn dein Container im Frontend für den Kunden sichtbar sein soll. Anschließend kannst du dir deinen Container dann auch im Frontend ansehen und schauen, ob alles passt.

Nach dieser Vorgehensweise kannst du auch die anderen Container-Snippets im Designmodus verwenden. Irgendwann wirst du mit den Abläufen vertrauter und wirst merken, dass die Art und Weise die Einstellungen vorzunehmen nahezu immer gleich ist. Wenn man einmal den Dreh raus hat, ist es ein Kinderspiel!

Hier noch einmal alle Schritte für dich im Video: