Design Einstellungen

Baukasten Design

Der Screenshot zeigt die Design-Einstellungen im Baukasten-Backend. Hier passt du zentrale visuelle Parameter deiner Website an:

Features

Farben

Stell die Farbpalette deiner Website ein. Leg fest, welche Primär-, Sekundär- und Tertiärfarben du nutzen willst. Außerdem kannst du Schwarz- und Weißwerte sowie die Hintergrundfarbe bestimmen.

Grid-System

Konfiguriere das Grid-System für deine Website. Passe Abstände und Ränder für verschiedene Layout-Bereiche individuell an.

Header & Favicon

Schalte den Header ein oder aus. Lade dein Logo hoch, konfiguriere das Menü und verwalte das Favicon deiner Seite.

Globale UI-Elemente

Bestimme globale Einstellungen für Buttons, Sektionen und die Seitennummerierung (Pagination). Dazu gehören Schriftarten, Farben, Abstände und Ränder.

Farben

Im Bereich Farben legst du die wichtigsten Farbcodes für deine Website fest:

Primäre Farbe: Hauptfarbe für Buttons und Akzente.
Sekundäre Farbe: Ergänzende Akzentfarbe.
Tertiäre Farbe: Eine weitere Farbe für spezielle Hervorhebungen.
Schwarz/Weiß: Basisfarben für Kontraste.
Hintergrundfarbe: Definiert die allgemeine Hintergrundfarbe der Seite.

Grid-System

Das Grid-System steuert die Abstände und Ränder im Layout. Du kannst separate Werte für die Abstände oben/unten und links/rechts definieren:

Abstand: Innenabstand von Containern.
Rand: Außenabstand zu anderen Elementen.
Abstand Blöcke: Der vertikale Abstand zwischen einzelnen Inhaltsblöcken.

Header anzeigen: Schalte den Header deiner Seite global ein oder aus.
Logo: Lade dein Logo als SVG- oder Bild-Datei hoch. Definiere die Ausrichtung (links, mittig, rechts) und passe die Breite für den Normalzustand und den “aktiven” Zustand an (z.B. beim Scrollen).
Menü: Konfiguriere die Typografie (Schriftart, Schriftgröße) und die Farben für Text und Hintergrund im Normal-, Hover-, Aktiv- und aktuellen Zustand.
Hamburger: Gestalte das Hamburger-Icon für die mobile Ansicht, inklusive Farben und Overlay.

Favicon

Hier verwaltest du das Favicon deiner Website. Du kannst die benötigten Dateien auf https://realfavicongenerator.net/ erstellen und die entsprechenden Dateien hochladen.

Globale Button Einstellungen

Definiere das einheitliche Aussehen für alle Buttons auf deiner Website.

Einstellungen: Passe Schriftart, Textgröße, Eckenradius (Rand Rundung), Rahmenstärke (Rand Strichstärke) und den Innenabstand (Abstand) an.
Farben: Lege die Farben für Hintergrund, Text und Rand in verschiedenen Zuständen fest: Normal, Hover und Aktiv.

Sektionen Einstellungen

Sektionen werden standardmäßig angezeigt. Wenn du diese nicht anzeigen möchtest, kannst du diese Einstellung deaktivieren. Die bedeutet, dass nur die Unterseiten anzeigt werden. Die Übersichtsseite wird dann nicht mehr angezeigt.

Sektionen anzeigen?: Aktiviert oder deaktiviert die Anzeige von Sektionen auf der Website.
Sektionen in der URL anzeigen: Legt fest, ob der Name der Sektion im URL-Pfad erscheint.

Seitennummerierung

Gestalte das Aussehen der Seitennummerierung (Pagination) für Beitragslisten oder Galerien.

Einstellungen: Definiere Schriftart, Textgröße, Abstände, Ränder und die Anzahl der Elemente pro Seite.
Farben: Passe die Farben für verschiedene Zustände (Normal, Hover, Aktiv) an, um die Navigation für den Benutzer klar zu gestalten.