Referenz

Ansicht:

Die Ansicht zeigt die Verwaltungsübersicht aller erstellten Seiten im CMS.
Zu sehen sind:

• Bezeichnung der Seite (z.B. BKKD, Weihnachtspektakel, Datenschutz)
• Status (z.B. publish)
• Typ (page)
• Route & Slug
• Kategorie (z.B. Allgemein)
• SEO-Attribute: no-follow, no-index, Open Graph für Facebook & X (Twitter)
• SEO bearbeiten
• Seite löschen

Beschreibung:

Das CMS enthält ein leistungsfähiges Seitenmodul, mit dem beliebige Seiten angelegt, verwaltet und strukturiert werden können. Jede Seite ist mit Routen, Slugs und SEO-Optionen ausgestattet und lässt sich im integrierten Page-Builder visuell gestalten. Die Metadaten für Open Graph, Indexierung und Social Sharing sind direkt zugänglich. Dieses System habe ich vollständig entwickelt – modular, API-fähig und für Multiseitenprojekte ausgelegt.

Funktionsbeschreibung:

Diese Komponente ist die zentrale Seitenverwaltung für den integrierten Page-Builder.
Funktionen:

• Erstellung und Verwaltung beliebiger Seiten (auch systeminterne wie Startseite, Impressum etc.)
• Steuerung von SEO- und Open Graph-Metadaten
• Zuweisung von Routen & Slugs für flexible URL-Strukturen
• Kategorisierung der Seiten für Organisation & Menüs
• Verknüpfung mit dem visuellen Editor für Inhaltspflege

Bearbeitbar durch Berechtigungssystem (z.B. nur Admins)

Ansicht:

Diese Ansicht zeigt die Suchmaschinen- und Social-Media-Einstellungen für die Seite „BKKD“ im CMS.
Bearbeitbar sind:

• no-index / no-follow Schalter
• Seitentitel, Prefix, Suffix
• SEO-Beschreibung mit Zeichenzähler
• Open Graph (OG)-Einstellungen
• OG Type (z.B. Website, Article)
• OG Titel & Beschreibung
• OG-Bild mit Vorschau (1200×627px)
• Geschätzte Lesezeit in Minuten
• Social-Media-Aktivierung: Facebook & Twitter (X)
• Felder für Facebook App-ID, X Card Type, Site & Creator

Beschreibung:

Zur optimalen Sichtbarkeit in Suchmaschinen und sozialen Netzwerken bietet mein CMS-System für jede Seite einen eigenen SEO-Bereich. Neben klassischen Feldern wie Title, Description und no-index lassen sich auch Open Graph-Daten für Facebook und X (Twitter) konfigurieren – inklusive OG-Bild, Text und Vorschau-Verhalten. Diese Daten werden automatisch ins Frontend übergeben und verbessern die Darstellung in Snippets und Link-Vorschauen.

Funktionsbeschreibung:

Diese Komponente ermöglicht die feingranulare SEO-Optimierung für jede einzelne Seite.
Funktionen:

• Kontrolle über Indexierung & Follow-Verhalten
• SEO-Titel und Beschreibung mit Zeichenzählern
• Open Graph Unterstützung (inkl. Bild und Beschreibung)
• Social-Media-Präsenzen vorbereiten (Facebook, Twitter/X)
• Angaben für Seitenvorschau & Lesedauer

Direkte Auswirkung auf Head-Tags im Frontend (SEO-konform)

Ansicht:

Die Seite zeigt die Benutzerverwaltung im CMS-System. Aufgelistet sind:

• Name, Firma, E-Mail, Telefon, Mobilnummer
• Benutzerrollen (z.B. User, Admin)
• Berechtigungen (z.B. „Block read“)
• Zwei-Faktor-Status (2FA)
• Rollen-/Zugriffsverwaltung
• Sicherheitseinstellungen
• Datenbank-/Zugriffsstatus
• Bearbeiten, Klonen, Löschen

Beschreibung:

Im Rahmen meines eigenentwickelten CMS-Systems entstand eine vielseitige Benutzerverwaltung, die weit über klassische Login-Verwaltung hinausgeht. Admins können Nutzerrollen definieren, individuelle Berechtigungen zuweisen, Zwei-Faktor-Authentifizierung verwalten und Zugriffsrechte auf Module und Tools differenziert steuern. Alle Einstellungen greifen direkt auf CMS-Funktionalitäten wie Seiten, Formulare, Blöcke oder System-Tools zu. Diese Komponente wurde vollständig von mir umgesetzt – mit Fokus auf Sicherheit, Übersichtlichkeit und modulare Erweiterbarkeit.

