SB30 – Bedienung

Bedienung

Schritt für Schritt im Editor arbeiten, speichern und Inhalte veröffentlichen.

Stand: SB30.89 · 18.09.2026

Diese Anleitung beschreibt das Bearbeiten von Inhalten sowie Bilder, Galerien und News.

Inhalte bearbeiten

  1. Oben rechts anmelden.
  2. Den Schalter Bearbeiten aktivieren.
  3. Eine Textseite ohne Unterseiten öffnen.
  4. Inhalt bearbeiten und am Ende der Editor-Werkzeugleiste mit dem orangefarbenen Disketten-Symbol speichern.

Der Editor bietet HTML-Ansicht, Rückgängig/Wiederholen, Überschriften, Schriftarten und -grössen, Farben, Formatierung entfernen, Links, Sonderzeichen, Emoji, Bilder, Slider, Tabellen, Listen, Ausrichtung, Speichern und Vollbild. Das Disketten-Symbol speichert die aktuelle Seite. Zellrahmen lassen sich nach Seite, Farbe, Breite und Stil einstellen. PHP-Inhaltsdateien werden angezeigt, können aber nicht visuell gespeichert werden.

Speichern Sie Ihre Änderungen vor einem Seitenwechsel oder der Abmeldung. Das Ausschalten von Bearbeiten speichert den Inhalt nicht automatisch.

Textseiten und Untermenüs

Eine neue Seite wird als Ordner nach dem Schema NNNameTT angelegt, etwa pages/05Kontakt01/: NN sortiert, Name erscheint im Menü und TT bestimmt den Seitentyp. Fehlt eine unterstützte Inhaltsdatei (index.html, inhalt.html, index.php oder inhalt.php), legt SB30 beim ersten Aufruf einer Textseite automatisch eine index.html an. Dafür braucht der Webserver Schreibrechte.

Unterordner bilden Untermenüs:

pages/02Dokumentation01/
├── 01Installation01/index.html
└── 02Bedienung01/index.html

Dokumentation ist dann nur die aufklappbare Navigationsebene. Die ersten zwei Ziffern sortieren, die letzten zwei wählen den in settings.php definierten Seitentyp.

Bilder

Die Schaltfläche Bild öffnet einen gemeinsamen Bilddialog. Dort kann ein neues JPG-, PNG-, GIF- oder WebP-Bild hochgeladen, ein vorhandenes Bild aus dem Bilderordner gewählt oder eine Bildadresse eingegeben werden. Eine Vorschau sowie Felder für Alternativtext, Breite und Ausrichtung stehen vor dem Einfügen bereit. Beim Upload wird der MIME-Typ geprüft, der Name bereinigt und ein Zeitstempel ergänzt.

So fügen Sie ein Bild ein:

  1. Setzen Sie den Cursor im Editor an die gewünschte Stelle und wählen Sie Bild.
  2. Laden Sie eine Datei hoch, wählen Sie ein vorhandenes Bild oder geben Sie die Bildadresse ein.
  3. Prüfen Sie die Vorschau und ergänzen Sie einen beschreibenden Alternativtext.
  4. Wählen Sie die Breite (Originalgrösse, 25, 50, 75 oder 100 Prozent) und die Ausrichtung.
  5. Klicken Sie auf Bild einfügen und speichern Sie anschliessend die Seite über das Disketten-Symbol.

Die Bildliste zeigt die bis zu 200 zuletzt geänderten Bilder des jeweiligen Ordners. Unterordner werden nicht durchsucht. Aktualisieren lädt die Bildliste erneut. Abbrechen schliesst den Dialog ohne Einfügen.

Slider: zwei Bilder vergleichen

Ein Slider legt zwei Bilder übereinander. Der Schieber macht wahlweise mehr vom linken oder rechten Bild sichtbar. Die Bilder sollten denselben Ausschnitt und dasselbe Seitenverhältnis haben: Das linke Bild bestimmt die Höhe, das rechte wird bei Bedarf passend zugeschnitten.

Einfügen und bearbeiten

  1. Setzen Sie den Cursor an die gewünschte Stelle und wählen Sie Slider in der Werkzeugleiste.
  2. Wählen Sie Bild links auswählen und Bild rechts auswählen. Sie können Bilder hochladen, vorhandene Bilder wählen oder eine Bildadresse eingeben.
  3. Stellen Sie Breite (%) zwischen 1 und 100 ein. 100 Prozent nutzt den verfügbaren Platz im Absatz oder in der Tabellenzelle vollständig.
  4. Wählen Sie Einfügen und speichern Sie die Seite mit der orangefarbenen Diskette.

Slider-Uploads und die zugehörige Bildliste verwenden images/sliders/. Dieser Ordner ist unabhängig von der Einstellung für normale Bilder.

