Zum Inhalt

Anleitung zu benutzerdefinierten Templates

Was sind benutzerdefinierte dateibasierte Templates?

In SyCes2 kann ein Benutzer mit der Berechtigung Mandanten-Administrator das Captive Portal (Anmeldeseite des Hotspots des Mandanten) entweder mithilfe der Standard Templates per Drag & Drop im Frontend oder mithilfe einer aus einer Datei hochgeladenen Vorlage konfigurieren. Für diesen Template typ kann eine benutzerdefinierte Template-Datei (.tpl) erstellt und auf den Webserver hochgeladen werden.

Benutzerdefinierte Templates erstellen

Um für SyCes2 erstellte benutzerdefinierte Templates zu verwenden, muss eine Datei im .tlp-Format über den Upload-Manager hochgeladen werden. Die hochgeladene .tlp-Datei kann anschließend mit einem Template vom Typ Aus hochgeladener Datei verknüpft werden.

Das Template wird in der Django Login-App im Backend gerendert, ähnlich wie Standardvorlagen. Dadurch können bestimmte Variablen und Funktionen für dateibasierte Vorlagen verwendet werden.

Verwendbare Variablen and Template-Tags in dateibasierten Templates

Template-Tag Beschreibung
{{title}} Standardtitel von SyCes2
{% css %} Standard-Stylesheet von SyCes2
{{date}} Aktuelles Datum und Uhrzeit
{{version}} Softwareversion
{% lang_switch %} Sprachlinks
{% logo %} Standardlogo von SyCes2
{% tos %} Nutzungsbedingungen des Kunden
{{path}} Pfad zum Upload-Verzeichnis des Kunden
{% login_title %} Standardtitel für die Loginmaske
{% login_form %} Standard Loginmaske
{% register_title %} Standardtitel für die Regisrierungsmaske
{% register_form %} Standard Registrierungsmaske
{% rate_info %} Tarif-Information des Standorts
{% register_name_form %} Standard Registrierung mit Namen
{% register_check_form %} Standard Registrierung anonym
{% register_email_form %} Standard Registrierung mit e-mail
{% register_phone_form %} Standard Registrierung mit Telefonnummer

Beispiel-Template

{% load static %}
{% load login_methods %}
<!DOCTYPE HTML>
<html>
    <head>
        <title> {{title}} </title>
        {% css %}
        <!--link rel="stylesheet" href="{{path}}styles.css"-->
    </head>
    <body>
        <div class="left">
            <!--img src="{{path}}subdir/logo2.png" alt="Picture Tag" width="400" height="120"-->
            {% logo %}
        </div>
        <div class="right">
            <p> {{date}} </p>
            <a style="text-decoration: none" href="https://syces.de/"> SyCes® </a>
            <p> Version {{version}} </p>
        </div>
        <div class="center block"></div>
        <div class="center">
            <p> {% lang_switch %} </p>
            <p></p>
        </div>
        <div class="center window">
            <p>{% login_title %}</p>
            <p>{% login_form %}</p>
        </div>
        <p></p>
        <div class="center window">
            <p>{% register_title %}</p>
            <p>{% rate_info %}</p>
            <p>{% register_form %}</p>
        </div>
        <p></p>
    </body>
</html>
  • Die ersten beiden Zeilen, beginnend mit {% load, sind erforderlich, um die Kontextvariablen zu verstehen.
  • Im HTML-Head-Bereich können Sie einen benutzerdefinierten Titel und CSS-Code oder die Standardeinstellungen auswählen.
  • Bilder oder andere Dateien (z. B. .html, .css) lassen sich mit {{path}} verlinken, wobei path das Upload-Verzeichnis des Mandanten ist.
  • Verschiedene Registrierungs- und Login-Methoden stehen als Template-Tags zur Verfügung.
  • Benutzerdefiniertes HTML und CSS ermöglichen die freie Gestaltung benutzerdefinierter Seiten mit einfachem Zugriff auf die Backend-Anmeldefunktionen.