Skip to main content

​
Allgemeine Beschreibung

Mit dem “Section” Portlet kannst du Abschnitte auf deiner Webseite erstellen und diesen eine minimale Höhe zuweisen. Zusätzlich kannst du einen Boxenschatten verwenden, um deine Inhalte optisch hervorzuheben und ihnen Tiefe zu verleihen.

​
Einsatzmöglichkeiten (Inspiration)

  • Übersichtliche Abschnitte: Nutze das “Section” Portlet, um Inhalte auf deiner Webseite in klar definierten Abschnitten darzustellen, die den Fokus der Besucher auf bestimmte Informationen lenken
  • Hervorgehobene Bereiche: Verwende es, um bestimmte Bereiche deiner Webseite, wie etwa Angebote, Ankündigungen oder Neuigkeiten, hervorzuheben und ihnen einen visuellen Rahmen zu verleihen
  • Abschnittsübergänge: Nutze das “Section” Portlet, um Übergänge zwischen verschiedenen Teilen deiner Webseite zu gestalten und den Inhalt optisch zu trennen

​
Featureübersicht:

  • Mindesthöhe: Du hast die Möglichkeit, eine Mindesthöhe für den Abschnitt festzulegen, um sicherzustellen, dass der Inhalt ausreichend Platz hat und gut dargestellt wird
  • Boxenschatten: Ein Boxenschatten kann hinzugefügt werden, um die Inhalte des Abschnitts optisch hervorzuheben und ihnen Tiefe zu verleihen
  • Kreative Freiheit: Du kannst Inhalte nach Belieben innerhalb des Abschnitts platzieren und das Erscheinungsbild individuell anpassen

​
Settings:

​
Allgemein

Image
Breite der Section: Hier legst du fest, wie breit deine Section auf der Seite dargestellt werden soll. Du hast die Auswahl zwischen:
  • Boxed klein (Standard Container) = Die Section erhält eine standardmäßige Maximalbreite und wird mittig auf der Seite platziert.
  • Boxed groß (Container Fluid XL) = Die Section ist breiter als der Standard-Container, hat aber dennoch eine feste Begrenzung.
  • Fluid - volle Bildschirmbreite = Die Section erstreckt sich über die komplette Breite des Bildschirms, ohne Ränder an den Seiten.
Der klassische Standard Container hat auf den meisten Bildschirmgrößen mehr Platz zum Rand und bietet so ein dokumentenähnliches Layout, was auf den meisten kleinen Bildschirmen gut funktioniert und etwas Luft zum Rand lässt. Der große Container richtet je nach Template seine Breite auf 1650px aus und lässt nur auf großen Bildschirmen Luft zum Rand. Der ideale Container für moderne Layouts, die auf allen Bildschirmenn funktionieren. Der Fluid Container geht immer bis zum Rand und eignet sich vereinzelt als Stilmittel für randlose Slider, Heroimages oder ähnliches. Achte hier aber auf ein Layout, welches auch auf großen Bildschirmen funktionieren muss.
Abstandsloser Container: Wenn du dieses Häkchen setzt, werden die standardmäßigen Abstände (Paddings/Margins) des Containers entfernt. Der Inhalt schließt dann direkt und bündig mit den Rändern ab.
Wenn aktiv, wird der Standard-Abstand des Containers deaktiviert und vollflächiger Inhalt wird ermöglicht
HTML-Tag der Section: Wähle hier das passende HTML-Tag für das umschließende Element aus. Dies ist vor allem für die technische Strukturierung deiner Seite und für Suchmaschinen relevant. Auswahl zwischen:
  • section
  • div
  • span
Mindest Höhe: In diesem Feld kannst du eine feste minimale Höhe (z. B. in Pixeln) eintragen. Das stellt sicher, dass deine Section immer eine gewisse Größe behält, selbst wenn nur sehr wenig Text oder Inhalt darin platziert wurde. Boxschatten verwenden?: Aktivierst du diese Option durch Setzen des Häkchens, erhält deine Section einen leichten, optischen Schatten nach außen. Dadurch hebt sie sich plastisch vom restlichen Seitenhintergrund ab.