Funktionsbeschreibung:

Diese Komponente ist die zentrale Benutzerverwaltung im CMS. Sie erlaubt:

• Rollenbasierte Rechtevergabe (z.B. Block-spezifisches Lesen oder Schreiben)
• Verwaltung von 2FA-Status für Sicherheit
• Zuweisung von Zugriff auf Tools oder Seitenbereiche
• Bearbeiten, Duplizieren und Entfernen von Benutzerprofilen
• Export und Filterung der Benutzerdaten

Die Rechteverwaltung ist tief mit dem CMS-Backend und dem Seitenaufbau verzahnt.

Ansicht:

Hier werden grundlegende App-Eigenschaften, Sicherheitseinstellungen, SCSS-Compiler-Optionen und E-Mail-Konfigurationen zentral gesteuert.
Enthaltene Bereiche:

• App Einstellungen
• App-Name und Admin-Adresse
• Datenschutz-/Impressum-Verlinkung
• HTML-Minimierung
• Worker Neustart-Buttons
• Mediathek-Konfiguration
• Aktivierung von Google Maps
• Zulässige Dateitypen (z.B. JPG, PNG, MP4)
• SCSS Compiler Settings
• Pfade, Cache, Map-Einstellungen
• Nur bei Login-Option für Entwickler
• E-Mail Einstellungen
• Speicherung & Versandoptionen
• Max. Anhangsgröße & ReplyTo-Feld
• OAuth2 Einstellungen
• JSON Web Key Set (JWK)
• Schlüssel-Typ (z.B. RSA), Verwendung, Scope
• Zertifikatverwaltung
• Bitstärke wählbar (z.B. 2048 bit)
• Erzeugung von Signaturschlüsseln
• Log-Einstellungen
• Protokollierung von Login, Logout, Passwörter, Registrierungen, Backup usw.
• App Logos
• Upload-Felder für: E-Mail Signatur Logo, Dashboard Logo, Login Logo

Beschreibung:

Diese Administrationsseite ist die Schaltzentrale des CMS. Hier können Admins nicht nur Inhalte pflegen, sondern auch grundlegende Mechanismen aktivieren oder einschränken. Sicherheitsrelevante Aspekte wie JWT-Signatur oder Dateiupload-Beschränkungen werden ebenso berücksichtigt wie Design-Vorgaben (z.B. über SCSS-Compiler oder App-Logos). Die Kombination aus einfacher Bedienung und mächtigen Optionen ist ein typisches Merkmal meines CMS-Backends.

Funktionsbeschreibung:

Diese Konfigurationsseite bündelt zentrale Verwaltungsoptionen für Administrator:innen:

• Datenschutzrechtliche Grundlagen (z.B. Impressumspflicht)
• Integration von Sicherheitsstandards wie OAuth2 und JWKS
• Automatische Code-Komprimierung im Frontend
• E-Mail-Management inkl. Async-Versand
• Vollständige Log-Erfassung mit granularen Events
• Corporate Design über Logo-Uploads

Die Einstellungen greifen systemweit und beeinflussen auch Frontend- und Nutzererlebnis.

Ansicht:

Die Ansicht zeigt die Systemkonfiguration für Benutzerregistrierungen im CMS. Sie erlaubt es, die Registrierung zu aktivieren, abzusichern und die Formularfelder granular zu steuern.
Enthaltene Optionen:

• Allgemeine Registrierungseinstellungen
• Jeder darf sich registrieren (aktivierbar)
• Passwort vergessen-Link anzeigen
• Bestätigung via E-Mail oder manuelle Aktivierung
• Sofortige Freischaltung möglich
• Benachrichtigungen bei neuen Registrierungen oder Aktivierungen
• Formularfelder konfigurierbar
• Für jedes Feld wählbar: nicht anzeigen, optional oder Pflichtfeld
• Konfigurierbare Felder:
• Firma/Organisation
• Vorname / Nachname
• Postleitzahl / Ort
• Titel
• Straße / Hausnummer
• Telefon
• Mobil
• Password Leak Checker aktivierbar

Beschreibung:

