Versionen im Vergleich

Schlüssel

  • Diese Zeile wurde hinzugefügt.
  • Diese Zeile wurde entfernt.
  • Formatierung wurde geändert.

Boxenbereich

Überblick

Name

contentclass-snippet.gifBoxenbereich

Ordner

folderopen.gifInhalts - Templates

Styleguide

noch nicht vorhanden

Inhaltsverzeichnis

Inhalt
minLevel1
maxLevel4
outlinefalse
stylenone
typelist
printabletrue


1. Einleitung

Wie der Name Bereich sagt, ist das Template “Boxenbereich” zur Aufteilung von einzelnen Inhaltselementen bzw. Boxen bestimmt. Ein Bereich wird nur dann wirksam, wenn sich etwas darin befindet. Ist der Bereich hingegen leer, ist er nicht sichtbar. Inhalte des Boxenbereich sind einzelne Boxen, z. Bsp. verschiedene Teaserboxen oder auch andere zur Verfügung stehende Inhaltselemente sein. Am Häufigsten werden Teaserboxen mit Bild verwendet, weswegen sich die Beschreibungen in diesem Kapitel auch darauf beziehen. Im Abschnitt Weitere Inhaltselemente im Boxenbereich findet sich eine Auflistung aller möglichen Inhaltselemente, welche als Box in einem Boxenbereich platziert werden können sowie die Verlinkung zu den entsprechenden Kapiteln.

Panel
panelIconId1f5a5
panelIcon:desktop:
panelIconText🖥️
bgColor#EAE6FF

2. Verschiedene Darstellungsmöglichkeiten

Darstellung_1.png

2.1 Boxenbereich mit 2 Teaserboxen

Die Anzahl an einzelnen Boxen in einem Boxenbereich kann individuell und den jeweiligen Ansprüchen bestimmt werden. Je nach Seitenaufteilung der gesamten Seite (mit oder ohne Marginalspalte), variiert die Breite der Darstellung.
In der Beispielabbildung ist die Seitenaufteilung “Navigation-Inhalt-Marginalspalte” gewählt.

Info

Siehe dazu Kapitel Auswahl der Seitenaufteilung.

Darstellung_2.png

2.2 Boxenbereich mit 3 Teaserboxen

Der Boxenbereich mit 3 Teaserboxen in voller Seitenbreite bei einer Seitenaufteilung “Navigation-Inhalt breit”. Bei der Größe und Ausrichtung der Boxen kann zwischen einem 2- oder 3 spaltigen Layout gewählt werden.


Info

Siehe dazu Kapitel Auswahl der Seitenaufteilung und Abschnitt Boxengröße.

Darstellung_3.png

2.3 Boxenbereich mit 4 Teaserboxen mit Marginalspalte

Die Abbildung zeigt 4 Teaserboxen in einem Boxenbereich im 2-spaltigen Layout. Je nach Seitenaufteilung der gesamten Seite (mit oder ohne Marginalspalte), variiert die Breite der Darstellung.

Info

Siehe dazu Kapitel Auswahl der Seitenaufteilung, Kapitel7.5 Die Marginalspalte und Abschnitt Boxengröße.


Panel
panelIconId270f
panelIcon:pencil2:
panelIconText✏️
bgColor#FFEBE6

3. Verwendung im SmartEdit

Bei der Verwendung eines Boxenbereichs gibt es zwei Möglichkeiten der Erstellung.

  • Boxenbereich inklusive Inhaltselementen (2 oder 4 Boxen “Teaserbox mit Bild”)
    Erstellen eines Boxenbereich mit einer vorbelegten Anzahl (2 oder 4) an Teaserboxen. In dieser Variante stehen nur die “Teaserboxen mit Bild” zur Verfügung. Es können weitere Boxen im Anschluss manuell hinzugefügt werden.
    Die Anleitung für die schrittweise Erstellung wird im Abschnitt 3.1 Boxenbereich + 2 Boxen (Teaserboxen mit Bild) erklärt.

  • Boxenbereich ohne Inhaltselemente (Boxen)
    Erstellen eines Boxenbereichs ohne Boxen. Die einzelnen Boxen selbst können manuell hinzugefügt werden.
    Die Anleitung für die schrittweise Erstellung wird im Abschnitt 3.2 Boxenbereich ohne Boxen erklärt.

