Frameworks

Frameworks im Keimeno Backend

Frameworks bestimmen den grundlegenden Aufbau einer Keimeno Website. Sie bilden den gemeinsamen Seitenrahmen und legen fest, an welchen Stellen der Content-Manager Inhalte aufnehmen kann. Typische Bestandteile sind beispielsweise Kopfbereich, Navigation, Hauptinhalt, zusätzliche Inhaltsspalten und Fußbereich.

Ein Framework ist damit mehr als eine optische Vorlage: Es verbindet das HTML-Grundgerüst der Website mit den bearbeitbaren Inhaltspositionen einer Seite. Redakteurinnen und Redakteure können anschließend Widgets, HTML-Texte, Script-Code oder System-Templates in diese Positionen einsetzen, ohne den eigentlichen Rahmen verändern zu müssen.

Aufgaben eines Frameworks

Ein Framework kann unter anderem folgende Aufgaben übernehmen:

• den übergeordneten HTML-Aufbau einer Seite bereitstellen,
• wiederkehrende Bestandteile wie Header, Navigation, Breadcrumb und Footer einbinden,
• eine oder mehrere bearbeitbare Inhaltspositionen definieren,
• unterschiedliche Seitenlayouts für verschiedene Seitentypen bereitstellen,
• den Content-Manager passend zum gewählten Layout strukturieren und
• gemeinsame CSS- und JavaScript-Erweiterungen für das Layout hinterlegen.

So kann beispielsweise ein kompaktes einspaltiges Framework für Landingpages und ein mehrspaltiges Framework für redaktionelle Inhaltsseiten verwendet werden. Welche Frameworks tatsächlich zur Auswahl stehen, hängt von der jeweiligen Keimeno Installation und dem eingerichteten Website-Design ab.

Framework-Templates verwalten

Framework-Templates werden im Bereich der globalen beziehungsweise System-Templates verwaltet. Öffnen Sie dort das gewünschte Template oder legen Sie über Neu anlegen ein neues Template an. Ein vorhandenes Template lässt sich aus der Übersicht über Bearbeiten öffnen.

Im Template-Editor stehen – abhängig von Installation, Berechtigungen und Template – unter anderem folgende Einstellungen zur Verfügung:

• Titel beziehungsweise Beschreibung: Eine verständliche interne Bezeichnung, über die das Framework später im Seiteneditor ausgewählt wird.
• Template-Name: Die technische Bezeichnung des Templates. Sie sollte eindeutig sein und nach der produktiven Nutzung nicht ohne Prüfung geändert werden.
• App Connection: Ordnet das Template dem System oder einer App zu. Allgemeine Website-Frameworks werden üblicherweise dem System beziehungsweise der für das Design vorgesehenen Komponente zugeordnet.
• Framework Template: Kennzeichnet das globale Template als auswählbares Seiten-Framework.
• Admin GUI Framework: Legt fest, welche grafische Spot-Anordnung der Content-Manager für dieses Framework verwendet.
• HTML-/Template-Inhalt: Enthält das Grundgerüst, Includes und die Platzhalter für bearbeitbare Positionen.
• CSS und JavaScript: Können ergänzendes, templatebezogenes Verhalten und Styling aufnehmen.

Die Schaltfläche beziehungsweise Option Framework Template macht ein Template in der Framework-Auswahl des Seiteneditors verfügbar. Bei einem als Framework markierten Template erscheint zusätzlich die Auswahl Admin GUI Framework. Die Option Template Auswahl aktivieren ist für gewöhnliche System-Templates vorgesehen und wird bei Framework-Templates nicht als Layout-Auswahl verwendet.

Inhaltspositionen mit TMPL_SPOT definieren

Bearbeitbare Bereiche werden im Framework-Code mit Platzhaltern nach folgendem Schema angelegt:

{TMPL_SPOT_1}
{TMPL_SPOT_2}
{TMPL_SPOT_3}

Die Zahl hinter TMPL_SPOT_ ist die eindeutige Positionsnummer. Der Content-Manager ordnet alle Inhalte über diese Nummer dem richtigen Bereich zu. Eine vereinfachte Framework-Struktur kann beispielsweise so aussehen:

<% include file="fw_header.tpl" %>
<% include file="menu_tree.tpl" %>
<main class="page-main">
    {TMPL_SPOT_1}
</main>
{TMPL_SPOT_3}
<% include file="fw_footer.tpl" %>

In diesem Beispiel nimmt Spot 1 den Hauptinhalt auf. Spot 3 kann beispielsweise für einen zusätzlichen Bereich vor dem Footer verwendet werden. Die konkrete Bedeutung richtet sich nach der Zuordnung im Admin GUI Framework.

Admin GUI Framework und Positionen

Keimeno kennt für die Backend-Darstellung die Positionen Header, Left, Main, Second Main, Right und Footer. Ein Admin GUI Framework ordnet diesen Positionen die im Template verwendeten Spot-Nummern zu. Nicht jedes Layout muss alle Positionen verwenden.

