Unten siehst du eine Darstellung aller Elemente, die in einem Design vorhanden sein können. Im Gegensatz zu anderen Baukästen entscheidest du selbst, welche Elemente bzw. Bereiche du verwenden willst. Unsere Designvorlagen sind nur Vorschläge und keine fest programmierten Vorlagen. Du kannst bis auf den Inhaltsbereich und die Navigation alle Bereiche ausblenden.
Layoutbereich oder Inhaltsbereich
Der Inhaltsbereich ist immer sichtbar und daher auch nicht als Element verfügbar. Alle Inhalte deiner Webseite werden in diesem Bereich angezeigt, ausgenommen die Inhalte, welche du für die Sidebar vorgesehen hast oder die Inhalte, welche du auf einem Header oder Footer platzierst. Jede Seite hat einen eigenen Inhaltsbereich, sodass die Inhalte im Gegensatz zur Sidebar und zum Header bzw. Footer immer nur auf der jeweiligen Seite sichtbar sind.
Der Inhaltsbereich ist bei kostenlosen Seiten immer einspaltig. Bei einer Kaufversion gibt es einen extra Menüpunkt mit dem man diesen Bereich in Spalten und Reihen aufteilen kann.
Wenn du keine Struktur mit Streifen verwendest, dann gibt es einen übergeordneten Bereich, der das gesamte Layout einschließt, also den Inhalt, die Navigation, die Sidebars und Kopf und Fußbereich. Diesen Außenbereich oder Container kannst du nutzen und auch mit der Maus über ein Menü aufrufen um zum Beispiel, um deine ganze Seite mit einem Rahmen oder einem Schatten zu umgeben.
Navigationsbereich und Navigation
Auch der Navigationsbereich muss immer vorhanden sein, sonst bist du nicht in der Lage die einzelnen Seiten deiner Homepage im Browser aufzurufen. Allerdings gibt es einige Besonderheiten. Wenn du eine Navigation in einem Header platzierst, dann hat die Navigation dort keinen eigenen Bereich mehr, den man gestalten kann. Die Navigation hat dann immer einen durchsichtigen Hintergrund. Auch eine Navigation, die du in einer Sidebar anlegst, hat keinen eigenen Bereich, sondern ist in einem durchsichtigen Feld eingebaut. Du kannst zwischen zwei Navigationstypen wählen: einer horizontalen und einer vertikalen Navigation. Bei page4 bist du außerdem in der Lage, eine Kombination dieser beiden Typen zu verwenden. Das System regelt die Verteilung der Seiten automatisch.
Wenn die Navigation außerhalb eines Headers platziert ist, kannst du den Bereich ganz normal mit einem Hintergrundbild, einer Farbe und auch mit einem Rahmen versehen und Abstände festlegen. Die Höhe wird allerdings immer durch das eingefügte Navigationstemplate bestimmt und kann mit Hilfe des Options-Dialoges der Navigation in gewissem Rahmen verändert werden.
Header oder Kopfbereiche
Header dienen dazu, den Kopfbereich deiner Webseite zu gestalten. Ein Header kann eine bestimmte Höhe einnehmen und entweder leer sein (ohne Hintergrundfarbe bzw. Bild) oder eine Hintergrundfarbe enthalten oder/und ein Bild. Wenn du ein Bild verwendest, dann wird beim Anzeigen deiner Webseite je nach Browser, Rechnerleistung und Internetgeschwindigkeit mehr oder weniger lang zuerst die Hintergrundfarbe gezeigt, bevor das Bild geladen ist und dargestellt wird. Es macht daher durchaus Sinn, bei der Verwendung eines Bildes entweder keine Hintergrundfarbe zu verwenden (dann wird die Farbe vom Browserhintergrund genutzt) oder eine Farbe zu wählen, die im Bild vorhanden ist.
Wenn du eine Hintergrundfarbe verwendest und statt eines Bildes eine durchsichtige Kachel benutzt, um den Header auszufüllen, kannst du interessante Effekte erzielen. Das Bild für den Header kann auf verschiedene Weise in den Kopfbreich eingebunden werden.
Auf einem Headerbild oder -hintergrund kann man verschiedene Elemente platzieren. In der kostenlosen Version kann man einen Textblock anzeigen. In den Kaufversionen beliebig viele Textblöcke, beliebig viele Bilder und eine Slideshow mit bis zu 10 Bildern.
Insgesamt kann man drei Header verwenden. Das ermöglicht eine optimale Gestaltung und erlaubt es, eine horizontale Navigation an verschiedenen Stellen zu platzieren.
Header können komplett ausgeschaltet werden. Befindet sich die Navigation in einem Header wird sie automatisch neu und in einem eigenen Bereich platziert, wenn der Header ausgeblendet wird.
Footer oder Fußbereiche
Footer dienen dazu, den Fußbereich deiner Webseite zu gestalten. Ein Footer kann eine bestimmte Höhe einnehmen und entweder leer sein (ohne Hintergrundfarbe oder Bild) oder eine Hintergrundfarbe enthalten oder/und ein Bild. Wenn du ein Bild verwendest, dann wird beim Anzeigen deiner Webseite je nach Browser, Rechnerleistung und Internetgeschwindigkeit mehr oder weniger lang zuerst die Hintergrundfarbe gezeigt bevor das Bild geladen ist und dargestellt wird. Es macht daher durchaus Sinn, bei der Verwendung eines Bildes entweder keine Hintergrundfarbe zu verwenden (dann wird die Farbe vom Browserhintergrund genutzt) oder eine Farbe zu wählen, die im Bild vorhanden ist.
Wenn du eine Hintergrundfarbe verwendest und statt eines Bildes eine durchsichtige Kachel benutzt um den Footer auszufüllen kannst du interessante Effekte erzielen. Das Bild für den Footer kann auf verschiedene Weise in den Footerbereich eingebunden werden.
Auf einem Footerbild oder -hintergrund kann man verschiedene Elemente platzieren. In der kostenlosen Version kann man einen Textblock anzeigen, in den Kaufversionen beliebig viele Textblöcke, beliebig viele Bilder und eine Slideshow mit bis zu 10 Bildern. Wird im Header eine Slideshow benutzt, kann diese nicht mehr im Footer verwendet werden und umgekehrt.
Insgesamt kann man drei Footer verwenden. Footer können komplett ausgeschaltet werden. Aus Kompatibilitätsgründen ist der Footer 1 reserviert für alte Designvorlagen. Wenn du den Footer 1 anschaltest und du hast HTML Code für die Fußzeile hinterlegt (eine Funktion bei alten Designvorlagen), dann wird dieser Code im Footer 1 angezeigt. Daher kann man auf diesen Footer keine Inhalte platzieren. Die Nummerierung der Footer hat keine Bedeutung für die Platzierung. Natürlich ist es so, dass, wenn du alle drei Footer aktiviert hast, Footer 1 oben steht, Footer 2 darunter und Footer 3 ganz unten. Wenn du aber nur einen Footer verwendest oder zwei, so verbraucht der nicht benutzte Footer natürlich keinen Platz. Wenn du also statt Footer 1 den Footer 2 anschaltest, steht der natürlich ebenfalls ganz oben, also direkt am Inhaltsbereich.
Sidebar oder Seitenleiste
Eine Sidebar kann links oder rechts oder links und rechts angezeigt werden. In der Sidebar kann man eine Navigation platzieren. Außerdem ist es möglich, die Blognavigation anzuzeigen und man kann Inhalte in die Sidebar einfügen. Aktuell ist es nur möglich, in einer Sidebar Inhalte einzubinden und in der anderen Sidebar die Navigation für die Seiten oder den Blog unterzubringen. Es ist aber für die Zukunft geplant, dass man in jeder Sidebar Inhalte und Navigation zusammen einbinden kann.
Des weiteren planen wir eine Sidebar, die unter der Webseite als Footer eingebaut werden kann.Früher gab es unterschiedliche Inhalte für die Sidebar. Das ist inzwischen Geschichte. Du kannst jeden Inhalt, den du auf der Seite platzierst, auch in die Sidebar einbauen. Das gilt auch für unser Spaltensystem für Kaufversionen. Du kannst in einer Sidebar ebenfalls Spalten anlegen, auch wenn es keinen Sinn macht aufgrund der begrenzten Breite mehr als 2 Spalten zu verwenden. Da alle Funktionen für die Spalten auch in der Sidebar aktiv sind, kannst du theoretisch die Spalte, welche die Inhalte der Sidebar aufnimmt auf eine normale Seite verschieben. Dann hast du mit einem Mal keine Inhalte mehr in der Sidebar, weil die Inhalte natürlich zusammen mit der Spalte bewegt werden. Außerhalb des Spaltenmodus kann es dann sein, dass du keine neuen Inhalte in die Sidebar schieben kannst, weil keine Spalte vorhanden ist. Sollte das passieren, kannst du einfach wieder in den Spaltenmodus wechseln und entweder die Spalte mit den Inhalten der Sidebar zurückschieben oder eine neue Spalte in der Sidebar anlegen.
Eine Sidebar ist immer sichtbar und zeigt auf allen Seiten den gleichen Inhalt an. Man kann festlegen, ob die Sidebar immer so hoch ist wie der Inhaltsbereich oder nur so hoch, damit die vorhandenen Inhalte angezeigt werden.
Wird eine Sidebar ausgeblendet, in der sich eine Navigation befindet, dann wird die Navigation entweder automatisch im Headerbereich platziert oder, falls die Sidebar nur Unterseiten angezeigt hat, werden diese automatisch in die horizontalte Navigation im Header aktiviert. Man kann ein Design mit einer, mit beiden oder ohne Sidebar gestalten.
Hat man eingestellt, dass das Design automatisch auf mobilen Geräten optimiert wird, dann muss man wissen, dass die Sidebar für die mobile Ansicht ausgeblendet wird. Inhalte, die in jedem Fall auch in der mobilen Ansicht erreichbar sein sollen, müssen dann nicht nur in der Sidebar sondern auch auf einer normalen Seite verfügbar sein.
Welche Bereiche brauche ich bei einem Design immer?
Für eine funktionierende Webseite brauchst du eine Navigation und einen Inhaltsbereich. Nachfolgend die Möglichkeiten, die dir mit page4 offen stehen.
Beispiel 1
Du blendest alle Elemente aus und hast dann nur eine horizontale Navigation, die oben steht und einen Inhaltsbereich, der unter der Navigation ist und die die volle Breite einnimmt. Du hast keine Header, keine Footer und keine Sidebars.
Beispiel 1
Du blendest alle Elemente aus und hast dann nur eine horizontale Navigation, die oben steht und einen Inhaltsbereich, der unter der Navigation ist und die die volle Breite einnimmt. Du hast keine Header, keine Footer und keine Sidebars.
Beispiel 2
Du blendest alle Elemente aus und die Sidebar links ein. Dann platzierst du die Navigation in der Sidebar, die dort oben angezeigt wird. Rechts daneben hast du dann den Inhaltsbereich. Alle Seiten werden in der vertikalen Navigation angezeigt. Du kannst die Sidebar nur so lang anzeigen lassen wie erforderlich oder so, dass sie immer so hoch ist wie der Inhaltsbereich. Das stellst du im Design-Editor im Bereich "Elemente" ein.
Du blendest alle Elemente aus und die Sidebar links ein. Dann platzierst du die Navigation in der Sidebar, die dort oben angezeigt wird. Rechts daneben hast du dann den Inhaltsbereich. Alle Seiten werden in der vertikalen Navigation angezeigt. Du kannst die Sidebar nur so lang anzeigen lassen wie erforderlich oder so, dass sie immer so hoch ist wie der Inhaltsbereich. Das stellst du im Design-Editor im Bereich "Elemente" ein.
Beispiel 3
Du blendest alle Elemente aus und die Sidebar rechts ein. Dann platzierst du die Navigation in der Sidebar, die dort oben angezeigt wird. Rechts daneben hast du dann den Inhaltsbereich. Alle Seiten werden in der vertikalen Navigation angezeigt. Du kannst die Sidebar nur so lang anzeigen lassen wie erforderlich oder so, dass sie immer so hoch ist wie der Inhaltsbereich. Das stellst du im Design-Editor im Bereich "Elemente" ein.
Du blendest alle Elemente aus und die Sidebar rechts ein. Dann platzierst du die Navigation in der Sidebar, die dort oben angezeigt wird. Rechts daneben hast du dann den Inhaltsbereich. Alle Seiten werden in der vertikalen Navigation angezeigt. Du kannst die Sidebar nur so lang anzeigen lassen wie erforderlich oder so, dass sie immer so hoch ist wie der Inhaltsbereich. Das stellst du im Design-Editor im Bereich "Elemente" ein.