Skip to main content

Deine Regeln

In diesem Reiter kannst du mithilfe eines grafischen Editors gezielt CSS-Regeln für vordefinierte Bereiche erstellen und deine gespeicherten Regeln verwalten.
Image
Wichtiger Hinweis: Dieses Tool soll dir zur Unterstützung dienen, um dein NIUplus auch ohne CSS Kenntnisse zu individualisieren. Es ersetzt jedoch keine Fachkenntnisse. Du benutzt dieses Tool auf eigene Verantwortung. Der Hersteller leistet keinen kostenfreien Support für Änderungen, die mit diesem Tool erstellt wurden.

Neue CSS Regel erstellen

Hier definierst du die Eigenschaften einer neuen Design-Anpassung.
  • Selektor wählen: Wähle im ersten Dropdown den Bereich aus, den du bearbeiten möchtest (z. B. “Nav Topbar”). Im zweiten Dropdown kannst du einen Status wählen (z. B. “Ohne” für den Normalzustand).
  • Hintergrundfarbe: Lege eine Hintergrundfarbe fest. Aktiviere den Important-Schalter, um diese Regel zu erzwingen (CSS !important).
  • Schriftfarbe: Lege die Textfarbe fest. Auch hier steht dir der Important-Schalter zur Priorisierung zur Verfügung.
  • Schriftdicke: Wähle die Stärke der Schriftart (Font Weight) aus dem Dropdown. Nutze Important, falls die Änderung sonst nicht greift.
  • Custom Rules: In dieses Textfeld kannst du manuellen CSS-Code eingeben, um Eigenschaften zu ändern, die oben nicht als Auswahlfeld zur Verfügung stehen (z. B. border: 1px solid #e5e5e5;).

Deine Regeln (Übersicht)

Unterhalb des Editors findest du eine Liste aller bereits angelegten Regeln.
Image
  • Tabelle: Hier siehst du eine Übersicht der Regeln, sortiert nach Selektor und State.
    • Wenn keine Regeln vorhanden sind, erscheint die Meldung “Keine Datensätze gefunden”.
    • Du kannst die Anzahl der angezeigten Elemente pro Seite (“Items per page”) steuern (z. B. 100).

Dein Stylesheet

Dieser Reiter bietet dir einen freien Code-Editor für umfangreichere oder komplett freie CSS-Anpassungen.
Image

Neue CSS Regel erstellen

  • Code Editor: Trage hier deinen kompletten CSS-Code ein (“Code goes here…”). Dieser wird global in das Stylesheet des Shops geladen.