Sie können (in der Premium- oder Plus-Version) alternativ zu den Standard-Layouts auch ein individuelles Layout auf Basis eines HTML-Templates erstellen und damit Ihre "Corporate Identity" umsetzen.
Sollten Sie hierbei Unterstützung benötigen, dann kontaktieren Sie uns einfach.
Voraussetzungen:
Download Beispiel
Minimales Beispiel-Template:
<html>
<head>
   <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
   <link rel="stylesheet" type="text/css" href="{#LAYOUT:main.css#}">
   {#STYLES#}
   <title>{#TITLE#}</title>
</head>
<body>
{#OPTION:b#} <img src="{#LAYOUT#}logo.png"> {#/OPTION:b#}
<!-- Top-Menü --> <div style="background-color:#a0a0ff; width:1200px; padding: 2px;"> {#MODULES#} | <a href="{#MODULELINK#}" class="{#MODULECLASS#} {#MODULESELECTED#}">{#MODULENAME#}</a>{#/MODULES#} </div> <p>
<!-- linkes Navigations-Menü --> {#OPTION:m#} <div style="float:left; width:200px;"> <div style="background-color:#a0a0ff;"> {#MENU#} </div>
<div style="background-color:#a0a0ff;"> {#LOGINVERTICAL#} </div> <p>
<div style="background-color:#a0a0ff;"> {#LOGININFO#} </div> <p>
<div style="background-color:#a0a0ff;"> {#ROLLENINFO#} </div> </div> {#/OPTION:m#}
<!-- Content --> <div style="float:left; width:1000px"> {#CONTENT#} </div> <div style="clear:left;"></div>
</body> </html>
Alle Platzhalter:
PlatzhalterBeschreibung
{#LAYOUT#}Das Verzeichnis files/layout/
{#LAYOUT:datei#}Datei im Layout-Verzeichnis (files/layout oder /admin/layout/LAYOUTNAME) mit Revisionsangabe
(um bei neuer Datei den Brower-Cache zu aktualisieren).
Beispiel:
aus {#LAYOUT:datei.css#} wird:
files/layout/datei.css?rev=1382639603
{#ADMIN:admindatei#}bindet eine zentrale Datei aus Admin-Pfad ein, bspw. die Master-CSS:
<link type="text/css" rel="stylesheet" href="{#ADMIN:include/vereinonline.css#}">
Zur Info: Diese wird immer bei Dialogen (&dialog=1) verwendet, zzgl. der evtl. vorhandenen main.css im Layout-Verzeichnis.
{#STYLES#}bindet alle wichtigen VereinOnline-JS/Style-Angaben ein (TinyMCE, Kalender, Colorpicker, u.a.).
Sollte innerhalb HTML/HEAD stehen.
{#TITLE#}Die Überschrift der Seite inkl. Vereinsname
{#CHARSET#} Der Zeichensatz gemäß $farmconfig["charset"] bzw. "iso-8859-1" wenn nicht definiert
Top-Menü
{#MODULES#}
   <a href="{#MODULELINK#}">
      {#MODULENAME#}
   </a>
{#/MODULES#}
Eine Schleife über alle Module (Register).
Innerhalb der Schleife sind beliebige HTML-Elemente (diese werden für alle Module wiederholt) inkl. folgende Platzhalter möglich:
{#MODULENAME#}
Der Modulname, z.B. "Mitglieder"
{#MODULENAMESUB#}
Der Untermodulname. Kann bei der Definition einer statischen Seite so eingegeben werden:
Name: MODULNAME~UNTERMODULNAME
{#MODULELINK#}
Der HTML-Link, der zum Aufruf des Moduls führt (# falls leer)
{#MODULETARGET#}
Beginnt der Link mit "http", dann "_new" sonst "_parent"
{#MODULECLASS#}
Beginnt der Link mit "?module=" dann das Modul, das dahinter steht, sonst leer
{#MODULESELECTED#}
wird ersetzt durch "moduleselected" oder "moduleunselected", je nach dem, ob das aktuelle Modul ausgewählt ist oder nicht (ggf. MODULESELECTED1, MODULESELECTED2, .. für bestimmt Schachtelungstiefen).
{#MODULESELECTED?AA:BB#}
wird ersetzt durch "AA" oder "BB", je nach dem, ob das aktuelle Modul ausgewählt ist oder nicht.
{#MODULEMENU?wenn-untermenumenu:wenn-kein-untermenu#}
hiermit sind bedingte HTML-Teile möglich, abhängig davon, ob das Modul Untermenüs hat oder nicht.
{#MODULEMENU:clsli,clsliohne#}
Hiermit werden die Klassen für LI (mit Links) und LI (ohne Links) festgelegt.
{#MODULEMENU#}
wird ersetzt durch eine UL-LI-Aufzählung aller Untermenüpunkte
{#MODULEMENU-#}
ohne Klassenmarkierung
{#MODULENR#}
wird ersetzt durch eine laufende Nummer
{#MODULEMAIN#}
wird ersetzt durch den Modulname, falls ?module=...
{#MODULEACTIVE#}
wird ersetzt durch "active" falls der Navigationspunkt aktuell gewählt ist
{#MODULEID#} Durchlaufende Nummer aller Navigationspunkte zur eindeutigen Referenzierung
{#MODULEDBID#} Interne Datenbank-ID der statischen Seite
{#IF:MODULELINK=*linkname|*linkname2#} .. {#ELSE#} .. {#/IF#}
Bedingung für eine bestimmte Seite (| ist "oder").
{#IF:link=-#}{#MODULENAME#}{#ELSE#}{#MODULENAME#}{#/IF#}
Bedingter Abschnitz abhängig vom Linknamen.
{#MODULES(max=5)#}
legt fest, dass maximal 5 Punkte angezeigt werden (die ersten 5).
{#MODULEHASLINK?ja..:nein..#}
Ermöglicht die Variation vom HTML-Code abhängig davon, ob es für dieses Untermodul einen Link gibt oder nicht
{#MODULEHASSUBLEVEL1?ja..:nein..#}
{#IF:MODULEHASSUBLEVEL..#}...{#ELSE#}...{#/IF#}
Ermöglicht die Variation vom HTML-Code abhängig davon, ob es für dieses Untermodul ein Untermenü Level 1 gibt oder nicht
{#MODULEOPEN?ja..:nein..#}
Ermöglicht die Variation vom HTML-Code abhängig davon, ob dieses Untermodul aktuell gewählt ist oder nicht
{#MODULESUBLEVEL1#}...{#MODULESUBLEVEL1#}
Schleife über die Untermenü-Navigationspunkte 1
{#MODULESUBLEVEL1#}...{#MODULESUBLEVEL1#}
Schleife über die Untermenü-Navigationspunkte 2
{#MODULES1#}...{#/MODULES1#}Abweichung von der Modul-Schleife:
Nummerierung der Modulschleife, um mehrere haben zu können.
Unter Administration/Basiskonfiguration/Parameter sind dann Einschränkungen definierbar: modules1.visible=members,events
Navigations-Menü
{#MENU#}Zeigt das linke Navigationsmenü an
Klassenmarkierungen: menulevel0[selected], menulevel1[selected], menulevel2[selected], ...
Abweichende Klassenmarkierungen ao angebbar: {#MENU:..|..|..#}
{#NAVITEMS#}...{#/NAVITEMS#} Schleife über alle einzelnen Menü-Navigationspunke mit den Parametern {#NAVLINK#}, {#NAVCLASS#}, {#NAVSELECTED#}, {#NAVNAME#}
{#NAVITEMS1#}...{#/NAVITEMS1#} Schleife über alle einzelnen Menü-Navigationspunke der Ebene 1 mit den Parametern {#NAVLINK#}, {#NAVCLASS#}, {#NAVSELECTED#}, {#NAVNAME#}. Untermenüs werden als Dropdown dargestellt.
{#NAVITEMSLEVEL1#}...{#/NAVITEMSLEVEL1#} Schleife über die Menüs des Level 1, ersetzt werden, {#NAVLINK1#} {#NAVCLASS1#} {#NAVSELECTED1#} {#NAVSELECTED1?classselected:classnotselectzed#} {#NAVSUBSELECTED1#} {#NAVNAME1#}
{#NAVITEMSLEVEL2#}...{#/NAVITEMSLEVEL2#} Schleife über die Menüs des Level 2 innerhalb {#NAVITEMSLEVEL1#, ersetzt werden, {#NAVLINK2#} {#NAVCLASS2#} {#NAVSELECTED2#} {#NAVSELECTED2?classselected:classnotselectzed#} {#NAVSUBSELECTED2#} {#NAVNAME2#}
{#NAVITEMSLEVEL..#}...{#/NAVITEMSLEVEL..#} entsprechend weitere Levels 3, ...
{#NAVMENU#} aufklappbares Menü in responsive Designs
Parameter in den HTML-Seiten
{#TemplateParameter.NAME, Standardwert#}wird ersetzt durch die Angabe in der statischen Seite.
Beispielsweise ist in der Seite definiert:
TemplateParameter: Farbe=green, Hoehe=200
{#TemplateParameter.Farbe,red#} wird dann ersetzt durch "green"
Wenn "Farbe=.." nicht in der Seite definiert wäre, dann würde {#TemplateParameter.Farbe,red#} ersetzt durch "red"
{#Template.XYZ#}
{#Template.XYZ, Standardwert#}
Ein Parameter, der im Register "Layout" angegeben werden kann. Wenn nicht definiert, dann wird der angegebene Standardwert verwendet.
{#OPTION:b#}
...
{#/OPTION:b#}
HTML-Code, der nur angezeigt wird, wenn die Option "b" gewählt ist
(Optionen siehe unten!)
{#/OPTION:!m#}
...
{#/OPTION:!m#}
HTML-Code, der nur angezeigt wird, wenn die Option "m" NICHT gewählt ist.
{#OPTION:b,filename#}
...
{#/OPTION:b#}
Die Option gilt nur, wenn die Datei existiert.
(Optionen siehe unten!)
{#LOGIN#}Zeigt die Login-Felder (horizontal) bzw. Logout-Link und den Hilfe-Link an
{#LOGINVERTICAL#}Zeigt die Login-Felder (vertikal)bzw. Logout-Link und den Hilfe-Link an
{#LOGINPOPUP#}Zeigt das modale Fenster mit der id "logindialog" an (falls PassKeys nicht aktiviert), ansonsten den href-Link
{#LOGININFO#}Zeigt an "Angemeldet als ?"
{#LOGINFIELDS#}Übernimmt Url-Parameter in die Login-Form (nur relevant falls nicht {#LOGIN#} genutzt wird)
{#LOGINBUTTON#}Zeigt den Loginbutton inkl. der Loginfelder an.
{#ROLLENINFO#}Zeigt die Rollen der angemeldeten Person
{#FREUNDE#}
{#FREUNDE:LI#}
- {#FREUNDE:HORIZONTAL#}
Zeigt die Liste der befreundeten Vereine an (in <P>-Aufzählung)
Zeigt die Liste der befreundeten Vereine an (in <LI>-Aufzählung)
Zeigt nur einen "wechseln"-Link zur Übersichtsseite der Einheiten an
{#IF:...#}...{#ELSEIF:...#}...{#ELSE#}...{#/IF#} Bedingte Darstellung (#IF auch verschachtelt!)
{#IF:Template.XYZ#}
...
{#Template.XYZ#}
....
{#/IF#}
Ermöglicht einen bedingten Bereich, der nur übernommen wird, wenn der Parameter gesetzt ist.
{#IF:Module.xxx#}
...
{#/IF#}
Ermöglicht einen bedingten Bereich, der nur übernommen wird, wenn das angegebene Mudul aktiv ist.
{#IF:StaticPage.datenschutz#}
...
{#/IF#}
Ermöglicht einen bedingten Bereich, der nur übernommen wird, wenn die angegebene statische Seite (im Beispiel: datenschutz) existiert gesetzt ist.
{#IF:TemplateParameter.FELD#}...{#/IF#}Ermöglicht einen bedingten Bereich abhängig von einem Template-Parameter
{#IF:TemplateElement.FELD#}...{#/IF#}Ermöglicht einen bedingten Bereich abhängig von einem Template-Element-Parameter (Abschnitte)
{#IF:FILE:banner.jpg#}...{#/IF#}Ermöglicht einen bedingten Bereich abhängig vom Vorhandensein einer Datei
{#IF:FILE:TemplateParameter.BannerDatei,banner.jpg#}Ermöglicht einen bedingten Bereich abhängig vom Vorhandensein einer Datei, ggf. auch per TemplateParameter angegeben
{#IF:_LOGGEDIN#}.. {#/IF#}Innerer Bereich wird nur angezeigt falls angemeldet
{#IF:_LOGGEDOUT#}.. {#/IF#}Innerer Bereich wird nur angezeigt falls NICHT angemeldet
{#IF:_MITGLIEDSANTRAG#}.. {#/IF#}Innerer Bereich wird nur angezeigt falls der Mitgliedsantrag aktiviet
{#IF:_GASTANTRAG#}.. {#/IF#}Innerer Bereich wird nur angezeigt falls der Gastantrag aktiviet ist
{#IF:_SUBSCRIBE#}.. {#/IF#}Innerer Bereich wird nur angezeigt falls die Newsletter-Anmeldung aktiviet ist
{#IF:_SPRACHEN#} .. {#SPRACHEAKTUELL#} .. {#SPRACHEN#} .. {#/IF#}Ersetzung durch die Sprachauswahl falls die Sprachen aktiviert sind.
{#IF:_SUCHE#}...{#/IF#} Innerer Bereich wird nur angezeigt falls die Rolenrechte die globale Suche erlauben
{#IF:_SERVICE=.#}.. {#/IF#}Innerer Bereich wird nur angezeigt falls der Mandant dem angegebenen Service entspricht. (_LOGGEDINSERVICE=.. nur falls Service und angemeldet)
{#IF:_SERVICE=.,membersList:w#}.. {#/IF#}Innerer Bereich wird nur angezeigt falls der Mandant dem angegebenen Service entspricht und das Rollerecht vorhanden ist.
{#CONTENT#}Der generierte Inhalt
{#SUBPAGES#}
{#SUBPAGE#}
{#/SUBPAGES#}
Statt oder ergänzend zu {#CONTENT#} ist es möglich, sog. "Abschnitte" zu ermöglichen. Dafür müssen im Layout Dateien mit dem Namen "sektionABSCHNITTSNAM.htmlE" vorhanden sein. In der statischen Seite bei der Auswahl des betreffenden Layouts mit Abschnitten ist es dann möglich, in die Seite beliebige Abschnitte in beliebiger Reihenfolge aufzunehmen. Die gewählten PLatzhalter werden dann innerhaln der Schleife {#SUBPAGES#}...{#/SUBPAGES#} im Platzhalter {#SUBPAGE#} engesetzt. Platzhalter für Abschnitte sind:
{#TemplateParameter.NAME#} für Platzhalter, die pro Abschnitt definiert werden.
in Schleife: {#TemplateElemente#}...{#/TemplateElemente#} sind folgende Platzhalter möglich, dabei sind die Anzahl der Elemente variable in der Abschnittsdefintion der statischen Seite festlegbar:
{#TemplateElement.NAME#} ein beliebiger Text-Platzhalter
{#TemplateElement.NAMEDatei#} ein Dateiname-Platzhalter mit Dateiauswahl, z.B. für: <img src="files/{#TemplateElement.BildDatei#}">
{#TemplateElement.NAMEText#} mehrzeiliges Textfeld
{#TemplateElement.NAMEHTML#} mehrzeiliges HTML-Textfeld
{#TemplateElement.NAMEVeranstaltung.titel#} Veranstaltungs-Feld (Eingabe: Veranstaltungsauswahl, Anzeige "titel"-Feld, ggf. andere!)
{#TemplateElement.NAMEArtikel.textkurz#} Artikel-Feld (Eingabe: Artikelauswahl, Anzeige "textkurz"-Feld, ggf. andere!)
{#TemplateElement.NAMEPage#} Einbettung einer statische Seite (Eingabe: statische Seite, Anzeige Inhalt)
{#TemplateElementNr#} die laufende Nummer (0,1,2,..) des Elements
{#TemplateElementFirst#} für die Nr 0: "active", andere leer
{#TemplateElementBootstrapColumns#} berechnet die Bootstrap-Column-Wert anhand der Anzahl der Elemente (12/Anzahl, ggf. letztes Element breiter)
{#SITEMAP#}zeigt die sog. "Brotkrümelnavigationsleiste" an, <ul>{#SITEMAP#}</ul>
{#CAPTION#}wird ersetzt durch die Überschrift der Seite.
Wenn dieser Platzhalter nicht vorkommt, wird die Überschrift innerhalb des Contents ausgegeben.
{#CAPTION:H1#}wird ersetzt durch die Überschrift der Seite.
Wenn eine Überschift vorhanden ist, dann wird diese in <H1>..</H1>-Tags eingebettet.
{#IMPRESSUM#}wird ersetzt durch den Link auf das Impressum (inkl. A-Tag)
{#IMPRESSUMLINK#}wird ersetzt durch die Link-Url auf das Impressum (ohne A-Tag)
{#DATENSCHUTZLINK#}wird ersetzt durch den Link auf der Datenschutzerklärung (ohne A-Tag)
{#WERBUNG#}wird ersetzt durch den Inhalt der HTML-Vorlage "Werbung"
{#FAVICON#}wird ersetzt durch das Fav-Icon, Standard oder falls vorhanden aus Administration/Basiskonfiguration/Dateien
{#BILDERGALERIE:1234#}Zeigt die Bildergalerie mit der ID 1234 an
{#BILDERGALERIE:gruppe1691#}Zeigt eine Bildergalerie mit allen Bildern an, welche der angegebenen Gruppe zugeordnet sind
{#EXTRAINFO#}wird ersetzt durch das Ergebnis einer GetExtraInfo()-Funktion, die in einer Extension enthalten sein muss
{#SWITCHUSER#}wird ersetzt durch den Rollen-Test-Zurückschalt-Link (sofern Rollen-Test aktiviert)
{#SPRACHENAUSWAHL#}wird ersetzt durch die Sprachen-Flaggen (nur bei aktivierter Mehrsprachigkeit)
{#BODYCLASSES#}wird ersetzt durch die Klassenmarkierung des aktuellen Navigationspunktes (content, sowie der Modul- und Aktinsname): <BODY class="{#BODYCLASSES#}"> ergibt <BODY class="content members list">
{#USERNAME#}wird ersetzt durch den aktuellen Benutzernamen
{#PAGE:id#}wird ersetzt durch die statische Seite mit der angegebenen ID
{#LOGO:...#}läd die angegebene Logodatei (Angabe .jpg, läd auch alterativ ein .png oder .gif)
{#GLOBAL:...#}wird ersetzt durch den globalen Parameter, z.B. {#GLOBAL:name#}
{#LANGUAGE:...#}wird durch das übersetzte Wort ersetzt
{#TESTSYSTEM#}Zeigt den Status des Testsystems an (Stand der Datenbank/Dateien)
{#ICON:USER#} Ermöglicht die Anzeige des Mitglied-Fotos anstelle des Profil-Icons:
html.icon.user=<IMG src="fotosklein/{#foto#}" HEIGHT=10>
profile.icon.user=<IMG src="fotosklein/{#foto#}" HEIGHT=10>
Der Standardwert ist <i class="fa fa-user fa-fw"></i>
{#IMAGE:SLIDER#}Slider aller slider*.*-Bilder (bei Nutzung des Bootstrap-Framework)
{#errormessage#}Fehlermeldung vom Login
[vereinonline...]bindet die Funktionen des WordPress-Plugins ein (Funktionen [vereinonline_mitglieder(ROLLE)] eigt alle angefordeten Mitglieder unabhängig von der eigenen Rolle!)
mitglied:feld, mitglied:key_.. Zeigt ein Profildaten-Feld des aktuell angemeldeten Benutzers an
Optionen: Die Optionen, falls benötigt, stehen bei den statischen Seiten zur Auswahl bei jeder einzelnen Seite zur Auswahl. Damit sind Banner, Menüs, usf. je Seite ausblendbar. Die Optionen müssen in der Datei "template_optionen.txt" definiert werden:
b,1,Logo anzeigen m,1,Navigationsmenü links anzeigen
1. Parameter: ein eindeutiger Buchstabe, der dann auch bei {#OPTION:_#} verwendet wird 2. Parameter: 1=standardmäßig aktiviert, 0=standardmäßig nicht aktiviert 3. Parameter: Beschreibung
Aktivierung des Layouts: Unter "Administration/Basiskonfiguration/Layout" das Layout auf "Individuell" stellen.
Zurücksetzen: Falls das Template nicht funktioniert, dann kann mit folgendem Befehl auf das Standard-Modern-Umgebung zurückgestellt werden (Admin-Basiskonfiguration-Änderungsrechte erforderlich): https://__ROOTHOST__/IhrVerein/?resetlayout