Was sind Inhaltseinstellungen?

Wie schon erwähnt, musst du dir ein Inhaltselement wie ein geschlossenes System, einen Absatz vorstellen. Technisch gesehen, ist jeder Inhalt in einem "div" gespeichert, einem Container. Der Vorteil dabei ist, ein Container kann einen Rahmen haben, einen Innenabstand, eine Hintergrundfarbe und das nutzen wir aus. Wenn du die Toolbar aufrufst, wo du die Werkzeuge zum Bearbeiten von Inhalten findest siehst du ganz rechts ein Zahnrad. Das ist das Werkzeug, mit dem du jeden einzelnen Abschnitt mit individuellen Optionen belegen kannst. Aber Vorsicht. Du musst wissen, es gibt eine zentrale Stelle, wo diese Optionen übergeordnet vergeben werden. Das sorgt dafür, dass jeder Inhalt erst einmal die gleichen Optionen hat. Also die gleichen Abständen, die gleichen Einstellungen für die Umrandung und den Hintergrund. Dort stellst du ein, wie viel Platz du dem Inhalt geben willst und ob du zum Beispiel unter jedem Absatz eine Linie möchtest oder was auch immer. Manchmal ist aber etwas für alle Absätze nicht immer passend. Daher kannst du jeden einzelnen Abschnitt individuell einstellen. Du schaltest die übergeordneten Einstellungen ab und verwendest eigene. So kannst zum Beispiel einzelne Abschnitte mit mehr Abstand nach oben oder unten versehen oder mit einer Linie ausstatten. Du musst aber wissen, dass in dem Moment der Abschnitt nicht mehr auf Veränderungen von außen reagiert. Wenn du die globalen Einstellungen änderst, tun die von dir modifizierten Abschnitt so, als interessiert es sie nicht. Du musst dann eventuell alle manuell eingestellten Inhaltselemente einzeln aufrufen und wieder umstellen auf globale Optionen.

 

 

Mit page4 hast du die Möglichkeit, jeden einzelnen Inhalt (Abschnitt) grafisch zu gestalten. Dazu gibt es das Zahnrad, welches du in der Toolbar ganz rechts finden kannst. Standardmäßig erhalten alle Inhalte die gleichen Einstellungen. Den Dialog dazu findest du aktuell im Menü „Design“ und dort ganz unten unter „Designeinstellungen“. Wenn du den Dialog „Inhaltseinstellungen bearbeiten“ über das Zahnrad in der Toolbar aufrufst, kannst Du den Rahmen und den Hintergrund bearbeiten. Über den Einstellungsmöglichkeiten befinden sich zwei Optionen. „Werte vom Layout übernehmen“ und „Eigene Werte verwenden“. Wenn die Option „Werte vom Layout übernehmen“ aktiv ist, verwendet das Inhaltselemente die Einstellungen, die du im Menü „Design“ unter „Designeinstellungen“ hinterlegt hast.

 

 

Klickst du auf „Eigene Werte verwenden“ dann kannst du die hinterlegten Werte verändern und das von dir bearbeitete Inhaltselement verwendet dann eigene Werte für Rahmen, Hintergrund und Abstände. Das bedeutet aber auch, wenn du die globalen Einstellungen unter dem Menü „Design“ veränderst, werden diese Änderungen nur auf Inhaltselemente angewandt, die die Option „Werte vom Layout übernehmen“ aktiviert haben. Alle von dir manuell bearbeiteten Inhaltselemente behalten die eigenen Werte, bis du die Option „Eigene Werte verwenden“ wieder ausschaltest.

 

Du hast verschiedene Möglichkeiten, das „Drumherum“ eines Inhaltselementes zu verändern.

 

Du kannst für jede Seite des Inhaltselementes einen Rahmen (Border) anlegen und diesem Rahmen eine Stärke geben. Alle Rahmen zusammen können eine eigene Farbe bekommen. Die Rahmenstärke baut nach innen auf. Das bedeutet, wenn du links und rechts einen Rahmen von zum Beispiel 20 Pixel (px) anlegst, dann wird der eigentliche Inhalte um 20 px nach innen verschoben. Die Gesamtbreite des Inhaltselementes ändert sich dagegen nicht. Aktivierst du Rahmen, die oben und unten angezeigt werden, dann vergrößert sich die Höhe des Elements und der eigentliche Inhalte wird nach unten verschoben.

 

Jedes Inhaltselement kann eine eigene Hintergrundfarbe bekommen. Möchtest du, dass der Hintergrund durchsichtig ist, dann löscht du einfach die Farbwerte mit dem Papierkorb.

 

Mit dem Innenabstand kannst du mehrere Dinge machen. Möchtest du einfach nur, dass zwischen den einzelnen Inhalten auf deiner Webseite mehr Abstand ist, dann kannst du global einstellen, dass jedes Inhaltselemente automatisch einen Innenabstand unten bekommt. Wenn du einen Innenabstand oben und unten angibst, dann wird der Abstand zwischen zwei Inhalten natürlich so groß wie der angegebene Abstand oben und unten zusammen. Deshalb macht es normalerweise Sinn, nur einen Abstand unten einzugeben. Wenn du das global einstellst, hat jeder neue Abschnitt und auch alle vorhandenen Abschnitte, die auf „Werte vom Layout übernehmen“ eingestellt sind automatisch die globalen Werte zum Anzeigen. Möchtest du einzelne Inhalte mit einem größeren Abstand zueinander darstellen, kannst du natürlich jederzeit die globalen Werte durch eigene Angaben überschreiben.

Wenn du einen Rahmen verwendest, macht es Sinn, den Inhalt einen gewissen Abstand zum Rahmen zu geben. Auch dazu verwendest du den Innenabstand. Der Rahmen „drückt“ wie beschrieben den Inhalt zwar nach innen aber der Innenabstand wird immer von der Innenkante des Rahmens berechnet. Trägst du also 20 px Innenabstand an, dann hat der eigentliche Inhalt des Elements einen Abstand von 20 px zum Rahmen, egal wie stark dieser Rahmen selbst ist.

 

Jedes Inhaltselement bekommt automatisch beim Anlegen eine eindeutige Sprungmarke (#cnt1234). Das ermöglicht dir, jederzeit Links anzulegen, um zu einzelnen Inhaltselementen auf einer Seite zu springen. Du siehst diesen Effekt nur dann, wenn die Seite so lang ist, dass du scrollen musst. Ein Beispiel, wie du solche Sprungmarken nutzen kannst:

Nehmen wir an, du hast eine lange Seite mit 10 längeren Texten, die jeweils eine Überschrift haben. Dann kannst du am Anfang der Seite ein Inhaltsverzeichnis anlegen, die Überschriften angeben und jede Überschrift verlinkt dann zu Originalüberschrift auf der Seite. Dazu musst du nur die Sprungmarken der einzelnen Überschriften als Link verwenden.

Du kannst auch zu Elementen auf anderen Seiten springen, indem du hinter dem Link zur Seite die Sprungmarke einbaust. Befindet sich das Element, zu dem du verlinken willst, auf der Seite „ferien.html“ dann sieht der Link zu dem Element mit der Sprungmarke „#cnt5449“ wie folgt aus „/ferien.html#cnt5449“.