Wie funktioniert die Vorlagenverwaltung?

Die Template-Verwaltung in einem CMS dient der Erstellung wiederverwendbarer HTML- und CSS-Inhalte. So können Sie ein Template erstellen und es mithilfe von Shortcodes in die entsprechenden Bereiche einfügen, anstatt dasselbe Design oder denselben Inhaltsblock auf verschiedenen Seiten immer wieder neu zu schreiben.

Vorlagen können für Preistabellen, Rufzeichen, benutzerdefinierte Informationsboxen, Sprachsimulationen, Paketvergleiche, Kampagnenbereiche oder wiederkehrende benutzerdefinierte Designabschnitte verwendet werden.

Wozu dient die Vorlagenverwaltung?

Die Vorlagenverwaltung ermöglicht die zentrale Verwaltung häufig verwendeter Design- und Inhaltselemente Ihrer Website. Nach der Erstellung einer Vorlage können Sie diese mithilfe von Shortcodes in unterstützten HTML-Inhaltsbereichen aufrufen.

Diese Struktur ist besonders hilfreich, wenn derselbe Inhalt auf mehreren Seiten verwendet wird. Jede Aktualisierung einer Vorlage wird automatisch in allen Bereichen übernommen, in denen diese Vorlage verwendet wird.

Einer der Hauptvorteile der Template-Verwaltung besteht darin, dass sie den Übersetzungsprozess für komplexe HTML-Strukturen sicherer macht. Wird der gesamte HTML-Code in den Übersetzungsprozess einbezogen, können Tag-Struktur, Klassennamen oder das Design-Layout beschädigt werden. Mit der Template-Verwaltung bleibt die HTML-Struktur jedoch erhalten, und es werden nur die als Parameter definierten Textfelder übersetzt.

Beispielsweise können wiederverwendbare Strukturen wie die folgenden als Vorlagen erstellt werden:

• Vergleichstabellen für Verpackungen
• Preis- oder Servicekarten
• CTA-Gebiete
• Informationskästen
• Benutzerdefinierte HTML-Abschnitte
• Google-Sichtbarkeit oder mehrsprachige Simulationen
• Wiederholte Kampagnen oder Werbeblöcke

Wie kann ich auf die Seite „Vorlagenverwaltung“ zugreifen?

Um Vorlagen zu verwalten, können Sie über das linke Menü im Webayt Admin-Panel auf den Abschnitt Vorlagenverwaltung zugreifen.

 Vorlagenverwaltung

Diese Seite listet bereits erstellte Vorlagen auf. Sie können neue Vorlagen hinzufügen, bestehende Vorlagen bearbeiten oder löschen oder deren Shortcodes anzeigen.

Vorlagenliste

Auf dem Hauptbildschirm der Vorlagenverwaltung werden die erstellten Vorlagen in einer Tabelle aufgelistet. Diese Tabelle zeigt den Vorlagennamen, den Shortcode, die Parameterinformationen und den Status an.

Die Listenansicht zeigt im Allgemeinen folgende Informationen an:

• Vorlagenname: Dies ist der Vorlagenname, der im Bedienfeld und bei der Auswahl von Vorlagen angezeigt wird.
• Shortcode: Ein spezieller Code, der verwendet wird, um die Vorlage in Inhaltsbereichen aufzurufen.
• Parameter: Gibt die Anzahl der im Template verwendeten Variablen oder den Parameterstatus an.
• Status: Zeigt an, ob die Vorlage geöffnet oder geschlossen ist.
• Bearbeiten: Wird verwendet, um Vorlageninformationen zu aktualisieren.
• Löschen: Dient zum Entfernen der entsprechenden Vorlage.

Der Template-Shortcode dient dazu, das entsprechende Template innerhalb des Seiteninhalts aufzurufen. Ein Template-Shortcode könnte beispielsweise so aussehen:

 { { template:mock_template_name } }

Wie füge ich eine neue Vorlage hinzu?

Um eine neue Vorlage zu erstellen, gehen Sie zum Tab „Vorlage hinzufügen“ . Auf diesem Bildschirm definieren Sie den Namen, den Shortcode, den HTML-/CSS-Inhalt, die Parameter und den Status der Vorlage.

1. Melden Sie sich im Webayt Admin-Panel an.
2. Im Menü auf der linken Seite wählen Sie „Vorlagenverwaltung“ .
3. Klicken Sie auf die Registerkarte „Vorlage hinzufügen“ .
4. Geben Sie den Vorlagennamen und den Shortcode-Schlüssel ein.
5. Fügen Sie Ihren HTML- oder CSS-Inhalt in den Vorlagenbereich ein.
6. Definieren Sie gegebenenfalls Parameterfelder.
7. Legen Sie den Vorlagenstatus auf Ein oder Aus fest.
8. Speichern Sie die Vorlage, indem Sie auf die Schaltfläche „Hinzufügen “ klicken.