Diese Ansicht erlaubt die vollständige Kontrolle über den Registrierungsprozess. Ob für kleine Teams, öffentliche Plattformen oder sensible Anwendungen – alle Optionen sind konfigurierbar: Benutzerfreigabe, E-Mail-Bestätigung, Datenschutzfelder und Passwortsicherheit. Die Formularstruktur ist dynamisch anpassbar und passt sich jeder Projektanforderung an – auch ohne technische Kenntnisse.

Funktionsbeschreibung:

Das CMS erlaubt flexible und sichere Benutzerregistrierung – vom offenen Selbst-Login bis zur moderierten, DSGVO-konformen Aktivierung. Admins können das Registrierungsformular anpassen, ohne den Code zu ändern.

Der Leak-Checker sorgt zusätzlich für mehr Passwortsicherheit bei neuen Konten.

Ansicht:

Die Seite zeigt den Bereich „Fonts verwalten“ innerhalb der Design-Einstellungen.
Zu sehen sind:

• Ein großer Upload-Bereich für Schriftdateien (Drag & Drop)
• Ein Eintrag für die Schriftfamilie „Open Sans“ mit folgenden Schriftstilen:
• Bold, Italic, ExtraBold, Light, Medium, SemiBold etc.
• Icons zum Konfigurieren (Zahnrad), Infos einblenden (i) oder löschen

Beschreibung:

Im Rahmen meines CMS-Systems habe ich ein flexibles Font-Management-Modul entwickelt, das es ermöglicht, eigene Schriftarten zu integrieren – inklusive aller Stile und Schriftschnitte. Die Fonts lassen sich via Drag & Drop hochladen, automatisch analysieren und anschließend in allen Designbereichen (z.B. Typografie, Layout, UI) verwenden. So können Corporate Fonts oder individuelle CI-Vorgaben problemlos im CMS umgesetzt werden. Dieses Modul wurde vollständig von mir entwickelt – mit Fokus auf Barrierefreiheit, Design-Flexibilität und Systemintegration.

Funktionsbeschreibung:

Mit dieser Komponente können Redakteur:innen und Admins eigene Schriftarten hochladen, verwalten und aktivieren – systemweit.

• Upload von Webfonts (z.B. .woff, .woff2, .ttf)
• Verwaltung mehrerer Schnitte (Regular, Bold, Italic etc.)
• Konfiguration einzelner Schriftstile über Detaildialoge
• Kompatibel mit globalem Typografie-System (z.B. H1–H6, Button, Menü)

Jeder Font steht global zur Auswahl in anderen Designmodulen

Ansicht:

Die Seite zeigt die zentrale Verwaltung aller Navigationen (Menüs) im CMS. Zu sehen sind:

• Main (Typ: main)
• Footer (Typ: custom)
• Slug für interne Referenz (main, footer)
• Bearbeiten / Löschen

Beschreibung:

Zur Navigation auf der Website bietet mein CMS ein dynamisches Menüsystem. Menüs können beliebig angelegt, benannt und typisiert werden (z.B. main, footer, custom). Sie sind zentral verwaltbar und lassen sich über den Page-Builder und Theme-Controller gezielt ausgeben. Dank Slug-Referenzierung und der Integration in Header/Footer-Strukturen ist eine flexible Navigation auf jeder Seitentiefe möglich. Das System wurde von mir vollständig umgesetzt – vom Backend bis zur Ausgabe.

Funktionsbeschreibung:

Dieses Modul erlaubt die Verwaltung beliebiger Menüs, wie Hauptnavigation, Footer-Menüs oder individuelle Strukturen.
Funktionen:

• Menüs benennen & mit Slugs versehen
• Menü-Typ definieren (z.B. main, footer, sidebar, custom)
• Verlinkung mit Seitensystem oder externen URLs
• Visualisierung und Drag & Drop-Sortierung beim Bearbeiten
• Integration direkt im Page-Builder (Element „Menü“)

Ausgabe über vordefinierte Blöcke im Header/Footer/Layout

Ansicht:

Im Menü-Editor ist das Element „Heinz“ ausgewählt und in einem Bearbeitungsmodus geöffnet. Der rechte Bereich zeigt:

• Angezeigter Name (frei editierbar)
• Option „Link in neuem Tab öffnen“
• Attribut title (für Tooltip oder SEO)
• CSS-Klassen (mehrere Klassen möglich, z.B. has-uebergang, menu-one)
• Beschreibung (für Screenreader, Zusatzinfos)
• Menü aktiv
• Nur bei Login anzeigen / Nicht anzeigen bei Login

Beschreibung:

