Zum Inhalt

Seiten

Hinweise zum Update des Bereichs "Seiten": Was ist neu?

Im Zuge der fortschreitenden Neugestaltung des CMS haben wir nun den Bereich 'Seiten (HTML)' auf die neue Benutzeroberfläche umgestellt. Es hat sich funktional sowie optisch Folgendes geändert und wird einige Verbesserungen mit sich bringen.

  • Es gibt nun eine übergreifende Suchfunktion: Es ist möglich nach Seiten zu suchen und zu filtern - Die Trennung zwischen dynamischen Seiten und HTML-Seiten wird aufgehoben

  • Es ist möglich, die Dateien alphabetisch oder nach dem letzten Änderungsdatum zu sortieren

  • Wir unterstützen jetzt mehrere Tabs mit Seiten. So ist es möglich mehrere Dateien gleichzeitig zu öffnen

  • Es ist jetzt möglich, CSS-Dateien anzulegen und in HTML-Seiten und dynamischen Seiten einzubinden

  • Es ist jetzt möglich, Javascript-Dateien anzulegen und in HTML-Seiten und dynamischen Seiten einzubinden

  • Es ist möglich Verzeichnisse zu erstellen

  • Es ist möglich, die Dateien hierarchisch abzulegen (wir haben eine Ordnerstruktur eingebaut). Bitte beachten Sie, dass das Verschieben von HTML-Seiten dazu führt, dass die HTML-Referenz in den Komponenten manuell angepasst werden muss!

  • Externe Seiten werden jetzt als Links symbolisiert und können auch in Strukturen eingegliedert werden

Mit diesem Update haben wir außerdem fundamentale Änderungen am Datenmodell vollzogen. Dies ist für eine moderne API (Schnittstelle) und einer modernen CMS-Oberfläche sehr wichtig. Im nächsten Schritt werden wir nun die Benutzeroberflächen der einzelnen Module aktualisieren.

Wir freuen uns sehr, dass Sie uns bei der Umstellung begleiten. Bei Fragen und Anregungen freuen wir uns über Ihr Feedback an support@appack.de

Verwalten von Seiten und Dateien

Im linken Bereich können Sie Seiten und Dateien verwalten:

  • neue Seiten / Dateien anlegen

  • Seiten / Dateien löschen

  • Seiten / Dateien duplizieren

  • Seiten / Dateien zur Bearbeitung auswählen

  • Seiten / Dateien in Verzeichnissen strukturieren

  • Suche, Sortierung und Filterung von Dateien / Seiten

  • Die URL einer Seite / Datei in die Zwischenablage kopieren

Typische Anwendungsfälle sind:

  • eine neue Seite anlegen

  • eine bestehende Seite bearbeiten

  • eine externe Seite (Webseite) anlegen und in Bauch der App einbinden

Felderklärungen:

**1. ** Von Links nach Rechts:

  • Suchleiste: nach bestimmten Seiten / Dateien suchen

  • Filter: nur bestimmte Datentypen anzeigen lassen

  • Refresh: Seiten neu laden nach Änderungen

  • Ausblenden: Linken Verzeichnisbereich ausblenden

**2. ** Von Links nach Rechts:

  • Sortierung: Anpassen der Sortierung von Verzeichnissen / Seiten

  • Erstellen: neue Dateien / Seiten / Verzeichnisse erstellen

  • Datei erstellen

  • HTML: einfache Seiten, die sowohl über einen HTML-Editor (ähnlich zu Word), als auch über den Quellcode angepasst werden können.

  • CSS (für Experten): diese Dateien sind sogenannte Stylesheets und können in HTML, sowie in dynamischen Seiten eingebunden werden, um den grundlegenden Style einer Seite zu definieren.

  • Javascript (für Experten): Scripte können in HTML und dynamischen Seiten eingebunden werden und dienen dazu, das (funktionale) Verhalten der Seite zu definieren.

  • JSON (für Experten): können in HTML und Dynamischen Seiten eingebunden werden und sind eine Art von Objekten oder auch statischer Datenbank. Sie dienen dazu, Informationen festzuhalten und mit verschiedenen Programmen und Anwendungen auszutauschen.

  • Dynamische Seiten (für Experten): sind besondere HTML-Seiten und lassen sich nicht mit dem HTML-Editor bearbeiten, sondern nur über den Quellcode. Außerdem benötigen diese Seiten eine Datenquelle, die meist eine unserer Datenbanken ist.

  • Link erstellen

  • Link zu einer externen Webseite im CMS anlegen.

  • Verzeichnis erstellen

  • weiteren Ordner für die Struktur der Dateien / Seiten anlegen