Vorlagen-Einfügefelder

Der Bildschirm zum Hinzufügen oder Bearbeiten von Vorlagen enthält einige Schlüsselfelder, die die Funktionsweise der Vorlage bestimmen.

Vorlagenname

Der Vorlagenname ist der Name, der im Bedienfeld und bei der Vorlagenauswahl angezeigt wird. Dieses Feld sollte aussagekräftig sein, damit Sie die Vorlage später leicht wiedererkennen.

Beispielhafte Vorlagennamen:

 CTA-Pakete
Google-Suchseite
Vorlage für die Websiteverwaltung
Mehrsprachigkeit

Kurzcode-Taste

Der Shortcode-Schlüssel ist der eindeutige Schlüssel, der zum Aufrufen der Vorlage in Inhaltsfeldern verwendet wird. Dieses Feld wird üblicherweise mit Kleinbuchstaben, Zahlen, Bindestrichen und Unterstrichen erstellt.

Wenn der Shortcode-Schlüssel beispielsweise management_plans lautet, kann diese Vorlage im Kontextfeld mit dem folgenden Shortcode aufgerufen werden:

 { { template:mock_template_name } }

Es wird empfohlen, dass der Kurzcode klar ist und den Zweck der Vorlage erklärt.

Vorlagenbereich

Im Template- Bereich schreiben Sie die gewünschte HTML- oder CSS-Struktur. Dieser Abschnitt enthält den Code, der festlegt, wie das Template im Frontend aussieht.

Der Vorlagenbereich kann HTML- und CSS-Registerkarten enthalten. Die HTML-Registerkarte dient der Strukturierung des Inhalts, während die CSS-Registerkarte für die visuelle Bearbeitung gedacht ist.

Wenn Sie in Ihrer HTML-Vorlage bearbeitbare Felder verwenden möchten, können Sie diese in geschweiften Klammern definieren.

 {Titel}
{Beschreibung}
{button_text}

Diese Variablen können automatisch im Parameterfeld der Vorlage aufgelistet und für verschiedene Sprachen separat bearbeitet werden.

Parameter

Der Parameterbereich dient der Verwaltung der in einer HTML-Vorlage definierten Variablen. In diesem Abschnitt werden die in der Vorlage verwendeten Variablen aufgelistet, und es kann der entsprechende Text eingegeben werden.

Wenn beispielsweise die Variable {title} in der HTML-Vorlage definiert ist, kann der zugehörige Titeltext im Parameterfeld eingegeben werden. Ebenso können separate Parameterfelder für Variablen wie {description} , {button_text} oder ähnliche erstellt werden.

Der Hauptzweck von Parametern besteht darin, sicherzustellen, dass während des Übersetzungsprozesses nur der in diesen Feldern eingegebene Text übersetzt wird. Dadurch wird verhindert, dass der gesamte HTML-Code der Vorlage in die Übersetzung einbezogen wird.

Diese Struktur ist besonders wichtig bei Vorlagen mit komplexem HTML-Code. Wird der gesamte HTML-Code an den automatischen Übersetzungsprozess gesendet, können HTML-Tags, Klassennamen, benutzerdefinierte Codes oder die Designstruktur unter Umständen beschädigt werden. Werden jedoch Parameter verwendet, bleibt die HTML- und CSS-Struktur unverändert; es wird lediglich der für den Benutzer sichtbare Textinhalt übersetzt.

Für benutzerdefinierte Designblöcke, mehrspaltige Felder, Preistabellen, Paketvergleiche, erweiterte CTA-Abschnitte oder Inhalte mit komplexem HTML wird daher die Verwendung der Vorlagenverwaltung empfohlen.

Situation

Der Status bestimmt, ob die Vorlage auf der Website verwendet werden kann.

• Klarstellung: Auch wenn es im Template-Inhalt verwendet wird, wird es auf der Website angezeigt.
• Deaktiviert: Die Vorlage wird auf der Website nicht angezeigt, selbst wenn sie im Inhalt verwendet wird.

Wenn eine Vorlage vorübergehend deaktiviert werden muss, ist es möglicherweise sicherer, ihren Status auf „aus“ zu setzen, anstatt sie zu löschen.

Wie verwendet man Vorlagen in Inhalten?

In der Vorlagenverwaltung erstellte Vorlagen können über Shortcodes in Inhaltsfeldern aufgerufen werden, in die HTML eingegeben werden kann.