Neben einer strukturierten Menüverwaltung habe ich im CMS auch ein detailreiches Bearbeitungsmodul für einzelne Einträge entwickelt. Hier können Titel, Links, Verhalten (z.B. neuer Tab), CSS-Klassen, Sichtbarkeit und Beschreibung konfiguriert werden – ohne Codekenntnisse. So lässt sich die Navigation nicht nur visuell, sondern auch semantisch und responsiv optimal steuern. Dieses Feature ist vollständig von mir entwickelt und direkt in das Menüsystem und Page-Builder integriert.

Funktionsbeschreibung:

Diese Komponente erlaubt die vollständige Steuerung jedes einzelnen Menüpunktes.
Funktionen:

• Frei editierbarer Linktext unabhängig vom Seitentitel
• Optionales Öffnen in neuem Tab
• Tooltip-Text / title-Attribut für SEO & Accessibility
• Individuelle CSS-Klassen für gezieltes Styling
• Beschreibung für Screenreader, Hovertexte oder semantische Struktur

Sichtbarkeit steuerbar (z.B. „nur bei Login“)

Ansicht:

Diese Seite zeigt die Einstellungen für das Menü „Main“. Die Konfiguration umfasst:

• Bezeichnung und Slug
• Beschreibung (optional)
• Navigation Text
• Container-Typ (container vs. container-fluid)
• Horizontale und vertikale Ausrichtung (links, mitte, oben, unten)
• Breakpoints (Container & Menü): XS bis XXL
• Hintergrundfarbe für die Navigation
• Menü-Logo (Brand Image) – uploadbar
• Bildgrößen-Konfiguration für verschiedene Viewports (Display, Scroll, Mobile)

Beschreibung:

Zur individuellen Steuerung der Haupt- und Footer-Menüs habe ich eine umfassende Menü-Konfiguration entwickelt. Admins können Containergröße, Ausrichtung, Breakpoints und Styling definieren – inklusive Upload eines Menülogos. So lässt sich ein responsives, CI-konformes Navigationssystem aufbauen, das nahtlos ins Frontend eingebunden ist.

Funktionsbeschreibung:

Diese Komponente erlaubt die vollständige visuelle und strukturelle Steuerung eines Menüs.
Funktionen:

• Globale Menü-Darstellung definieren (Ausrichtung, Layout, Verhalten)
• Responsive Verhalten über definierbare Breakpoints
• Navigationshintergrundfarbe individuell einstellbar
• Optionales Logo im Menü (Brand Image)
• Darstellung auf Scroll und Mobilgeräten anpassbar

Vollständig in Theme- und Design-Logik integriert

Ansicht:

Die Seite zeigt den Bereich „Design Einstellungen“ für Typografie im CMS-System. Im Fokus steht die Konfiguration von:

• Überschriften H1 bis H6
• Schriftfamilie & Schriftstil (z.B. Open Sans Medium)
• Schriftgröße für Desktop & Mobil
• Zeilenhöhe
• Schriftfarbe

Beschreibung:

Im Rahmen meines modularen CMS-Systems entwickelte ich ein zentrales Typografie-Tool, mit dem Redakteur:innen die Darstellung von Überschriften, Buttons, Menüs und Textkörpern direkt im Backend steuern können. Dabei sind Schriftfamilien, Schriftgrößen (Desktop/Mobil), Farben und Abstände individuell pro Element definierbar. Alle Einstellungen sind global wirksam, sofort sichtbar und vollständig Theme-kompatibel. Die gesamte Lösung wurde von mir eigenständig konzipiert und umgesetzt.

Funktionsbeschreibung:

Diese Komponente erlaubt die zentrale Typografie-Steuerung für das gesamte CMS-Frontend.
Funktionen:

• Schriftfamilien und -stile pro Element (Google Fonts & lokale Fonts)
• Responsive Schriftgrößen für Mobil- und Desktopgeräte
• Anpassbare Zeilenhöhe und Farbwahl
• Trennung von Body-, Menü- und Button-Typografie
• Live-Auswirkung auf den Styleguide oder Webseiten

Das ermöglicht ein konsistentes, markenkonformes Design ohne externen Codezugriff.

Ansicht:

Die Seite zeigt den Farbkonfigurationsbereich deines CMS unter „Design Einstellungen“. Zu sehen sind:

• Farbwahlfelder für: Seiten-Hintergrundfarbe
• Farbwahlfelder für: Footer-Hintergrundfarbe
• Farbwahlfelder für: Footer-Schriftfarbe
• Weitere editierbare Farbgruppen (ausklappbar):
• Menü-Farben
• Link-Farbe
• Scroll To Top Button