3.1 Erstellen des Seiteninhalts “Boxenbereich + 2 Boxen (Teaserbox mit Bild)”

Schrittweise Erläuterung für die Erstellung eines neuen Seiteninhalts basierend auf der CMS-Vorlage “contentclass-snippet.gifBoxenbereich + 2 Boxen

Symbol

Aktion

1

Seite öffnen

seite_oeffnen_green.png
2icon_reddot_multilink.png

Seiteninhalte

Seiteninhalte_allgemein.png

3AMnu_ConnectNewPage.gif

Seite erstellen & verknüpfen

seite_erstellen_green.png
4folderopen.gif

Content-Klassen Ordner “Inhalts - Templates” auswählen

Hinweis

Das Bildschirmfoto bildet eine allgemeine Darstellung aller Content-Klassen Ordner ab. Kann ggf. abweichen.

Content_Klassen-Ordner.png
5contentclass-snippet.gif

Content-Klasse “Boxenbereich + 2 Boxen” auswählen

  • individuelle Auswahl eines Boxenbereich mit 2 oder 4 einzelnen Boxen

Hinweis

Das Bildschirmfoto bildet eine allgemeine Darstellung von Content-Klassen ab. Kann ggf. abweichen.

Content_Klassen.png
6

Es erscheint ein Dialogfenster mit einem aus der Content-Klasse generierten Seitennamen, der mit der späteren Überschrift des neuen Seiteninhalts belegt werden sollte.
Diese Überschrift wird nicht auf der erstellten Seite angezeigt. Sie dient als CMS-interne Überschrift.

überschrift_seite_green.png
7

Mit “OK” bestätigen

ok_green.png
8

Darstellung nach Erstellung “Boxenbereich + 2 Boxen

Die Abbildung zeigt das Beispiel mit 2 Akkordeoneinträgen.

Darstellung_erstellen_Boxenbereich.png

3.1.1 Bearbeiten des Seiteninhalts “Boxenbereich mit 2 Boxen”

Schrittweise Erläuterung für das Bearbeiten eines neuen Seiteninhalts basierend auf der CMS-Vorlage “contentclass-snippet.gif Boxenbereich + 2 Boxen”.

Darstellung nach erstellen des Boxenbereich. Der Boxenbereich ist zur Bearbeitung geöffnet.

Darstellung_erstellen_Boxenbereich_zoom.png

Bezeichnung

Beschreibung

icon_reddot_openpage (1).png Boxenbereich öffnen

Seiteninhalt zur Bearbeitung öffnen

icon_reddot_closepage (1).png Boxenbereich schließen

Bearbeitung beenden

icon_reddot.png Boxengröße (derzeit 2 nebeneinander)

Auswahl der Anordnung der einzelnen Boxen. Es kann zwischen “2 nebeneinander” oder “3 nebeneinander” gewählt werden. In der Voreinstellung jedes Boxenbereichs sind bereits “2 nebeneinander” eingestellt.

icon_reddot.png Boxenhöhe

Angleichen der Höhe der Boxen

icon_reddot_openpage.png Teaserbox mit Bild öffnen

einzelne Teaserbox zur weiteren Bearbeitung öffnen

Das Bearbeiten der Box wird im Abschnitt 3.1.2 Teaserbox mit Bild bearbeiten erklärt.

icon_reddot_openpage.png Link öffnen

Anlegen eines Links zu einer internen/externen Seite (optional)

3.1.2 Bearbeiten Teaserbox mit Bild

Schrittweise Erläuterung für das Bearbeiten eines neuen Seiteninhalts basierend auf der CMS-Vorlage “contentclass-snippet.gif Teaserbox mit Bild”.


Bearbeiten_Teaserbox_Bild.png

Bezeichnung

Beschreibung

icon_reddot_openpage (1).png Boxenbereich öffnen

Seiteninhalt zur Bearbeitung öffnen

icon_reddot_closepage.pngTeaserbox mit Bild schließen

Bearbeitung beenden

icon_reddot.pngÜberschrift

Einfügen einer Überschrift

icon_reddot_obligatory.pngBild