Zum Ändern doppelt auf den Slider klicken oder ihn einmal anklicken und danach Slider in der Werkzeugleiste wählen. Bilder und Breite anpassen, Änderungen übernehmen wählen und anschliessend die Seite speichern. Löschen entfernt den Slider aus dem Inhalt; die Bilddateien bleiben erhalten. Abbrechen verwirft Änderungen im Dialog.

Verschieben, kopieren und Text ergänzen

Im Bearbeitungsmodus ist der Schieber inaktiv. Der Slider wird als zusammenhängendes Objekt ausgewählt, damit seine beiden Bilder zusammenbleiben.

  • Einmal anklicken und mit Drag-and-drop an eine neue Stelle ziehen.
  • Zum Kopieren anklicken, Strg+C beziehungsweise Cmd+C drücken, die Zielstelle wählen und mit Strg+V beziehungsweise Cmd+V einfügen.
  • Ausschneiden ist über Strg+X beziehungsweise Cmd+X möglich.
  • Beschriftungen und weitere Absätze im normalen Editor vor oder nach dem Slider ergänzen.
  • Nach Verschieben, Kopieren oder Löschen die Seite speichern.

Prüfen Sie die Platzierung besonders in Tabellen und bei selbst gestaltetem HTML. Für grössere Layoutänderungen vorher eine Sicherung anlegen; die native Rückgängig-Funktion erfasst nicht jede direkte Verschiebung eines Slider-Elements.

Bedienung auf der fertigen Seite

Nach dem Speichern die öffentliche Ansicht öffnen, indem Sie Bearbeiten ausschalten. Hier lässt sich der Trenner mit Maus oder Touch bewegen. Mit Tab den Schieber fokussieren und mit den Pfeiltasten bedienen; Home und End zeigen jeweils eines der Bilder vollständig. Die Bewegung in der öffentlichen Ansicht verändert die gespeicherte Seite nicht.

Responsive Darstellung

Eine prozentuale Breite bezieht sich auf den jeweiligen Inhaltsbereich, nicht auf den gesamten Bildschirm. Auf kleinen Bildschirmen nutzt 100 % den Platz besser als beispielsweise 60 %.

Die Seite Beispiele → Sliders verwendet ein flexibles Raster: Bei ausreichend Platz stehen zwei Slider nebeneinander, sonst untereinander. Jeder Slider nutzt die Breite seiner Spalte. Dieses Raster ist eine Gestaltung der Beispielseite und wird nicht automatisch auf alle eingefügten Slider angewendet.

Galerie

  1. Galerieordner nach dem Schema NNName02 anlegen, etwa pages/03Beispiele01/03Gallerie02/.
  2. Darin org/ anlegen und Originalbilder hineinkopieren.
  3. Galerieseite öffnen.

SB30 erzeugt fehlende Varianten in thumb/ und medium/. Vorhandene Varianten werden nicht aktualisiert. Nach Austausch eines Originals oder Änderung der Grössen müssen die betreffenden Ableitungen manuell entfernt werden.

Der Bildbetrachter unterstützt Escape, Pfeiltasten und Wischgesten. Über die Start/Pause-Schaltfläche oben links lässt sich eine Diashow einschalten. Sie wechselt alle vier Sekunden zum nächsten Bild. Mit der Leertaste kann die Diashow ebenfalls gestartet oder pausiert werden. Beim Schliessen des Bildbetrachters stoppt sie automatisch.

News und Blog

Eine News-Seite wird als Ordner mit dem Seitentyp 03 angelegt, zum Beispiel pages/05News03/. SB30 verwendet darin den Unterordner posts/ und legt ihn beim ersten Speichern eines Beitrags an, falls er noch fehlt.

  1. Als Administrator anmelden und Bearbeiten einschalten.
  2. Die News-Seite im Menü öffnen.
  3. Neuen Beitrag erstellen wählen.
  4. Titel, Datum, Kurztext, optionalen Bildpfad und Inhalt eingeben.
  5. Beitrag veröffentlichen aktivieren oder den Beitrag vorerst verbergen.
  6. Mit dem Disketten-Symbol im Editor speichern.

Das Feld Bild (URL oder relativer Pfad) bestimmt das Vorschaubild der Newsübersicht. Mit Bild nur in der Vorschau anzeigen wird dieses Bild nicht zusätzlich automatisch oberhalb des Einzelbeitrags ausgegeben. Bilder im Beitragstext bleiben davon unabhängig und werden über Bild im Editor eingefügt.

Die Übersicht zeigt veröffentlichte Beiträge mit dem neuesten Datum zuerst. Im Bearbeitungsmodus können auch verborgene Beiträge geöffnet, geändert oder gelöscht werden. Ein Beitrag kann nur gelöscht werden, wenn sein Ordner keine zusätzlichen Dateien enthält; dies schützt versehentlich abgelegte Dateien.

Verwaltung

Backup, Wiederherstellung und Abmelden sind in der eigenen Anleitung Verwaltung beschrieben.