Beschreibung:

Zur einfachen Anpassung des Corporate Designs im Frontend entwickelte ich ein zentrales Farbmodul, das alle UI-Bereiche konfigurierbar macht. Admins können Farben für Seitenhintergrund, Footer, Links, Menüs oder Buttons definieren – mit Live-Vorschau und Alpha-Kanal. Die Einstellungen greifen sofort auf die Webseiten und Module. Zusätzlich können alle Einstellungen mit einem Klick zurückgesetzt werden. Das Tool wurde vollständig von mir konzipiert und umgesetzt – modular, intuitiv und vollständig theme-kompatibel.

Funktionsbeschreibung:

Diese Komponente erlaubt die komplette Farbanpassung des CMS-Frontends – farblich, strukturell und responsiv.
Funktionen:

• Definieren individueller Farben pro UI-Bereich (z.B. Footer, Navigation, Buttons)
• Farbwahl über visuelles Farbfeld oder direkte Hex-/RGB-Eingabe
• Transparenzsteuerung über Alpha-Kanal
• Presets für gängige Farbwerte
• Reset-Funktion für globale Design-Wiederherstellung

Live-Vorschau im Frontend (sofortige Anwendung)

Ansicht:

Die Seite zeigt den Page-Builder im aktiven Einsatz, mit einer vollständigen Seitenstruktur, die modular aufgebaut ist.
Zu erkennen sind:

• Spalten-Layouts (1–3 Spalten nebeneinander)
• Verschiedene Inhalts-Widgets wie:
• Überschrift
• Textblock
• Button
• Medien (z.B. OG-Bild, Logos)
• Trennlinien / Abstände
• Partner-Logos / Kontaktinfos
• Alle Blöcke sind verschiebbar, duplizierbar und erweiterbar
• Der Seitenaufbau ist vollständig modular – von Header bis Footer

Beschreibung:

Im Zentrum meines CMS-Systems steht ein leistungsfähiger Page-Builder, der es ermöglicht, Seiten visuell zu gestalten – ganz ohne Code. Nutzer:innen können Inhalte per Drag & Drop zusammenstellen, Spalten definieren und Blöcke wie Text, Medien, Buttons oder Partnerlogos einfügen. Der Builder unterstützt Mehrspalten-Layouts, Wiederverwendbarkeit von Elementen, responsive Darstellung und strukturierte Abschnitte. Ich habe das komplette System – von der Block-Architektur bis zur Speicher- und Rendering-Logik – selbst entwickelt.

Funktionsbeschreibung:

Der Page-Builder ist ein visuelles Baukastensystem, mit dem Inhalte schnell und flexibel zusammengestellt werden können.
Funktionen:

• Spaltenlayouts (1/1, 1/2, 1/3 + 2/3, 3/3 etc.)
• Widgets wie Text, Bild, Button, Video, Galerie, Divider, Link-Listen
• Drag & Drop für Sortierung
• Inline-Bearbeitung der Inhalte

Inline-Bearbeitung der Inhalte, Abstände und Darstellungsoptionen pro Block, Sections (z.B. Partnerbereich, Info-Bereich, Call to Action)

Ansicht:

Die Ansicht zeigt das rechte Seitenpanel innerhalb des Page-Builders. Dort lassen sich für jede Seite verschiedene Metadaten und Layoutoptionen festlegen:

• Slug (Pfad-Ende der URL)
• Route (interne Zuordnung, z.B. app_public_index)
• Status der Website (Öffentlich / Entwurf / Archiv)
• Kategorie (z.B. Allgemein, Blog, Landingpage)
• Aufklappbare Optionen für:
• Header / Footer Sichtbarkeit
• Titelbild
• Textauszug (Teaser / Preview Text)
• Seiten-Attribute (z.B. Darstellung, Sidebar etc.)

Beschreibung:

Zur strukturierten Verwaltung von Seitenmetadaten und Darstellungsoptionen habe ich ein übersichtliches Seitenpanel entwickelt. Hier können Admins den Status, Slug, die Kategorie sowie Layoutoptionen (Header/Footer, Titelbild, Teasertext) steuern – ganz ohne den eigentlichen Inhalt zu bearbeiten. Das Panel ist voll mit dem Frontend und Routing-System verknüpft und beeinflusst URL-Struktur, Navigation und Sichtbarkeit. Diese Komponente wurde von mir vollständig konzipiert und umgesetzt – als Ergänzung zum visuellen Page-Builder.