Einfügen eines Bildes. Die Auswahl eines Bildes erfolgt über den Asset Manager.

Siehe dazu Kapitel 8. »Asset-Manager« - Die Bild-und PDF-Verwaltung des zCMS

Hinweis.pngWie bearbeite ich Alt-texte, Bild-Titel und Bild-Rechte?

Siehe dazu Kapitel 7.6.1.2 Bild und Asset-Attribute

icon_reddot (1).pngSeite für andere Projekte freigeben

Siehe dazu Kapitel 7.10 Projektfremde Seite verknüpfen

icon_reddot_openpage (1).pngLink öffnen

Link bearbeiten

Siehe dazu Kapitel Linkliste

Darstellung nach Bearbeiten der Boxen

Darstellung_nach_Bearbeiten_Box_Bild.png

Darstellung nach Bearbeiten Boxen in der Seitenvorschau.

Darstellung_1.png
Info

In der Darstellung Abbildung 2 wurden bereits beide “Teaserboxen mit Bild” bearbeitet.


3.2 Erstellen des Seiteninhalts “Boxenbereich” ohne Boxen

Symbol

Aktion

1

Seite öffnen

Seite_oeffnen.png
2icon_reddot_multilink.png

Seiteninhalte

Seiteninhalte_allgemein.png
3AMnu_ConnectNewPage.gif

Seite erstellen & verknüpfen

seite_erstellen_green.png
4folderopen.gif

Content-Klassen Ordner “Inhalts - Templates” auswählen

Hinweis

Das Bildschirmfoto bildet eine allgemeine Darstellung aller Content-Klassen Ordner ab. Kann ggf. abweichen.

Content_Klassen-Ordner.png
5contentclass-snippet.gif

Content-Klasse “Boxenbereich” auswählen

Hinweis

Das Bildschirmfoto bildet eine allgemeine Darstellung von Content-Klassen ab. Kann ggf. abweichen.

Content_Klassen.png
6

Es erscheint ein Dialogfenster mit einem aus der Content-Klasse generierten Seitennamen, der mit der späteren Überschrift des neuen Seiteninhalts belegt werden sollte.
Diese Überschrift wird nicht auf der erstellten Seite angezeigt. Sie dient als CMS-interne Überschrift.

überschrift_seite_green.png
7

Mit “OK” bestätigen

ok_green.png
8

Ansicht nach erstellen eines Boxenbereichs. Der Boxenbreich ist zur weiteren Bearbeitung geöffnet.

Nun können einzelne Boxen hinzugefügt werden.
Siehe 3.3.1 Teaserboxen hinzufügen

Erstellen_Boxenbereich_ohne_Boxen.png

3.2.1 Bearbeiten des Seiteninhalts “Boxenbereich” ohne Boxen

Schrittweise Erläuterung für das Bearbeiten eines neuen Seiteninhalts basierend auf der CMS-Vorlage “contentclass-snippet.gif Boxenbereich”.

Darstellung nach erstellen eines Boxenbereichs. Der Boxenbereich ist zur weiteren Bearbeitung geöffnet.

Erstellen_Boxenbereich_ohne_Boxen.png

Bezeichnung

Beschreibung

icon_reddot_openpage (1).png Boxenbereich öffnen

Seiteninhalt zur Bearbeitung öffnen

icon_reddot_closepage.pngBoxenbereich schließen

Bearbeitung beenden

icon_reddot_multilink (1).pngBoxen

Einzelne Boxen hinzufügen, sortieren und/oder entfernen

icon_reddot.pngBoxengröße

Auswahl der Anordnung der einzelnen Boxen. Es kann zwischen “2 nebeneinander” oder “3 nebeneinander” gewählt werden. In der Voreinstellung jedes Boxenbereichs sind bereits “2 nebeneinander” eingestellt.

icon_reddot.pngBoxenhöhe

Angleichen der Höhe der Boxen

3.

3 Boxen 3.3.1

2.2 Boxen hinzufügen

Symbol

Aktion

1icon_reddot_multilink.png

Akkordeoneinträge

Akkordeoneintraege.png
2AMnu_ConnectNewPage.gif

Seite erstellen & verknüpfen

Hinweis

Es wird ein einzelner Akkordeoneintrag erstellt. Dieser Vorgang muss je nach benötigter Anzahl an Akkordeoneinträgen wiederholt werden.