3. Hier sind die Dateien / Seiten aufgeführt. Sie befinden sich in ihren Verzeichnissen und können per Drag & Drop in andere Verzeichnisse verschoben werden. Durch einen Doppelklick auf die Dateien können diese im Arbeitsbereich geöffnet werden.

> ⚠️ **Bitte beachten Sie, dass das Verschieben von HTML-Seiten dazu führt, dass die HTML-Referenz in den Komponenten manuell angepasst werden muss!**

Eine typische Struktur von Verzeichnissen sieht bspw. folgendermaßen aus:

  • Dynamische Seiten: Seiten, die eine Datenquelle haben und nur über den Quellcode bearbeitet werden können.

  • Eigene Seiten: einfache HTML-Seiten, die sowohl über einen HTML-Editor als auch über den Quellcode bearbeitet werden können.

  • Externe Seiten: Verlinkungen zu Webseiten

  • Templates: Templates von Seiten, die bei Bugfixes / Optimierungen unsererseits automatisch angepasst werden.

  • Styles: Stylesheets, die in Seiten eingebunden werden.

  • Ablage: nicht verwendete Dateien / Seiten.

4. An den einzelnen Dateien/Ordner gibt es noch ein 3-Punkte-Menü,über das weitere Aktionen möglich sind. Beispiel: Bei HTML-Seiten haben wir die Auswahl die Seite im Editor oder im Quellcode zu bearbeiten, die Seite zu duplizieren, die URL in die Zwischenablage zu kopieren und die Datei zu löschen.

Arbeitsbereich

Hier befinden sich die Seiten, die zur Bearbeitung im Arbeitsbereich geöffnet wurden. Es können auch mehrere Seiten gleichzeitig geöffnet werden, diese werden dann oben im Tab aufgeführt. Bei Änderungen erscheint im Tab-Menü ein Disketten-Symbol zum Speichern von Änderungen.

Bearbeitung im Arbeitsbereich

Preview / Vorschau

Im rechten Bereich wird die Vorschau einer Seite angezeigt. Die Vorschau kann eingeklappt, neu geladen oder fixiert werden. Beim Fixieren wird beim Wechseln der Seiten nach wie vor die Vorschau der fixierten Seite angezeigt.

Technische Informationen

Unter der Vorschau sind einige Informationen über die Seite zu sehen. Diese unterscheiden sich wieder ein wenig, je nachdem welcher Datentyp ausgewählt wurde. Bei den dynamischen Seiten sieht das in etwa so aus:

Wir sehen den Dateinamen, die eindeutige ID der Datei, die Größe, wer die Datei zuletzt bearbeitet hat, in welchem Modul diese Seite eingebunden ist, welche Datenquelle (z.B. Workbook) damit verknüpft ist, ob es sich um ein Globales Template handelt und wenn es ein Globales Template ist, welche zusätzlichen Styles es hat.

Zudem kann noch eine Beschreibung hinzugefügt werden. Die Beschreibung dient nur der internen Dokumentation.

Tipps für das Bearbeiten von HTML-Seiten

Seiten duplizieren / eine Seiten-Vorlage übernehmen

Das zeigen wir u.a. im Video:

  • Seiten duplizieren

  • Seitenvorlage verwenden

Das zeigen wir u.a. im Video:

  • Bilder mobil-optimiert einfügen

  • relative Schriftgrößen