Funktionsbeschreibung:

Dieses Panel bietet die zentrale Steuerung aller Seiteneigenschaften – unabhängig vom visuellen Inhalt.
Funktionen:

• Slug-Vergabe für SEO-optimierte URLs
• Routenwahl für API-gestützte Seiten (z.B. app_public_index)
• Statusverwaltung (sichtbar, intern, deaktiviert)
• Kategorisierung für Filter, Navigation & Layout

Sichtbarkeit von Header/Footer steuerbar (Landingpages, Logins etc.). Auswahl von Titelbildern, Teasern und Attributen für Designregeln.

Ansicht:

Die Seite zeigt die Übersicht aller Beitragskategorien. In diesem Beispiel ist eine Kategorie mit dem Titel „Allgemein“ vorhanden.
Angezeigt werden:

• Titel und Beschreibung
• SEO-Status (aktiv/inaktiv)
• Vorhandenes Titelbild
• Anzahl zugeordneter Beiträge
• Schnellaktionen:
• Bearbeiten der Kategorie
• Kategorie Design (Layout, Farben, Darstellung)
• Beitrag Design (Einzeldarstellung von Beiträgen)
• Beitrags Loop (Listenansicht dieser Kategorie)

Beschreibung:

Zur Organisation von redaktionellen Inhalten bietet mein CMS eine integrierte Beitragskategorie-Verwaltung. Jede Kategorie kann mit SEO-Informationen, Titelbild und Beschreibung versehen werden. Darüber hinaus stehen eigene Layouts zur Verfügung – sowohl für die Darstellung einzelner Beiträge als auch für die Listenansicht (Loop). Diese Konfiguration wird direkt mit dem Page-Builder und dem Modulsystem verknüpft. Die gesamte Architektur – von der Datenbankstruktur bis zur Redaktionsoberfläche – wurde von mir entwickelt.

Funktionsbeschreibung:

Diese Komponente ermöglicht die Verwaltung von Beitragskategorien, wie sie für Blogs, Newsbereiche oder Projekte benötigt werden.
Funktionen:

• Anlegen & Bearbeiten von Kategorien mit Beschreibung, Titelbild & SEO
• Steuerung der Darstellung pro Kategorie (Design, Layout, Loop)
• Zuweisung von Beiträgen zu Kategorien
• Categorization for filters, navigation & layout

Grundlage für automatische Ausgabe in Seiten über Beitragselemente. Exportfähig, filterbar, in Drag & Drop sortierbar.

Ansicht:

Die Seite zeigt die zentrale Übersicht aller Formulare, die im CMS angelegt wurden. Zu sehen sind:

• Bezeichnung (z.B. „Heinz Anmelden“, „Partner werden“)
• Formular-ID
• Erstellt am (inkl. Uhrzeit)
• Aktionen pro Formular:
• Vorschau / Darstellung
• Einbindecode / Nutzung
• E-Mail-Benachrichtigung
• Zugriff auf den Form-Builder
• Löschen

Beschreibung:

Mein CMS enthält ein eigenes Formularsystem mit Builder-Logik. Über die Verwaltungsübersicht können Redakteur:innen bestehende Formulare einsehen, bearbeiten oder neu erstellen. Jedes Formular erhält eine eindeutige ID, ein Erstellungsdatum sowie Zugriff auf Vorschau, Mailrouting, Builder und Einbindung. Die E-Mail-Einstellungen und der Posteingang sind direkt verknüpft. Dieses System habe ich vollständig entwickelt – inklusive Builder, Validierung, E-Mail-Routing und API-Einbindung.

Funktionsbeschreibung:

Dieses Modul ist die zentrale Verwaltungsstelle aller Formulare im System.
Funktionen:

• Formulare benennen & strukturieren
• Sicht auf ID & Erstellzeitpunkt
• Builder-Zugriff für visuelle Bearbeitung
• Vorschau der Darstellung und Konfiguration
• E-Mail-Verknüpfung einsehen und anpassen

Zählung & Verwaltung der eingegangenen Nachrichten (Posteingang)

Ansicht:

Die Seite zeigt das Formular „Heinz Anmelden“ im Builder-Modus. Zu sehen ist:

• Texteingaben: Name, Unternehmen, E-Mail, Homepage
• Checkbox-Gruppe (z.B. „DRINKS & FOOD“)
• Freier HTML-Textblock mit Infohinweis
• Datei-Upload (Drag & Drop)
• Datenschutzerklärung