Die aktuelle Zuordnung lässt sich in der Framework-Verwaltung ansehen. Nach Auswahl einer Framework-Nummer zeigt die grafische Vorschau, welche Spot-Nummer den einzelnen Bereichen zugeordnet ist. Diese Verwaltungsansicht dient der Abstimmung des Backend-Editors mit dem Template. Die dort dargestellten Felder sind in der aktuellen Oberfläche schreibgeschützt; die eigentliche Zuordnung gehört daher zur technischen Einrichtung des Frameworks.

Beim Laden einer Seite prüft Keimeno das ausgewählte Framework-Template auf vorhandene {TMPL_SPOT_n}-Platzhalter. Nur erkannte und zugeordnete Positionen werden regulär im Content-Manager aufgebaut. Für bestehende Daten ist zusätzlich eine technische Fallback-Erkennung vorhanden, sie ersetzt jedoch keine korrekt gepflegte Framework-Konfiguration.

Ein Framework einer Seite zuweisen

1. Öffnen Sie im Websitemanager die gewünschte Seite.
2. Wechseln Sie in den Bereich beziehungsweise Tab Einstellungen.
3. Wählen Sie im Feld Framework das gewünschte Layout aus.
4. Speichern Sie die Seiteneinstellungen.
5. Kontrollieren Sie anschließend den Content-Manager und die Vorschau der Seite.

Nach dem Speichern lädt der Content-Manager die Positionen des ausgewählten Frameworks. Jede Position wird mit ihrer Bezeichnung angezeigt, beispielsweise main, header oder footer. Über die Plus-Schaltfläche können passende Inhalte hinzugefügt werden.

Inhalte in Framework-Positionen pflegen

Innerhalb jeder sichtbaren Position stehen die Funktionen des Content-Managers zur Verfügung. Je nach Berechtigung und Inhaltstyp können Sie:

• über die Plus-Schaltfläche neue Inhalte einfügen,
• HTML-Texte, Widgets, Script-Code oder System-Templates auswählen,
• vorhandene Elemente öffnen und bearbeiten,
• Elemente per Drag-and-drop innerhalb einer Position sortieren,
• Widgets klonen oder auf eine andere Seite kopieren,
• den dargestellten Freigabestatus eines Elements erkennen und
• nicht mehr benötigte Elemente löschen.

Die Sortierung gilt innerhalb der jeweiligen Spot-Nummer. Ein Element wird dadurch nicht automatisch in eine andere Framework-Position verschoben. Beim Kopieren auf eine andere Seite bietet Keimeno nur Zielpositionen an, die das Framework der Zielseite bereitstellt.

Vererbung von Inhaltspositionen

Für Unterseiten können komplette Framework-Positionen aus der übergeordneten Seite übernommen werden. Im Content-Manager wird diese Funktion über das Schloss-Symbol der jeweiligen Position gesteuert:

• Entsperrtes Schloss: Die Position enthält eigene, lokal gepflegte Inhalte.
• Gesperrtes Schloss: Die Position übernimmt die Inhalte der übergeordneten Seite.

Vererbte Elemente werden im Editor mit einem Schloss gekennzeichnet und können auf der untergeordneten Seite nicht direkt bearbeitet oder sortiert werden. Änderungen erfolgen an der Seite, von der die Inhalte übernommen werden. Wird die Vererbung für eine Position aufgehoben, kann die Unterseite wieder eigene Inhalte in diesem Bereich verwalten.

Die Vererbung eignet sich besonders für wiederkehrende Seitenbereiche wie Kontaktboxen, Hinweise, Aktionsflächen oder ergänzende Navigationen. Sie arbeitet positionsbezogen: Eine Seite kann beispielsweise den rechten Bereich erben und den Hauptinhalt dennoch individuell pflegen.

Mehrsprachige Frameworks

System- und Framework-Templates können sprachabhängige Inhalte besitzen. Der Editor bietet – sofern die Mehrsprachigkeit der Installation dies zulässt – eine Sprachauswahl und Funktionen zum Replizieren eines Inhalts auf weitere Sprachen.

Beim Replizieren werden bestehende Inhalte der Zielsprachen überschrieben. Verwenden Sie diese Funktion deshalb nur, wenn alle Zielversionen tatsächlich denselben Stand erhalten sollen. Strukturelle Änderungen an Spot-Platzhaltern sollten in allen Sprachversionen identisch nachvollzogen werden, damit der Content-Manager unabhängig von der gewählten Sprache dieselben Positionen erkennt.

CSS, JavaScript und eingebundene Teil-Templates

Frameworks können weitere System-Templates über Template-Includes einbinden. Im ausgelieferten Aufbau werden beispielsweise Vorlagen für Header, Menübaum, Breadcrumb und Footer verwendet. Dadurch bleiben wiederkehrende Bestandteile getrennt pflegbar.

Templatebezogenes CSS und JavaScript sollte gezielt und sparsam eingesetzt werden:

• CSS-Klassen möglichst eindeutig benennen, damit andere Seitenbereiche nicht unbeabsichtigt beeinflusst werden.
• JavaScript nicht mehrfach initialisieren, wenn dasselbe Framework oder Teil-Template mehrfach eingebunden wird.
• Vor dem Entfernen eines Includes prüfen, welche Navigation, Metadaten oder Funktionen davon abhängen.
• Änderungen an globalen Bestandteilen immer auf mehreren Seitentypen und Bildschirmgrößen testen.

Empfohlener Arbeitsablauf

1. Anforderung festlegen: Definieren Sie, welche Inhaltsbereiche das neue Layout benötigt.
2. Spot-Konzept erstellen: Legen Sie feste Nummern für Hauptinhalt und zusätzliche Bereiche fest.
3. Framework-Template vorbereiten: Erstellen oder duplizieren Sie ein geeignetes globales Template und ergänzen Sie die benötigten TMPL_SPOT-Platzhalter.
4. Als Framework kennzeichnen: Aktivieren Sie Framework Template und wählen Sie das passende Admin GUI Framework.
5. Testseite verwenden: Weisen Sie das Framework zunächst einer nicht produktiven Seite zu.
6. Content-Manager kontrollieren: Prüfen Sie, ob alle Positionen sichtbar, verständlich bezeichnet und richtig angeordnet sind.
7. Inhalte und Vererbung testen: Fügen Sie Testwidgets ein und kontrollieren Sie Sortierung, Bearbeitung, Kopieren sowie die Vererbung auf eine Unterseite.
8. Frontend prüfen: Testen Sie Desktop- und Mobilansicht, Navigation, Links, Formulare und eingebundene Scripts.
9. Erst danach produktiv einsetzen: Weisen Sie das Framework den vorgesehenen Seiten zu und prüfen Sie jede geänderte Seite.

Sichere Änderungen an bestehenden Frameworks

• Erstellen Sie vor größeren Änderungen eine Sicherung oder eine Kopie des Templates.
• Ändern Sie bestehende Spot-Nummern möglichst nicht; ergänzen Sie lieber eine neue Position.
• Entfernen Sie einen Spot erst, nachdem geprüft wurde, ob Seiten dort noch Inhalte gespeichert haben.
• Kontrollieren Sie alle Sprachversionen des Frameworks.
• Berücksichtigen Sie Seiten, die Inhalte aus einer übergeordneten Seite erben.
• Prüfen Sie nach Änderungen sowohl den Content-Manager als auch das veröffentlichte Frontend.
• Bearbeiten Sie HTML-, CSS- und JavaScript-Code nur mit den dafür erforderlichen Kenntnissen und Berechtigungen.

Typische Fehler und Lösungen

Das Framework erscheint nicht in der Seitenauswahl

Prüfen Sie, ob das globale Template als Framework Template gekennzeichnet und gespeichert wurde. Auch die Berechtigung und die Zuordnung des Templates können die Sichtbarkeit beeinflussen.

Eine Position fehlt im Content-Manager

Kontrollieren Sie, ob der Framework-Code einen korrekt geschriebenen Platzhalter wie {TMPL_SPOT_1} enthält und ob diese Nummer im gewählten Admin GUI Framework einer Position zugeordnet ist. Prüfen Sie außerdem die Sprachversion des Templates.

Vorhandene Inhalte sind nach einem Framework-Wechsel nicht sichtbar

Das neue Framework verwendet wahrscheinlich andere Spot-Nummern. Wechseln Sie bei Bedarf zum bisherigen Framework zurück und dokumentieren Sie die belegten Positionen. Eine gezielte Übertragung sollte anschließend durch eine entsprechend berechtigte Person erfolgen.

Ein vererbtes Widget lässt sich nicht bearbeiten

Das ist beabsichtigt. Gesperrte Inhalte stammen aus der übergeordneten Seite. Bearbeiten Sie die Quelle oder lösen Sie die Vererbung für die gesamte Position, wenn die Unterseite eigene Inhalte erhalten soll.

Die Backend-Anordnung passt nicht zur Website

Prüfen Sie das ausgewählte Admin GUI Framework und gleichen Sie seine Positionsnummern mit den TMPL_SPOT-Nummern im Framework-Template ab. Die grafische Backend-Darstellung und das Frontend-HTML sind getrennte Ebenen und müssen bewusst aufeinander abgestimmt werden.

Zusammenfassung

Frameworks geben Keimeno Seiten einen einheitlichen, wiederverwendbaren Rahmen. Das Framework-Template definiert die technische Ausgabe und die TMPL_SPOT-Platzhalter; das Admin GUI Framework übersetzt diese Positionen in eine verständliche Oberfläche für den Content-Manager. Durch eine stabile Nummerierung, sorgfältige Tests und die positionsbezogene Vererbung lassen sich sowohl einfache Landingpages als auch umfangreiche, mehrsprachige Seitenstrukturen sicher pflegen.