Wenn Sie beispielsweise den folgenden Shortcode in einen unterstützten Inhaltseditor einfügen, wird die entsprechende Vorlage automatisch in diesem Feld angezeigt:

 { { template:mock_template_name } }

Mit dieser Funktion können Sie ein zuvor erstelltes Design schnell auf verschiedenen Seiten einfügen.

Vorlagen eignen sich generell für Bereiche, in denen HTML-Inhalte eingegeben werden können. Beispielsweise sind Vorlagen-Shortcodes auf Informations- und Abschnittsseiten, Kategorieseiten, Inhaltsseiten und in benutzerdefinierten HTML-Inhaltsbereichen empfehlenswert.

Vorlagenauswahl über den Editor

Webayt Im CMS-Editor können Sie die verfügbaren Vorlagen über eine Dropdown-Liste oder einen Vorlagenauswahlbereich anzeigen lassen. Wählen Sie die gewünschte Vorlage aus diesem Bereich aus, um den Shortcode im Editor hinzuzufügen.

Wird eine Vorlage ausgewählt, wird deren Shortcode in den Editor eingefügt. Beim Anzeigen der Seite im Frontend wird jedoch anstelle dieses Shortcodes der tatsächliche HTML-Code der Vorlage angezeigt.

Wie verwende ich die Vorlagenvorschau?

Sie können sich mithilfe der Vorschauoption im Vorlagenbearbeitungsbildschirm ansehen, wie Ihre Vorlage aussehen wird.

Das Vorschaufenster zeigt Ihnen, wie die Vorlage im Frontend aussehen wird. So können Sie Design, Text und Layout vor der Veröffentlichung der Vorlage überprüfen.

Das Vorabprüfen von Vorlagen, insbesondere solchen, die HTML und CSS enthalten, ist hilfreich, um fehlerhafte Layouts oder fehlende Parameter zu erkennen.

Der Vorteil der Verwendung von Parametern in Vorlagen

Parameter machen Vorlagen flexibler und sicherer. Sie sind besonders nützlich, wenn Sie nur den Titel, die Beschreibung, den Schaltflächentext oder ähnliche bearbeitbare Inhalte verwalten möchten, während die HTML-Struktur erhalten bleibt.

Innerhalb einer Vorlage werden veränderbare Felder mithilfe von geschweiften Klammern definiert. Beispielsweise können Felder wie {title} , {description} oder {button_text} als Parameter verwendet werden.

Einer der wichtigsten Vorteile von Parametern ist, dass im automatischen Übersetzungsprozess nur deren Inhalt übersetzt wird. Die gesamte HTML-Struktur der Vorlage wird somit nicht in den Übersetzungsprozess einbezogen.

Dies ist besonders wichtig bei Designs mit komplexem HTML-Code. Wird der gesamte HTML-Code zur Übersetzung gesendet, können Tag-Struktur, Klassennamen, benutzerdefinierte Codes oder das Layout unter Umständen beschädigt werden. Bei Verwendung der Template-Verwaltung bleibt die HTML-Struktur jedoch erhalten, und es wird nur der in den Parameterfeldern eingegebene Text übersetzt.

Daher empfiehlt es sich, die Vorlagenverwaltung für benutzerdefinierte Designblöcke, fortgeschrittene HTML-Strukturen, mehrspaltige Felder, Preistabellen, Vergleichstabellen oder wiederverwendbare benutzerdefinierte Inhaltsabschnitte zu verwenden.

Nehmen wir beispielsweise an, Sie erstellen ein CTA-Feld (Call-to-Action). Wenn Sie Felder wie Titel, Beschreibung und Schaltflächentext als Parameter definieren, können Sie diese mit unterschiedlichen Texten verwenden, ohne die Designstruktur zu beeinträchtigen, und sicherstellen, dass während des Übersetzungsprozesses nur diese spezifischen Texte übersetzt werden.

Verwendung von Vorlagen auf mehrsprachigen Websites

Webayt In Content-Management-Systemen (CMS) können Parametertexte, die in Templates verwendet werden, in verschiedene Sprachen übersetzt werden. Dadurch kann dieselbe Template-Struktur mit unterschiedlichen sprachlichen Inhalten auf mehrsprachigen Websites verwendet werden.

Bei der Vorlagenverwaltung bleibt die HTML- und CSS-Struktur unverändert; der Übersetzungsprozess erfolgt anhand des in die Parameterfelder eingegebenen Textes. Diese Struktur trägt dazu bei, die Beschädigung komplexen HTML-Codes während der Übersetzung zu verhindern.