seite_erstellen_green.png
3

Es erscheint ein Dialogfenster mit einem aus der Content-Klasse generierten Seitennamen, der mit der späteren Überschrift des neuen Seiteninhalts belegt werden sollte.
Diese Überschrift wird nicht auf der erstellten Seite angezeigt. Sie dient als CMS-interne Überschrift.

überschrift_seite_green.png
4

Mit “OK” bestätigen

ok_green.png
5

Darstellung nach Erstellung eines Akkordeoneintrags.

Eintrag hinzufuegen_Darstellung.png

3.3.2 Teaserboxen bearbeiten

In diesem Abschnitt wird die inhaltliche Bearbeitung eines Akkordeoneintrages, wie das Hinzufügen von Überschriften und Inhalten beschrieben.

Eintrag hinzufuegen_Darstellung.png

Bezeichnung

Beschreibung

icon_reddot_openpage (1).png Akkordeon öffnen

Seiteninhalt zur Bearbeitung öffnen

icon_reddot_closepage (1).png Akkordeoneintrag schließen

Bearbeitung beenden

icon_reddot (1).png Überschrift

Erstellen der Überschrift für den Akkordeoneintrag

icon_reddot.png Text

Inhaltsbearbeitung des Akkordeoneintrages mit Hilfe des Text-Editor. Hier können die Inhalte (z.Bsp. Texte, Tabellen und/oder Grafiken) platziert werden. Das Arbeiten mit dem Text-Editor wird im Abschnitt “Text bearbeiten - Der Texteditor” beschrieben.

icon_reddot_multilink (1).png Akkordeoninhalte

Hier können innerhalb eines Akkordeoneintrages weitere Seiteninhalte hinzugefügt sortiert oder entfernt werden. So kann ein Akkordeoneintrag mehrere, verschiedene Seiteninhalte enthalten, wie z. Bsp. Verweislisten, Bilder / Bildergalerien oder YouTube-Videos.

Darstellung nach Bearbeiten der Teaserbox.

Eintrag_Inhalt bearbeitet.png

Darstellung nach Bearbeiten einer Teaserbox in der Seitenvorschau.

Beispel_Darstellung_Ueberschrift_Inhalt_Seitenvorschau.png

3.3.3 Teaserboxen sortieren

In diesem Abschnitt wird erklärt, wie einzelne Seiteninhalte sortiert werden können. Da dieser Bearbeitungsschritt bei vielen Seiteninhalten gleich ist, ist die detaillierte Beschreibung im Kapitel 7.8 Sortieren von Seiteninhalten zu finden.

Symbol

Aktion

1icon_reddot_openpage.png

Akkordeon öffnen

Akkordeon_oeffnen.png
2icon_reddot_multilink.png

Akkordeoneinträge

3

Die weiteren Bearbeitungsschritte sind im Kapitel 7.8 Sortieren von Seiteninhalten ab Punkt 2 beschrieben.

Akkordeoneintraege_2_sortieren_entfernen.png

3.3.4 Teaserboxen entfernen

In diesem Abschnitt wird erklärt, wie einzelne Seiteninhalte entfernt werden können. Da dieser Bearbeitungsschritt bei vielen Seiteninhalten gleich ist, ist die detaillierte Beschreibung im Kapitel 7.9 Entfernen von Seiteninhalten zu finden.

Symbol

Aktion

1icon_reddot_openpage.png

Akkordeon öffnen

Akkordeoneintraege_2_sortieren_entfernen.png

2icon_reddot_multilink.png

Akkordeoneinträge

Akkordeoneintraege_2_sortieren_entfernen.png
3

Die weiteren Bearbeitungsschritte sind im Kapitel 7.8 Sortieren von Seiteninhalten ab Punkt 2 beschrieben.


Panel
panelIconId1f50d
panelIcon:mag:
panelIconText🔍
bgColor#E3FCEF

4. Häufig gestellte Fragen (FAQ)

Frage

Antwort

Wofür steht in der Wiki-Beschreibung das x innerhalb von “Akkordeon + xEinträge”?

Das x steht für die Auswahlmöglichkeiten 2 bis 5 Akoordeoneinträge.