Beschreibung:

Mit dem integrierten Formular-Builder lassen sich beliebige Formulare intuitiv erstellen – von einfachen Kontaktfeldern bis hin zu komplexen Anmeldeprozessen mit Upload und Bedingungen. Jedes Feld ist individuell konfigurierbar (Pflicht, Label, Beschreibung, CSS) und per Drag & Drop verschiebbar. Neben Standardfeldern bietet das System auch Datenschutz-Checkboxen, HTML-Blöcke, mehrseitige Formulare und Datei-Uploads. Ich habe diesen Builder vollständig umgesetzt – inklusive Backend-Verarbeitung, E-Mail-Anbindung und Datenstruktur.

Funktionsbeschreibung:

Dieser Builder erlaubt es, komplexe Formulare visuell zusammenzustellen.
Funktionen:

• Drag & Drop von Feldern
• Mehrseitige Formulare möglich
• Feldtypen: Text, E-Mail, Checkbox, HTML, Datei, Datenschutz, Button
• Vollständig konfigurierbar: Pflicht, Placeholder, CSS, Labels
• Integration in Mailversand, Bedingungen, Datenexport
• HTML-Inhalte & mehrsprachige Unterstützung
• Responsiv und semantisch korrekt

Jedes Feld ist per Drag & Drop verschiebbar.

Ansicht:

Das Modal „Felder“ im Form-Builder zeigt die verfügbaren Feldtypen, sortiert in Kategorien:

• Text, E-Mail, Nummer, Textarea, URL, Telefon, Passwort, Versteckt, Button, TinyMCE (WYSIWYG)
• Dropdown-Auswahl (Select), Checkbox, Radio, Schalter (Toggle), Datum, Farbwahl, Datenschutz-Checkbox
• Drag & Drop Uploadfeld
• HTML-Block, HR (Trennlinie)
• Kreditkartennummer, Ablaufdatum, CVC-Code
• Slider, Sternebewertung
• cms.gallery.16.screenArray.6

Beschreibung:

Zur flexiblen Gestaltung von Formularen enthält mein CMS ein modulares Feldsystem mit über 25 vorgefertigten Elementen. Diese sind in Funktionsgruppen gegliedert und decken alle gängigen Eingabetypen ab – von einfachen Textfeldern über Farbwähler und Uploads bis hin zu eCommerce-Feldern. Durch die klare Trennung von „Basic“, „Select“, „Inhalt“ und „Extras“ wird die Usability deutlich verbessert. Das gesamte System ist erweiterbar, validierungsfähig und direkt mit dem Backend, dem Mailer und dem Datenexport verbunden – vollständig von mir entwickelt.

Funktionsbeschreibung:

Dieses Modul ermöglicht die freie Auswahl und Kombination von Feldern für jedes Formular.
Funktionen:

• Jedes Feld per Klick oder Drag & Drop einfügbar
• Erweiterbar durch eigene Typen
• Dynamisch geladen & gruppiert nach Funktion

Technisch angebunden an die Formular-Validierung, E-Mail- und Datenverarbeitung. Einige Felder (z.B. Datenschutz) mit festem Verhalten (Pflichtfeld, HTML-Integration).

Ansicht:

In der Ansicht „Formular Bedingungen“ wird eine Regel mit dem Namen „Datenschutz“ bearbeitet.:

• Bedingung:
• Wenn das Feld Datenschutz privacy-check ist 1 (aktiviert/angehakt) dann Button aktivieren

Beschreibung:

Neben dem Builder und responsiven Layout bietet mein Formularsystem auch eine mächtige Bedingungslogik. Felder können abhängig von Nutzeraktionen ein- oder ausgeblendet, aktiviert oder deaktiviert werden. Ob Pflichtfelder, Uploads oder Absende-Buttons – alles lässt sich dynamisch steuern. Diese Logik ist tief in das Formularmodell eingebunden und wurde von mir vollständig umgesetzt – inklusive Interface, Validierung, API-Verhalten und Verknüpfung zur E-Mail-Konfiguration.

Funktionsbeschreibung:

Mit diesem Modul lassen sich dynamische Bedingungen und Sichtbarkeiten für Formularfelder festlegen.
Funktionen:

• Bedingungen pro Feldtyp (z.B. Checkbox, Select, Wertfelder)
• Aktivieren / Deaktivieren
• Pflichtstatus setzen
• E-Mail-Ziel ändern
• Kombinierbare Regeln: mehrere Bedingungen pro Aktion