Daher kann es bei der Erstellung von Inhalten mit benutzerdefiniertem HTML für mehrsprachige Websites vorteilhafter sein, mit der Vorlagenverwaltung zu arbeiten, anstatt lange und komplexe HTML-Codes direkt in den Seiteneditor einzufügen.

Nach Änderungen an der Vorlage müssen die entsprechenden Listen möglicherweise aktualisiert werden. Ausführliche Informationen zum Aktualisieren von Listen und zum Auswählen der Übersetzungssprache finden Sie im Leitfaden „Wie verwende ich Listen zum Aktualisieren?“ .

Was ist bei der Aktualisierung der Vorlage zu beachten?

Wenn Sie eine Vorlage aktualisieren, kann sich dies auch auf das Erscheinungsbild der Seiten auswirken, auf denen diese Vorlage verwendet wird. Daher ist es wichtig, die bestehenden Nutzungsmuster zu überprüfen, bevor Sie Änderungen vornehmen, insbesondere an häufig verwendeten Vorlagen.

• Prüfen Sie, auf welchen Seiten die Vorlage verwendet wird.
• Änderungen nach HTML- und CSS-Anpassungen in der Vorschau anzeigen.
• Stellen Sie sicher, dass in den Parameterfeldern kein Text fehlt oder fehlerhaft ist.
• Stellen Sie sicher, dass der Vorlagenstatus aktiviert ist.
• Aktualisieren Sie gegebenenfalls die entsprechenden Listen.
• Wenn Caching aktiviert ist, aktualisieren Sie den Cache für diese Seite.

Was ist bei der Verwendung von Vorlagen zu beachten?

Die Vorlagenverwaltung ist ein leistungsstarkes Werkzeug, das die Erstellung wiederkehrender Inhalte erleichtert. Es ist jedoch entscheidend, dass die Vorlagen übersichtlich und leicht verständlich sind.

• Wählen Sie im Bedienfeld einen leicht verständlichen Vorlagennamen.
• Schreiben Sie den Kurzcode auf einfache und beschreibende Weise.
• Halten Sie Ihren HTML- und CSS-Code übersichtlich.
• Definieren Sie die Parameternamen auf verständliche Weise.
• Definieren Sie den zu übersetzenden Text nach Möglichkeit als Parameter.
• Achten Sie auf die korrekte Verwendung der Parameter, um zu verhindern, dass komplexer HTML-Code während der automatischen Übersetzung beschädigt wird.
• Vermeiden Sie es, unnötigerweise mehrere Vorlagen für denselben Zweck zu erstellen.
• Bevor Sie nicht verwendete Vorlagen löschen, prüfen Sie, ob diese auf aktiven Seiten verwendet werden.
• Prüfen Sie die Vorlage anhand einer Vorschau, bevor Sie sie veröffentlichen.

Wann sollte Template-Management verwendet werden?

Wenn Sie denselben Designblock an mehreren Stellen verwenden müssen oder wenn benutzerdefinierte HTML-Strukturen in Ihren Inhalten wiederholt werden, ist die Verwendung der Vorlagenverwaltung sehr nützlich.

Die Erstellung einer Vorlage kann in folgenden Situationen sinnvoll sein:

• Wenn Sie dasselbe CTA-Feld auf verschiedenen Seiten verwenden möchten
• Wenn Sie Paket-, Preis- oder Vergleichsfelder zentral verwalten möchten.
• Wenn Sie nicht wiederholt benutzerdefinierte HTML-Blöcke eingeben möchten
• Wenn Sie dasselbe Design mit unterschiedlichen Texten in mehrsprachigen Inhalten verwenden möchten
• Wenn Sie verhindern möchten, dass komplexer HTML-Code während der automatischen Übersetzung beschädigt wird.
• Wenn Sie vorgefertigte Designblöcke zum Editor hinzufügen möchten

Zusammenfassung

Die Vorlagenverwaltung ist der Bereich im CMS Webayt, in dem wiederverwendbare HTML- und CSS-Inhalte erstellt werden. Die erstellten Vorlagen können in Inhaltsbereichen verwendet werden, in denen HTML-Code über Shortcodes eingefügt werden kann.

Durch die Verwendung von Parametern in Vorlagen lassen sich bearbeitbare Felder definieren. So wird sichergestellt, dass bei der automatischen Übersetzung nur der Inhalt dieser Parameter übersetzt wird und komplexe HTML-Strukturen werden nicht beschädigt. Diese Struktur ermöglicht es, dieselbe Designvorlage sicherer auf verschiedenen Seiten und in verschiedenen Sprachen zu verwenden.

Nach der Änderung der Vorlage denken Sie bitte daran, gegebenenfalls die entsprechenden Listen im Abschnitt „Zu aktualisierende Listen“ zu aktualisieren.