CMS Tutorial (Content Management System)

Struktureller Aufbau Basis-Ebenen/Elemente	Buttons designen Hauptnavigation
Default-Anordnung der Basis-Elemente	Buttons designen Subnavigation
Der Contentbereich	Das Modul-Panel
Der Contentbereich mit Subnavigation	Der Texteditor
Das Flex Modul	Ihre Frage wurde im Tutorial nicht beantwortet? Wir helfen Ihnen weiter!


Struktureller Aufbau der Basis-Ebenen/Elemente	Top

Der Aufbau ist - vergleichbar mit Photoshop - in Ebenen angelegt. Alle Ebenen sind fix definiert, Ausnahme hierbei bildet das Flex-Modul, es kann im Vordergrund, Hintergrund oder in Zwischenebenen positioniert werden und bietet daher eine enorme Gestaltungsfreiheit.

Die Breite der Website ist beim Anlegen der Site zu definieren und kann danach nicht geändert werden. Hier stehen 2 Varianten zur Auswahl:

b= 980px (maximale Breite bei Auflösung 1024x768px)

b=760px

	h = variabel
	alle Elemente sind zentriert und können als .jpg, .gif oder .png eingebettet werden
	es können in Header, "Logobereich" und Background komplette Images oder Slices (z.B. 3-5px Streifen) hochgeladen und sowohl entlang der x-Achse als auch entlang der y-Achse wiederholt werden
	ein Backgroundimage wird unter den Header geschoben, daher muss diese Höhe bei der Erstellung mit eingerechnet werden
	die Bereiche links und rechts von der Navigation können mit einem Slice gestaltet werden
	Flex-Module sind frei positionierbare Module, sie enthalten den so genannten Text-Editor (CK-Editor) und können dreidimensional entlang der X- Y- und Z-Achse (vgl. Ebenen im Photoshop) angeordnet werden.


Default-Anordnung der Basis-Elemente	Top

	die Höhe des Headers ist definierbar, die Breite unbegrenzt
	die Höhe des Logobereichs orientiert sich an der Höhe des Headers; die Breite = 760px oder 980px
	die Hauptnavigation beginnt an der Unterkante des Headers und ist mit Pluswerten nach unten und mit Minuswerten nach oben verschiebbar
	die Subnavigation kann vertikal positioniert werden, auch der Abstand zwischen den einzelnen Navigationspunkten kann bestimmt werden - pixelgenau


Der Contentbereich	Top

	um den Hintergrund, oder den Rand des Contents zu gestalten kann ein .jpg, .png oder .gif eingebettet werden, dieses wiederholt sich automatisch vertikal
	Sie können auch einen vertikalen Slice (z.B. 3-5px Streifen) einbetten, dies empfiehlt sich z.B. wenn man dem Content links und rechts einen Rand oder Verlauf geben möchte
	Der Contentbereich ohne Subnavigation kann die maximale Breite ausfüllen, daher ist die Breite mit entweder 720px oder 940px (je nachdem ob die Seite als eine 760px breite Seite oder eine 980px breite Seite angelegt wurde) festgelegt.


Der Contentbereich mit Subnavigation	Top

	diese Contentausprägung verhält sich wie oberhalb
	Durch die Verdrängung des Contenbereichs durch die Subnavigation ergibt sich eine Breite von entweder 630px oder 760px (je nachdem ob die Seite als eine 760px breite Seite oder eine 980px breite Seite angelegt wurde)


Das Flex Modul	Top

Das Flex-Modul bietet DesignerInnen (aber auch RedakteurInnen) die maximale Freiheit. Es kann via Drag & Drop an jede beliebige Position gesetzt und beliebig oft verwendet werden, wobei Größe und Form variabel sind. Zusätzlich können Flex-Module entlang der y-Achse (vgl. Ebenen im Photoshop) angeordnet werden. Es bietet sämtliche Möglichkeiten des Text-Editors (CK-Editor).


Buttons designen Hauptnavigation	Top

DesignerCMS bietet die Möglichkeit im CMS beliebig viele Navigationspunkte anzulegen. Das Button-Design wird einmalig erstellt und via Uploadfeld in das System eingespielt, die Breite der Buttons kann eingestellt werden bzw. wird vom System automatisch angepasst.

Die Button-Breite beträgt: 300px (wird ggf. vom System verlängert oder gekürzt)

Grundsätzlich kann zwischen 2 Arten von Buttons unterschieden werden:

alle Buttons sind gleich designt:

hier müssen 2 Buttons angelegt werden (aktiver und inaktiver Zustand)

die Rand-Buttons haben ein eigenes Design:

hierfür müssen 6 Buttons designt werden: rechter Button - Button(s) Mitte - linker Button, immer in aktivem und inaktivem Zustand


Buttons designen Subnavigation	Top

Das Designen der Subnavigation verhält sich genauso wie das der Hauptnavigation.

Die Button-Breite beträgt: 180px


Das Modul-Panel	Top

DesignerCMS ist modular aufgebaut, sämtliche Module (z.B. Text, Galerie, Formular, Newsletter, etc.) können beliebig oft via Drag & Drop an die gewünschte Position gezogen bzw. verschoben werden. Über das Panel stehen unterschiedliche Funktionen zur Verfügung, so kann z.B. ein Text-Modul, nachdem die Contentausprägung im Editormodus designt wurde, als Vorlage (Template) abgespeichert werden, sodass - sollte der/die UserIn diese Art der Contentausprägung nochmals verwenden wollen - das vorgefertigte Modul einfach an die gewünschte Position gezogen werden kann. In weiterer Folge kann im Editormodus der Inhalt angepasst werden.


Der Texteditor	Top

Der Texteditor ist im DesignerCMS als eigenes Modul an jeder beliebigen Position einsetzbar. Es ist wohl das am häufigsten verwendete Modul, da es eine Vielzahl an Funktionen beinhaltet und somit eine enorme Gestaltungsvielfalt ermöglicht. Der Texteditor ist in jedem Flex-Modul enthalten.

	Texte (Überschriften, Überschriften 2, Teasertexte, Copytexte etc.) erstellen, editieren, löschen
	Bilder eingetten
	Flash und Movies einbetten
	interne/externe Links setzen
	Tabellen einfügen
	Anker setzen
	Downloads zur Verfügung stellen
	html-Elemente einbetten
	Quellcode bearbeiten

Struktureller Aufbau der Basis-Ebenen/Elemente

Default-Anordnung der Basis-Elemente

Der Contentbereich

Der Contentbereich mit Subnavigation

Das Flex Modul

Buttons designen Hauptnavigation

Buttons designen Subnavigation

Das Modul-Panel

Der Texteditor