Intuitive Verknüpfung mit Feldern und Builder-Struktur. Unterstützt auch mehrschrittige Formulare.

Ansicht:

Im Reiter „Formular-Einstellungen“ befinden sich zwei Hauptbereiche:

• Linke Seite – „Formular Spalten“
• Spalten nicht umbrechen, < 575px (sm), < 767px (md), < 991px (lg) ← ausgewählt, < 1199px (xl), < 1399px (xxl)
• Rechte Seite – „Responsive Einstellungen – Raster“
• Auswahl: Formular Gutter z.B. Gutter 3 (g-3)
• Freitextfeld für individuelles Raster, z.B. gx-1 gy-2

Beschreibung:

Zur optimalen Darstellung von Formularen auf unterschiedlichen Geräten enthält mein CMS ein konfigurierbares Responsiv-Layout. Redakteur:innen können per Mausklick bestimmen, ab welcher Bildschirmbreite Felder untereinander erscheinen sollen. Zusätzlich lassen sich vertikale und horizontale Abstände (Gutter) gezielt beeinflussen – optional sogar mit individuellem CSS-Raster. Diese Funktion ist tief im Formularsystem integriert und wurde vollständig von mir umgesetzt – inklusive Frontend-Raster, Builder-Einstellungen und Live-Vorschau.

Funktionsbeschreibung:

Dieser Bereich erlaubt die präzise Steuerung des Layoutverhaltens eines Formulars im Responsive Design.
Funktionen:

• Definition des Breakpoints, ab wann Felder umbrechen (1-spaltig vs. 2-spaltig)
• Bootstrap Rasterlogik mit Gutter (gx, gy) zur Abstandskontrolle
• Vollständig kompatibel mit Grid-Designs & responsivem Verhalten

Optimiert für mobile Darstellung & Barrierefreiheit.

Ansicht:

Die Seite zeigt eine Übersicht aller konfigurierbaren Systemmeldungen eines Formulars. Diese erscheinen während der Eingabe, beim Absenden, bei Fehlern oder bei Upload-Problemen.

Beschreibung:

Ob erfolgreich abgesendet, als Spam erkannt oder Upload zu groß – jede Reaktion des Systems ist durch den Nutzer einstellbar. Ich habe ein zentrales System zur Konfiguration aller Systemmeldungen pro Formular entwickelt. Texte lassen sich live ändern, strukturieren oder erweitern – ganz ohne Code. Auch komplexere Validierungsfälle (z.B. Mindestanzahl an Dateien, Dateitypen) haben eigene Meldungen.

Funktionsbeschreibung:

Diese Meldungen erscheinen automatisch im Formular-Frontend – und können sprachlich wie gestalterisch angepasst werden.
Funktionen:

• Alle Texte sind vollständig editierbar
• Platzhalter möglich (z.B. {maxFilesize})
• Mehrsprachige Erweiterung vorbereitet
• Optional: Texte mit Icons oder HTML versehen
• Klare Trennung nach Funktion (Versand, Validierung, Upload, Pflichtfelder)

Hier lassen sich alle Rückmeldungen für das Formularverhalten zentral verwalten.

Ansicht:

Das Bild zeigt die E-Mail-Konfiguration für ein Formular.

Beschreibung:

Jedes Formular lässt sich mit einer eigenen E-Mail-Konfiguration verknüpfen – vom Betreff bis zur dynamischen Nachricht mit Platzhaltern. Ich habe eine flexible Platzhalter-Logik entwickelt, mit der sowohl eigene Felder als auch automatische Zusammenfassungen ({summary}) genutzt werden können. Zudem ist ein WYSIWYG-Editor integriert, mit dem sich auch HTML-basierte Layouts gestalten lassen. Für zusätzliche Sicherheit und Transparenz lässt sich eine automatische Antwort an Absender aktivieren – vollständig konfigurierbar.

Funktionsbeschreibung:

Hier wird definiert, an wen das Formular sendet und wie die Nachricht aussieht.
Funktionen:

• Beliebig viele Empfänger (getrennt mit Komma oder Semikolon)
• Verwendung von Platzhaltern für dynamische Inhalte
• HTML-Editor zur Gestaltung der E-Mail
• summary - Platzhalter generiert automatisch eine tabellarische Übersicht aller ausgefüllten Felder

Unterstützung für automatische Bestätigungsmails an Absender (Double Opt-In möglich)